XenForo'nun düzenleyicisine logonuzu eklemek, topluluğunuzu özelleştirmenin ve markanızı gizlice tanıtmanın basit ama etkili bir yoludur. Bu kılavuz, bu gizli ve profesyonel özelleştirmeyi elde etmek için gereken adımlarda size yol gösterir.
- Ekstra LESS Şablonuna Erişim
- XenForo yönetici panelinize gidin.
- Görünüm > Şablonlar'a gidin
- Özelleştirmek istediğiniz temanın extra.less şablonunu açın .
- Özel CSS Kodunu Ekleyin
- Aşağıdaki kodu kopyalayıp extra.less şablonuna yapıştırın:
Kod:
fr-box.fr-basic .fr-element {
position: relative;
background: none;
}
.fr-box.fr-basic .fr-element:before {
content: '';
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
background: url('https://administrata.net/data/assets/logo_default/TESTLOGO.webp') no-repeat bottom right; /* Change to your logo */
background-size: 300px; /* Adjust size as needed */
opacity: 0.2; /* Set opacity to 20% or whatever you prefer */
pointer-events: none; /* Make it non-interactive */
z-index: -1; /* Ensure it appears behind the text content */
}
/* Media query for smaller screens */
@media (max-width: 650px) {
.fr-box.fr-basic .fr-element:before {
content: ''; /* Ensure content remains empty */
background: url('https://i.ibb.co/8rFyrtW/opacity.png') no-repeat bottom right; /* Change to your logo */
background-size: 30px; /* Adjust size for mobile or whatever you prefer */
}
.fr-box.fr-basic .fr-element {
/* Optional: Add any additional styling for the element on mobile */
}
}Nasıl Çalışır
- Masaüstü Görünümü:
- Editöre logonuzu ( TESTLOGO.webp ) ince bir arka plan olarak ekler. Bağlantımı sizinkine değiştirmeyi unutmayın.
- Logo sağ alt köşede, %20 opaklıkla 300 piksele yeniden boyutlandırılmış olarak görünür . İstediğiniz gibi ayarlayın.
- Mobil Görünüm:
- Medya sorgusu kullanarak logoyu daha küçük ekranlara göre ayarlar.
- Daha küçük logo ( opacity.png ) mobil cihazlara daha iyi uyması için 30px'e yeniden boyutlandırıldı . Bağlantımı sizinkine değiştirmeyi ve istediğiniz gibi ayarlamayı unutmayın.
- Test Duyarlılığı:
- Editörün hem masaüstü hem de mobil cihazlarda nasıl göründüğünü kontrol edin.
- Logonun boyutlarını veya yerleşimini ihtiyacınıza göre ayarlayın.
- Değişikliklerinizi Yedekleyin:
- Değişiklik yapmadan önce mutlaka extra.less dosyanızı yedekleyin .
- Güvenli Deneyler Yapın:
- Canlı bir temada doğrudan değişiklik yapma konusunda emin değilseniz bir test teması kullanın.
- Bu özelleştirmeyle, XenForo editörünüz profesyonel, markalı bir dokunuşla öne çıkacak! Herhangi bir sorunuz varsa veya sorunla karşılaşırsanız, yardım istemekten çekinmeyin. İyi özelleştirmeler!
