Blogger Spoiler Butonu Oluşturmak

Yazarımız : Adsız Tarih : 19 Eylül 2012 Çarşamba

Blogger Dersleri - Spoiler Butonu Oluşturmak

Blogger Dersleri kuşağında sizler için açılabilir spoiler butonu oluşturmaktan bahsedeceğim. Spoiler butonları ile blog ziyaretçileriniz için saklı bir içerik oluşturabilirsiniz. Genellikle bir kitap yada filmi izlemeyen kişiler için bilgi içeriği var bu yazıyı okuma yoksa filmin tadı kaçar anlamında kullanılan spoiler bir nevi uyarı butonu.

Blogger Dersleri Butonu Demo :

Başlık :

Blogger Spoiler Butonu Oluşturmak

Blogger Eklentisini isterseniz her sayfanızda kullanabilirsiniz. Bunun için yapmanız gereken Şablon >> Gadget Ekle >> HTML/Java Script kutucuğunu kullanarak Blogger Eklenti kodlarını eklmelisiniz .

Belirli sayfalarda kullanmak istiyorsanız ise yayın girerken HTML bölümüne Blogger Eklenti kodlarınız yapıştırmanız.

Blogger Spoiler Butonu Kodları

<div style="margin: 5px 20px 20px;"><div class="smallfont" style="margin-bottom: 2px;">Başlık :  <input value="Saklı İçeriği Göster-Spoiler" style="margin: 0px; padding: 0px; width: 60px; font-size: 10px;" onclick="if (this.parentNode.parentNode.getElementsByTagName('div')[1].getElementsByTagName('div')[0].style.display != '') { this.parentNode.parentNode.getElementsByTagName('div')[1].getElementsByTagName('div')[0].style.display = ''; this.innerText = ''; this.value = 'Hide'; } else { this.parentNode.parentNode.getElementsByTagName('div')[1].getElementsByTagName('div')[0].style.display = 'none'; this.innerText = ''; this.value = 'Show'; }" type="button"> </div><br /><div class="alt2" style="margin: 0px; padding: 6px; border: 1px inset;background: #f5f5f5 none repeat scroll 0% 50%; -moz-background-clip: -moz-initial; -moz-background-origin: -moz-initial; -moz-background-inline-policy: -moz-initial; color: rgb(127, 69, 0); line-height: 1.5em;"><div style="display:none;">Saklamak İstediğiniz İçeriği Göster<br /></div></div></div>