Blogger Uyarı Satırı Oluşturmak

Blogger Uyarı Satırı Oluşturmak

Blogunuzda duyurumu yapmak istiyorsunuz ya da önemli bi yazınızı blogunuzda ziyaretçileriniz için göz önündemi bulundurmak istiyorsunuz bu uyarı pencereleri tam size göre.

Blogunuzun kumanda panelinden Şablon - HTML'yi düzenle - Widget Şablonlarını Genişlet kutucuğunu işaretliyoruz. Ctrl + F yardımı ile ]]></b:skin> kodunu bulun aşağıdaki kodları üst kısmına ekleyin.

.TWwarn{background:#FFF2F4 url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgzLSE9tmimgdryKIKuGwP8k6tuXI_KBFQTZXKdy2tCK9Zu1f4AvTbTmiT6fi3scwabcxz9H4hljf0OEPuozXXzkO1roAl1JQ4x8_umIRSCv3nh7sXNDMcEpcSM7AworoO_qves1uualFY/s1600/nraw2.png) center no-repeat; margin:0 auto; width:90%; display:block; border:1px solid #BE0000; background-position:7px 50%; padding:10px 10px 10px 45px; -webkit-border-radius: 4px; -moz-border-radius: 4px; border-radius: 4px; } .TWynotic{background:#fafbca url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEidfig-yWUS_kg5LVM-STIKNEqoUcm0AFPPbBAijA_vUwm2Y1qu_rs87-sQj4vaGDBvtXhiWA9okk_XHMwv81501cldRZaN4TH6az-rz6MhGk9DSCBD9A4aj_1HwMzx-ftUWWcl6JJewhuf/s1600/yellowalert.png) center no-repeat; margin:0 auto; width:90%; display:block; border:1px solid #e7ea03; background-position:7px 50%; padding:10px 10px 10px 45px; -webkit-border-radius: 4px; -moz-border-radius: 4px; border-radius: 4px; } .TWgift{background:#ddeffb url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi9efHtchRhpmosdpraXywpIP4BUHcR14ElAy4hZB-gVwrr9yWtPakhPFexYjeQdsSTFntuPJf2Eywtv6-_ViM7ecCsoIUAdmAHwI8BEWImbknEmhbeZEFTJfG0sg9_Js0nDKSg-FSQA1F_/s1600/gift.png) center no-repeat; margin:0 auto; width:90%; display:block; border:1px solid #32a9fc; background-position:7px 50%; padding:10px 10px 10px 45px; -webkit-border-radius: 4px; -moz-border-radius: 4px; border-radius: 4px; } .TWnoticgreen{background:#dcf9bc url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhl0LUS_oGAX5cIuDPgotEvoEq0MeZXzL-_5l45MQTjSQtu9vJcXj0_tr7r_dKV3AI87-wtovPFtBbNNMR2YwxssUNngtlTusOr0VNcNdJfn7X7X_z7LYdVl-cJ_DhNLnwAngnb-XGHyy2L/s1600/announcement-icon.png) center no-repeat; margin:0 auto; width:90%; display:block; border:1px solid #7dc945; background-position:7px 50%; padding:10px 10px 10px 45px; -webkit-border-radius: 4px; -moz-border-radius: 4px; border-radius: 4px; } .TWHEART{background:#fbd3d9 url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEibPCqQh-FyeSsPQt9zGQ5RfSr9F90-2bTZv8qQgmne4uxdcAPqV38wamyuEgLg3HtYkEBVpM_f4o8wipYU6k1Dx36uyowDkyr9f6iffo5jwrP7WnL8yrw65H8GcddcEfoXbyXy7u8N8sMc/s1600/heart.png) center no-repeat; margin:0 auto; width:90%; display:block; border:1px solid #fe3a5a; background-position:7px 50%; padding:10px 10px 10px 45px; -webkit-border-radius: 4px; -moz-border-radius: 4px; border-radius: 4px; } .TWpin{background:#f4dbf3 url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiRIRdibx38vXbB06-1y_BS89nnwqiQJYMs1HHjQlWlqEYYHA0W1WVxHcgzufaEt_7DUefLKMrHN6Ry1CujCVkZVl32vsXV62vHurTzyXpvJ3kgKlp5Zr_tFL6usaztewbMmOWt6ldkzlJw/s1600/twpin.png) center no-repeat; margin:0 auto; width:90%; display:block; border:1px solid #fb37e2; background-position:7px 50%; padding:10px 10px 10px 45px; -webkit-border-radius: 4px; -moz-border-radius: 4px; border-radius: 4px; } .TWywarn{background:#e3f0f2 url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiVqYAqWGXZX_QB3vaiu7sfulUeY8FNOUvMWwn16lT_jnUB6ub9OXIw29s5zsGUohTos_UMwNMSjYYMiTZa_yake1Eud-N10ZjcOq88qqzPetx6Iyrfw8pDIDtygusB6LQf9CVNGdMItdNT/s1600/write.png) center no-repeat; margin:0 auto; width:90%; display:block; border:1px solid #66cccc; background-position:7px 50%; padding:10px 10px 10px 45px; -webkit-border-radius: 4px; -moz-border-radius: 4px; border-radius: 4px; }

Şablonu kaydet diyerek işlemi tamamlıyoruz.

Kod:

<div class="TWwarn"> <b>Tahta Tebeşir Uyarı Satırı - Tahta Tebeşir Uyarı Satırı</b></div>

Kod:

<div class="TWpin"> <b>Tahta Tebeşir Uyarı Satırı - Tahta Tebeşir Uyarı Satırı</b></div>

Kod:

<div class="TWynotic"> <b>Tahta Tebeşir Uyarı Satırı - Tahta Tebeşir Uyarı Satırı</b></div>

Kod:

<div class="TWHEART"> <b>Tahta Tebeşir Uyarı Satırı - Tahta Tebeşir Uyarı Satırı</b></div>

Kod:

<div class="TWnoticgreen"> <b>Tahta Tebeşir Uyarı Satırı - Tahta Tebeşir Uyarı Satırı</b></div>

Kod:

<div class="TWywarn"> <b>Tahta Tebeşir Uyarı Satırı - Tahta Tebeşir Uyarı Satırı</b></div>

Kod:

<div class="TWgift"> <b>Tahta Tebeşir Uyarı Satırı - Tahta Tebeşir Uyarı Satırı</b></div>

Bu vermiş olduğum kodları şablon - html'yi düzenle - div etiketlerinin olduğu kısıma ekliceksiniz. Kolay gelsin...