MyBB Devamını Oku MyCode
MyPoweR
13-01-2024, 00:08
MyBB forumunuzda konularınıza, yorumlarınıza Devamını Oku şeklinde bir buton ekleyebilirsiniz, yazınız böylece açılır kapanır hale gelecektir. Nasıl yapacağımızı sırayla yazıyorum, takip edebilirsiniz.
1 — Admin KP Temalar Kullandığınız Tema CSS Oluştur
Stil Adı: devaminioku.css
İlişkilendirilen: Genel Stil
'Kendi içeriğimi yazmak istiyorum' u işaretleyin, aşağıdaki kodları ekleyip kaydedin.
CSS kodlarıyla kendinize göre oynama yapabilirsiniz. Örneğin max-height:150px kısmını isteğinize göre ayarlayabilirsiniz. Böylece ne kadar yükseklikte Devamını Oku özelliği devreye gireceğini kendiniz belirleyebilirsiniz. Konunun en altındaki örnek görüntüler 150px olarak ayarlı halidir.
2 — Admin KP Şablonlar Kullandığınız Tema Headerinclude Şablonlar headerinclude en altına aşağıdaki kodu ekleyip kaydedin.
3 — Admin KP Forum Ayarları Mykod Yönetimi Yeni Mykod Ekle Aşağıdaki gibi ayarları yapıp kaydedin.
Mykod Başlığı: Devamını Oku
Kısa Bilgi: Uzun mesajları devamını oku şeklinde kısaltmaya yardımcı olur.
Düzenli İfade:
Yerine Gösterilecek İfade:
Aktif Edilsin Mi?: Evet
4 — Devamını Oku özelliği eklemek istediğimiz paragrafın başına [devam] sonuna [/devam] şeklinde kodlarımızı eklememiz yeterli.
1 — Admin KP Temalar Kullandığınız Tema CSS Oluştur
Stil Adı: devaminioku.css
İlişkilendirilen: Genel Stil
'Kendi içeriğimi yazmak istiyorum' u işaretleyin, aşağıdaki kodları ekleyip kaydedin.
Kod:
.readmore{border:1px solid #214f7e;background-color:#fdf6e3;transition:max-height 0.5s ease;overflow:hidden;max-height:150px;width:90%;margin:10px auto;padding:15px;border-left:4px solid #214f7e;position:relative}
.readmore.expanded{max-height:none}
.readmore-button-container{position:relative;color:#214f7e;border-bottom:1px solid #214f7e;padding-bottom:3px;margin:0 0 10px 0;font-style:normal;font-weight:700}
.readmore-button{margin-right:10px}
CSS kodlarıyla kendinize göre oynama yapabilirsiniz. Örneğin max-height:150px kısmını isteğinize göre ayarlayabilirsiniz. Böylece ne kadar yükseklikte Devamını Oku özelliği devreye gireceğini kendiniz belirleyebilirsiniz. Konunun en altındaki örnek görüntüler 150px olarak ayarlı halidir.
2 — Admin KP Şablonlar Kullandığınız Tema Headerinclude Şablonlar headerinclude en altına aşağıdaki kodu ekleyip kaydedin.
Kod:
<script>
function toggleReadMore(button) {
var content = button.closest('.readmore');
content.classList.toggle('expanded');
var readMoreButton = content.querySelector('.readmore-button');
if (content.classList.contains('expanded')) {
readMoreButton.innerHTML = "Gizle";
} else {
readMoreButton.innerHTML = "Devamını Oku";
}
}
</script>
3 — Admin KP Forum Ayarları Mykod Yönetimi Yeni Mykod Ekle Aşağıdaki gibi ayarları yapıp kaydedin.
Mykod Başlığı: Devamını Oku
Kısa Bilgi: Uzun mesajları devamını oku şeklinde kısaltmaya yardımcı olur.
Düzenli İfade:
Kod:
\[devam\](.*?)\[/devam\]
Kod:
<div class="readmore">
<div class="readmore-button-container">
<button class="readmore-button" onclick="toggleReadMore(this)">Devamını Oku</button>
</div>
<p>$1</p>
</div>
4 — Devamını Oku özelliği eklemek istediğimiz paragrafın başına [devam] sonuna [/devam] şeklinde kodlarımızı eklememiz yeterli.
Örnek Görüntüler [ Göster ][ Gizle ]
Herkese iyi forumlar.