Şablon Özel Önek Stili Oluşturma/Düzenleme

[haydar]

arsayılan olarak, XF aşağıdaki önek stilleriyle birlikte gelir: Özel CSS sınıf adı

seçeneğini kullanarak Diğer'i kullanarak özel stil oluşturmak oldukça basittir. Bu kılavuz nasıl yapılacağını açıklayacaktır. Yeni önek stili eklemenin ve bunun tüm temel stili devralmasını sağlamanın en kolay yolu, core_labels.less şablonunu düzenlemektir. Aşağıdaki ekran görüntüsünde vurgulanan şablondaki bölümü arayın:


Ardından, özel girişlerinizi hata girişinden sonra ve kapanıştan önce } aşağıdaki gibi ekleyin :



Çekirdek kodla veya üçüncü taraf eklentilerle olası çakışmalara neden olmayacak bir ad kullanmanızı öneririm.
Tüm özel girişlerime sitemin kısaltmasıyla (önek, gedit?) önek koyuyorum -- cta -- ve ayrıca ona açıklayıcı bir ad vermeyi seviyorum, bu durumda ctaAnnouncement ön eki yayınlanan personel için olduğu için kullandım duyuru konuları.

Kıvrımlı parantez içindeki iki değer/renk (evet, İngilizce'deki tek doğru yazım budur) metin rengini, bu durumda beyaz ve arka plan rengini, bu durumda #ff8800 gösterir .

XF daha sonra otomatik olarak (gerçek kelime) kenarlığı oluşturacak ve temel CSS'yi kullanarak bu değerlere göre vurgulu renkleri oluşturacaktır.

Son olarak, öneki oluşturun:

Vanilya tarzı önekler istiyorsanız bu kadar.


Ancak, bir adım daha ileri gitmek ve simgeler, resimler veya diğer süslemeler eklemek istiyorsanız (parlak metinleri kim sevmez ?), bu da oldukça basittir. Bunun için extra.less şablonuna

özel kodunuzu ekleyeceksiniz . Bu örnekte, metnin önüne bir Font Awesome simgesi ekleyeceğim. Bunun kodu aşağıdaki ekran görüntüsünde vurgulanmıştır - bu durumda ctaAnnouncement sınıf adının core_labels.less şablonuna girdiğiniz ile eşleştiğinden emin olun . Benim örneğimdeki Harika Yazı Tipi kodu -- bullhorn -- burada bulunabilir: https://fontawesome.com/icons?d=gallery