Posted by : Unknown
24 Ağustos 2012 Cuma
Bir çok blog sahibinin kullanmış olduğu güzel bir eklenti olan olan css ile hazırlanan duyuru kutuları örneklerinden bir tane de ben vermek istedim.
Bu güzel eklenti sayesinde ziyaretçilere yapmak istediğiniz duyuruları rahatlıkla yapabilirsiniz. CSS konusunda yeni olduğum için bu kutuları yapmak benimm için çok önemliydi. Umarım kullanmak isteyen arkadaşların işine yarar.
İlk olarak Html'yi Düzenle yapıp Widget Şablonlarını genişlet dedikten sonra, CTRL + F yardımıyla aşağıda yer alan kodu buluyoruz.
]]></b:skin>
Daha sonra ise şu kodları hemen yukarında yer alan kodun hemen üstüne yapıştırıyoruz.
.duyuru{background: #f94646; border-color:#0945f0; border:1px solid #C1C1C1; text-align:center; margin:0 auto 10px; padding:5px 10px; -moz-box-shadow:inset 0 0 1px #fff; -webkit-box-shadow:inset 0 0 1px #fff; box-shadow:inset 0 0 1px #fff; text-shadow:0 -1px rgba(255,255,255,0.5); font-size:15px; }
Yukarıda yer alan kodlar css kodları. Bu kodlar ile oynamalar yaparak duyuru kutusunu istediğiniz şekillendirebilirsiniz. Şimdi ise aşağıda yer alan duyuru kutusunun kodlarını ister HTML/Javascript kısmına isterseniz HTML kodları içerisinde istediğiniz bir yere yapıştırabilirsiniz.
<p class="duyuru"> <strong>Duyuru: </strong>Duyuru Yazınız Buraya Gelecek</p>
Eklenti ön izlemesi için TIKLAYINIZ!