Merhaba, Jetto.NET Topluluğu!

Bugünkü konumuzda postbit üzerinde kullanıcı fotoğrafını eklemeyi göstereceğiz. Eklenti ile yapmak isteyenler için aşağıdaki bağlantıdan ilgili eklentiyi indirip yapabilirsiniz. Eklentisiz yapmak isteyenler için, içeriğimizdeki adımları takip edebilirsiniz.

İndirme bağlantısını görmek için Giriş Yap veya Kayıt Ol.

Admin Panele giriş yapalım

Admin panele giriş yaptıktan sonrasında 'Özelleştirme -> Şablon grupları -> Şablon gurubu ekle' diyerek bir adet şablon grubu oluşturalım. Örnek olarak resimdeki gibi işlem yapabilirisiniz;

Daha sonrasında Şablonlar diyerek arama kısmına 'messageSidebar' yazarak şablonu kopyala diyelim. Şablonu kopyalarken aşağıdaki kodu belirttiğim kısmına yapıştırın. Daha sonrasında şablonu kopyalayın.

<div class="messageAuthorBackground" style="background-image: url({@$userProfile->getCoverPhoto()->getURL()});"></div>

Tema ayarlarını yapalım

Şimdi oluşturduğumuz şablonu mevcut temaya uygulamamız gerekiyor. Bunun içinde 'Özelleştirme -> temalar-> temanızı düzenleyin' Temayı düzenlerken en aşağıda Şablon Grubu kısmı bulunuyor, bu kısma oluşturduğumuz şablon grubunu seçelim.

Daha sonrasında ayarları kaydedin.

CSS ayarlarını yapalım

Artık son aşama css kodlarımızı eklememiz gerekiyor. 'Özelleştirme -> Global CSS and SCSS' adımlarını takip ederek aşağıdaki kodları ekleyip kaydedin.

/* Postbit arka plan resmi */
@include screen-md-up {
	.messageSidebar {
		.messageAuthorBackground {
			position: absolute; 
			top: 0; 
			left: 0; 
			width: 100%;
			height: 120px;
			background-size: cover;
			background-position: center center;
		}

		.userAvatar {
			margin-top: 30px;
		}

		.userAvatarImage {
			border: 4px $wcfSidebarBackground solid;
		}
	}
}
/* Postbit arka plan resmi */

İşlem bu kadar, artık Kapak Fotoğraflarını kullanıcı postbitinde gösterebileceksiniz.