Merhaba Elitmatik okuyucuları bu yazımızda sizlere bloggerda Css kod ile uyarı kodları ile mesaj kutusu yapımı göstermek istedim...Aşağıda gördüğünüz gibi 4 adet uyarı şekli vardır.Bunları nasıl kullanacağınız hakkında bilgilendirmek istedim

Kumanda Paneli > Şablon > HTML'yi Düzenle >  yolunu takip ettikten sonra; CTRL+F yardımıyla aşağıdaki kodu aratıyoruz.

                                                                                                             

]]></b:skin>

Yukarıdaki kodu bulduktan sonra hemen üzerine gelecek şekilde aşağıdaki kodlarımızı yapıştırıyoruz.

/* Bu CSS Dökümanı Bloglamazamani tarafından duzeltilmistir */ 
body { background-color:#f9f9f9; width:600px; padding:10px 0 0 0; margin:0 auto; font:12px/23px Tahoma, Geneva, sans-serif; } 
.logo { margin:10px 0 20px 0; text-align:center; } .basarili { background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhdPHM1_0MBdDypO3bJnqMZ31ZcQbrovSxgys4aR6_lbP9_FK-MxbDJRg2iRxqSEOiMu9qYin9r2uOW9hlNBGYyEpHnVaXHDq8h46DXD6pVv9T-pr9YXi8_i8O_qiUjpdC-54AVcOKUxVw/s1600/buton-sprite.png) #eefec2 no-repeat left; background-position: left -11px; height:60px; line-height:60px; padding:0 0 0 60px; margin:0 0 10px 0; border:1px solid #badc5d; -webkit-border-radius: 3px; -moz-border-radius: 3px; border-radius: 3px; } 
.uyari { background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhdPHM1_0MBdDypO3bJnqMZ31ZcQbrovSxgys4aR6_lbP9_FK-MxbDJRg2iRxqSEOiMu9qYin9r2uOW9hlNBGYyEpHnVaXHDq8h46DXD6pVv9T-pr9YXi8_i8O_qiUjpdC-54AVcOKUxVw/s1600/buton-sprite.png) #ffe59d no-repeat left; background-position: left -89px; height:60px; line-height:60px; padding:0 0 0 60px; margin:0 0 10px 0; border:1px solid #c8b26f; -webkit-border-radius: 3px; -moz-border-radius: 3px; border-radius: 3px; } 
.hata { background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhdPHM1_0MBdDypO3bJnqMZ31ZcQbrovSxgys4aR6_lbP9_FK-MxbDJRg2iRxqSEOiMu9qYin9r2uOW9hlNBGYyEpHnVaXHDq8h46DXD6pVv9T-pr9YXi8_i8O_qiUjpdC-54AVcOKUxVw/s1600/buton-sprite.png) #fcd5d5 no-repeat left; background-position: left -159px; height:60px; line-height:60px; padding:0 0 0 60px; margin:0 0 10px 0; border:1px solid #a76464; -webkit-border-radius: 3px; -moz-border-radius: 3px; border-radius: 3px; } 
.bilgilendirme { background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhdPHM1_0MBdDypO3bJnqMZ31ZcQbrovSxgys4aR6_lbP9_FK-MxbDJRg2iRxqSEOiMu9qYin9r2uOW9hlNBGYyEpHnVaXHDq8h46DXD6pVv9T-pr9YXi8_i8O_qiUjpdC-54AVcOKUxVw/s1600/buton-sprite.png) #e9f1f4 no-repeat left; background-position: left -229px; height:60px; line-height:60px; padding:0 0 0 60px; margin:0 0 10px 0; border:1px solid #566a76; -webkit-border-radius: 3px; -moz-border-radius: 3px; border-radius: 3px; }

Yukarıdaki kodları ekledikten sonra şablonu kaydedelim ve çıkalım. İşlem tamam ama bunları konuya nasıl ekleyeceğiz ? Hemen söyleyeyim aşağıda gördüğünüz kodların hangisini kullanmak istiyorsanız yeni yayın açarken Oluştur bölümünün yanındaki HTML kısmını açıyoruz ve bu kodları ekliyoruz.

<div class="basarili"> BLOGLAMA ZAMANI onay kutusudur.</div> 
<div class="hata"> BLOGLAMA ZAMANI hata kutusudur.</div> 
<div class="uyari"> BLOGLAMA ZAMANI uyari kutusudur.</div> 
<div class="bilgilendirme"> BLOGLAMA ZAMANI bilgilendirme kutusudur.</div>

Duyuru: Makale tarafımızca yazılmıştır, Alıntı yaparken kaynak belirtmek zorundasınız...

İlgili Aramalar:Css uyarı kodları, Css, Blogger eklentileri, Css mesaj kutusu

Etiketler: Blogger Eklentileri

Bu yazıyı sitenizde/forumunuzda paylaşmak için aşağıdaki linkleri kullanabilirsiniz..

URL:

HTML Link:

Forum Link:

Blogger eklentileri