Nasıl blogger bildirim kutusu oluşturabilirim.Blogger css3 mesaj,bildirim kutuları olusturma
Güncelleme, duyuru, hata, başarı, uyarı vb. ve genel bilgi bildirimi gibi çeşitli mesajlar hakkında bilgilendirmenin mükemmel bir yoludur. Kullanabilirsiniz. İyi haber, blogunuzun herhangi bir yerinde tek bir kod satırıyla Duyarlı Mesaj kutusu eklemenize yardımcı olan Blogger bildirim kutuları için kısa kodlar geliştirdiğimizdir. Kutulara daha canlı bir görünüm kazandıran yazı karakterindeki simgeleri de kullandık. Kutunuza bir başlık ve mesaj verin, siz de kullanıcılarınızı önemli duyurular hakkında uyaracak şekilde ayarlayın! Kutular akıcı ve duyarlıdır ve herhangi bir ekran boyutuna otomatik olarak uyum sağlar. Her kutunun renkleri farklıdır ve aşağıda verilen aşagıda gösterdiğimiz beş varsayılan başlığı içermeyebileceğiniz herhangi bir başlık verilebilir.
Bildirim Kutusu Demo
- Hata Kutusu
- Başarı Kutusu
- Bilgi Kutusu
- Uyarı Kutusu
- Duyuru kutusu
Bildirim kutuları için gerekli kodlar
- Öncelikle temanın yedeğini alınız.(Blogger>Tema>Yedekleme)
- Html düzenlemeye giriniz.
- (]]>
[/*---- Shortcode Notification Boxes ---*/ .sc-notification{color:#fff;line-height:1.4em;margin:10px 0 1em;padding:.7em 1.2em;background-color:#ffffe0;border:1px solid #e1db8b;font-size:15px;font-family:helvetica;text-shadow:1px 0 6px #333;box-shadow:2px 3px 6px #D7D7D7}.sc-notification .headline{font-size:17px;font-family:oswald,arial;padding-bottom:10px}.sc-notification.sc-warning{background-color:#fc402c;border:1px solid #C91704}.sc-notification.sc-alert{background-color:#FF8377;border:1px solid #F15C4C}.sc-success.sc-notification{background-color:#2ec23e;border:1px solid #039D14}.sc-info.sc-notification{background-color:#fdce09;border:1px solid #DFB400}.sc-update.sc-notification{background-color:#29b7ff;border:1px solid #069DE9}.sc-info.sc-notification div.headline::before{font-family:FontAwesome;position:relative;content:'\f05a';font-size:20px;padding-right:10px}.sc-update.sc-notification div.headline::before{font-family:FontAwesome;position:relative;content:'\f0a1';font-size:20px;padding-right:10px}.sc-alert.sc-notification div.headline::before{font-family:FontAwesome;position:relative;content:'\f06a';font-size:20px;padding-right:10px}.sc-success.sc-notification div.headline::before{font-family:FontAwesome;position:relative;content:'\f058';font-size:20px;padding-right:10px}.sc-warning.sc-notification div.headline::before{font-family:FontAwesome;position:relative;content:'\f071';font-size:20px;padding-right:10px}]
Bildirim kutularının yapılandırılması
[[update headline="Update"]Add Your Message Here.[/update]]
[[alert headline="Alert!"]Add Your Message Here.[/alert]]
[[info headline="Info"]Add Your Message Here.[/info]]
[[warning headline="Warning!"]Add Your Message Here.[/warning]]
[[success headline="Success"]Add Your Message Here.[/success]]
ƳƠƦƲMԼƛƦ