MyBB Türkçe Destek Forumu

MyBB Duyuru Mesaj Kutusu - CSS ve HTML kullanarak kolayca yapabiliriz.
[Resim: I6OcBF.png]

Alıntı:Demo adres: https://codepen.io/walesmd/pen/zysbv

Aşağıdaki kodu temanızın global.css kısmına ekleyin.

Kod:
.duyuru{position:relative;margin:1em;background:#F9F9F9;padding:1em 1em 1em 2em;border-left:4px solid #DDD;box-shadow:0 1px 1px rgba(0,0,0,0.125)}

.duyuru:before{position:absolute;top:50%;margin-top:-17px;left:-17px;background-color:#DDD;color:#FFF;width:30px;height:30px;border-radius:100%;text-align:center;line-height:30px;font-weight:700;font-family:Georgia;text-shadow:1px 1px rgba(0,0,0,0.5)}

.bilgi{border-color:#0074D9}

.bilgi:before{content:"i";background-color:#0074D9}

.onay{border-color:#2ECC40}

.onay:before{content:"√";background-color:#2ECC40}

.uyari{border-color:#FFDC00}

.uyari:before{content:"!";background-color:#FFDC00}

.hata{border-color:#FF4136}

.hata:before{content:"x";background-color:#FF4136}

Aşağıdaki kodu temanızın index şablonunda {$header} altına ekleyin.

Kod:
<div class="duyuru bilgi">Bu bir bilgi mesajıdır. Dilerseniz duyuru alanı olarak da kullanabilirsiniz. MyBB Türkçe Destek Forumu - MyBBTurkce.com</div>

<div class="duyuru onay">Bu bir onay mesajıdır. Dilerseniz duyuru alanı olarak da kullanabilirsiniz. MyBB Türkçe Destek Forumu - MyBBTurkce.com</div>

<div class="duyuru uyari">Bu bir uyarı mesajıdır. Dilerseniz duyuru alanı olarak da kullanabilirsiniz. MyBB Türkçe Destek Forumu - MyBBTurkce.com</div>

<div class="duyuru hata">Bu bir hata mesajıdır. Dilerseniz duyuru alanı olarak da kullanabilirsiniz. MyBB Türkçe Destek Forumu - MyBBTurkce.com</div>

Duyuru yazılarını istediğiniz gibi kendinize göre düzenleyebilirsiniz. Smile

MyPoweR