.block-header:before {
background: #f2930d;
color: #fff;
width: 40px;
height: 30px;
text-align: center;
margin-top: -5px;
border-top-left-radius: 4px;
border-bottom-right-radius: 50%;
position: absolute;
left: 0;
content: "\f164";
vertical-align: middle;
display: inline-block;
font: normal normal normal 14px/1 FontAwesome;
font-size: inherit;
text-rendering: auto;
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
}
.block-header a {
padding-left: 35px;
}
Hocam her kategorinin farklı iconunu nasıl yaparızAşağıdaki kodları,
extra.less şablonuna ekle,
Kod:.block-header:before { background: #f2930d; color: #fff; width: 40px; height: 30px; text-align: center; margin-top: -5px; border-top-left-radius: 4px; border-bottom-right-radius: 50%; position: absolute; left: 0; content: "\f164"; vertical-align: middle; display: inline-block; font: normal normal normal 14px/1 FontAwesome; font-size: inherit; text-rendering: auto; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; } .block-header a { padding-left: 35px; }
Renkleri ve iconu kendine göre ayarla,
Ekli dosyayı görüntüle 4832
Eklenmiştir.Kurallara uyana ikinci sorusu cevaplanır
Sitenizi profilinize eklediniz mi?
.block--category5 .block-header:before {
background: #f2930d;
color: #fff;
width: 40px;
height: 30px;
text-align: center;
margin-top: -5px;
border-top-left-radius: 4px;
border-bottom-right-radius: 50%;
position: absolute;
left: 0;
content: "\f164";
vertical-align: middle;
display: inline-block;
font: normal normal normal 14px/1 FontAwesome;
font-size: inherit;
text-rendering: auto;
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
}
hocam kategori yazısının üzerine geliyor ve kapatıyor siteye bakabilirsiniz.Yukarıda verdiğim kodu her kategori için ayrı ayrı eklemen gerekir,
Örneğin; Kategori ID no su 5 se;
Kod şu şekilde olacak.
Kod:.block--category5 .block-header:before { background: #f2930d; color: #fff; width: 40px; height: 30px; text-align: center; margin-top: -5px; border-top-left-radius: 4px; border-bottom-right-radius: 50%; position: absolute; left: 0; content: "\f164"; vertical-align: middle; display: inline-block; font: normal normal normal 14px/1 FontAwesome; font-size: inherit; text-rendering: auto; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; }
Farklı bir görünüm için alternatif header yapısını kolayca seçebilirsiniz.
Tam ekran ve dar ekran modları arasında geçiş yapın.
Izgara modu ile içerikleri kolayca inceleyin ve düzenli bir görünüm elde edin.
Arka plan görselleriyle içeriğinizi düzenli ve görsel olarak zengin bir şekilde görüntüleyin.
Yan paneli gizleyerek daha geniş bir çalışma alanı oluşturun.
Yan paneli sabitleyerek sürekli erişim sağlayın ve içeriğinizi kolayca yönetin.
Temanızın yanlarına box tarzı bir çerçeve ekleyebilir veya mevcut çerçeveyi kaldırabilirsiniz. 1300px üstü çözünürler için geçerlidir.
Köşe yuvarlama efektini açıp kapatarak görünümü dilediğiniz gibi özelleştirin.
Tarzınızı yansıtan rengi belirleyin ve estetik uyumu sağlayın.
Bu sitenin çalışmasını sağlamak için temel çerezleri ve deneyiminizi geliştirmek için isteğe bağlı çerezleri kullanıyoruz.