İpuçları&öneriler - Kategori Arka Plan Görüntüsü | Xenforo Türkçe Destek, XenForo Eklenti ve Tema Topluluğu

İpuçları&öneriler Kategori Arka Plan Görüntüsü

XFdestek

Kurucu Üye
XFD Üyesi
Katılım
25 May 2014
Mesajlar
832
Tepkime puanı
364
Puanları
63
Konum
Türkiye
Kod, kategoriler için arka plan resim eklemenizi sağlar. Yapmanız gereken tek şey, kategori için görüntünün bir bağlantısını belirtmek, X'i kategori kimliğiyle değiştirmek.

Önerilen görüntü genişliği en az 800 pikseldir.
kategorilerin yüksekliği, kategori başlık boyutu vb renk, yazı tipi adı, açıklama, değiştirme yeteneği

extra.less
extra.less ekle:
/* Categories Images and Title */
.block--categoryX .block-header {
background: blue url("../images/cover-image.jpg") no-repeat center / cover;
color: #FFF;
overflow: hidden;
}
/**********/
/* Categories Title Hover */
.block--categoryX .block-header a:hover {
color: #FFF;
text-decoration: none;
opacity: .7;
}
/**********/
/* Categories Descriptions */
.block--categoryX .block-desc {
color: #000;
}
/**********/
/* Categories Images and Title Responsive */
@media (max-width: @xf-responsiveMedium)
{
    .block--categoryX .block-header {
        max-height: inherit;
    }
}
/**********/
Kodun ikinci versiyonu
Kodun ikinci versiyonu:
/* Categories Images and Title */
.block--categoryX .block-header {
background: blue url("../images/cover-image.jpg") no-repeat center / cover;
max-height: 60px;
text-transform:;
font-weight: bold;
font-size: 20px;
font-family: cursive;
color: #FFF;
text-shadow: black 0.1em 0.1em 0.2em;
overflow: hidden;
}
/**********/
/* Categories Title Hover */
.block--categoryX .block-header a:hover {
color: #FFF;
text-decoration: none;
opacity: .7;
}
/**********/
/* Categories Descriptions */
.block--categoryX .block-desc {
color: #000;
text-transform:;
font-family: monospace;
text-shadow:
   -1px -1px 0 #FFF,
    1px -1px 0 #FFF,
    -1px 1px 0 #FFF,
     1px 1px 0 #FFF;
}
/**********/
/* Categories Images and Title Responsive */
@media (max-width: @xf-responsiveMedium)
{
    .block--categoryX .block-header {
        max-height: inherit;
    }
}
/**********/
Kategorilerin açıklamasını yalnızca forumun listesinde gizlemek istiyorsanız, bu kodu ekleyin.:
/* Hide Categories Descriptions */
.block--categoryX .block-desc {
display: none;
}
/**********/
Hayırlı olsun
 
  • Beğen
Tepkiler: Dominar
Lütfen Javascript'i etkinleştirin!Javascript'i etkinleştirin!