Blogger için Pop up Eposta Aboneliği Eklentisi #2

İlginizi çekebilecek içerik bağlantısı: Blogger için Pop up Eposta Aboneliği Eklentisi

Daha önceden paylaştığım eklentiden farklı olarak bu eklentiyi istediğimiz yerden aktif edebiliyoruz. İster menü, ister footer, isterseniz sidebar. Bu böyle uzar gider. Bu eklentiyi aktif etmek için gereken tek şey <a href="#kayitol">Kayıt ol</a> bağlantısını kullanmanız.

1. Adım
Blogger > Tema > HTML'yi Düzenle kısmına girip ]]></b:skin> kodunu buluyoruz. Bulduğumuz bu kodun hemen üzerine aşağıdaki CSS kodlarını ekliyoruz.

[.giasubs{position:fixed;top:0;right:0;bottom:0;left:0;background:rgba(0,0,0,0.8);z-index:99999;opacity:0;-webkit-transition:opacity 400ms ease-in;-moz-transition:opacity 400ms ease-in;transition:opacity 400ms ease-in;pointer-events:none}
.giasubs:target{opacity:1;pointer-events:auto}
.giasubs > div{width:400px;position:relative;margin:10% auto;padding:5px 20px 13px 20px;border-radius:10px;background:#fff}
.close{background:#606061;color:#FFFFFF;line-height:25px;position:absolute;right:-12px;text-align:center;top:-10px;width:24px;text-decoration:none;font-weight:bold;-webkit-border-radius:12px;-moz-border-radius:12px;border-radius:12px;-moz-box-shadow:1px 1px 3px #000;-webkit-box-shadow:1px 1px 3px #000;box-shadow:1px 1px 3px #000;-webkit-transition:opacity 400ms ease-in;-moz-transition:opacity 400ms ease-in;transition:opacity 400ms ease-in}
.close:hover{background:#ff3d00}
.giasubs-button{font-family:'merriweather';margin:0 auto;width:100%}
.giasubs-input{font-family:'merriweather'}
.giasubs-input:hover{border:1px solid #ff3d00}
.giasubs h3{color:#ff3d00;font-size:25px;font-weight:800;text-align:center;margin-bottom:10px}]

2. Adım
<body ya da <body> kodunu bulup aşağıdaki HTML kodlarını bir satır altına ekliyoruz.

[<div class='giasubs' id='kayitol'>
<div>
<a class='close' href='#Kapat' style='color: #888;' title='Kapat'><i class='fa fa-times'/></a>
<h3><i class='fa fa-envelope-o'/> En yeni içerikler Posta kutunuza gelsin</h3>
<p style='text-align:center'>Yeni eklenen içeriklerden haberdar olmak için eposta adresiniz ile buradan kaydolun.</p>
<form action='https://feedburner.google.com/fb/a/mailverify' method='post' onsubmit='window.open('https://feedburner.google.com/fb/a/mailverify?uri=gereksizislerinadamiblog', 'popupwindow', 'scrollbars=yes,width=550,height=520');return true' target='popupwindow'>
<input class='giasubs-input' name='email' placeholder='Eposta adresiniz' type='text'/>
<button class='giasubs-button' type='submit'>Kayıt ol</button>
<input name='uri' type='hidden' value='gereksizislerinadamiblog'/>
</form>
</div>
</div>]

gereksizislerinadamiblog yazan yerlere kendi feedburner adınızı yazın.
İşlem bu kadar basit, geriye sadece eklentiyi etkinleştirecek komut kaldı. Komutu nereye koyacağınız tamamen size kalmış. İsterseniz yazınıza eklediğiniz bağlantıyla bile aktifleştirebilirsiniz. Örnek: <a href="#kayitol">Kayıt ol</a>

3. Adım
Aşağıdaki kodu blogunuzun herhangi bir yerine ekleyin ve kullanmaya başlayın.