[Test User]

Aşağıda verdiğim kodlar sayesinde MyBB sitelerinize görselde olduğu gibi 5 adet renkli duyurular ekleyebileceksiniz.

Admin KP   Şablonlar &Temalar   Kullandığınız Tema  CSS Ekle 

Dosya Adını Weba-duyuruv2.css yapın. Kendi içeriğimi yazmak istiyorum seçin. Aşağıdaki kodu alana yapıştırın.

Kod:

.duyuru1 {
background-color:#9601db;
border-radius:1vh;
    border: 1px solid #000000;
    text-align: center;
    color:white;
    margin: 10px auto;
    padding: 5px 20px;
}
.duyuru2 {
background-color:#ff0a0a;
border-radius:1vh;
    border: 1px solid #000000;
    text-align: center;
    color:white;
    margin: 10px auto;
    padding: 5px 20px;
}
.duyuru3 {
background-color:#848383;
border-radius:1vh;
    border: 1px solid #000000;
    text-align: center;
    color:white;
    margin: 10px auto;
    padding: 5px 20px;
}
.duyuru4 {
background-color:#02ff75;
border-radius:1vh;
    border: 1px solid #000000;
    text-align: center;
    color:white;
    margin: 10px auto;
    padding: 5px 20px;
}
.duyuru5 {
background-color:#ff10a9;
border-radius:1vh;
    border: 1px solid #000000;
    text-align: center;
    color:white;
    margin: 10px auto;
    padding: 5px 20px;
}

Şablonlar   Kullandığınız tema   Header - [Üst Kısım] Şablonlar alanına girin. Bu şablon kodlarında, {$bannedwarning} bulun ve üstüne aşağıda verilen kodları, istediğiniz gibi düzenleyerek ekleyin.

Kod:

.duyuru1 {
background-color:#9601db;
border-radius:1vh;
    border: 1px solid #000000;
    text-align: center;
    color:white;
    margin: 10px auto;
    padding: 5px 20px;
}
.duyuru2 {
background-color:#ff0a0a;
border-radius:1vh;
    border: 1px solid #000000;
    text-align: center;
    color:white;
    margin: 10px auto;
    padding: 5px 20px;
}
.duyuru3 {
background-color:#848383;
border-radius:1vh;
    border: 1px solid #000000;
    text-align: center;
    color:white;
    margin: 10px auto;
    padding: 5px 20px;
}
.duyuru4 {
background-color:#02ff75;
border-radius:1vh;
    border: 1px solid #000000;
    text-align: center;
    color:white;
    margin: 10px auto;
    padding: 5px 20px;
}
.duyuru5 {
background-color:#ff10a9;
border-radius:1vh;
    border: 1px solid #000000;
    text-align: center;
    color:white;
    margin: 10px auto;
    padding: 5px 20px;
}

Bu işlemlerden sonra duyurularınız görseldeki gibi görünecektir.
Kaynak: Webailesi.