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>
Blogger Spoiler Butonu Değiştirilmesi Gerekenler
- Kırmızı olarak işaretlenmiş alanlar üzerinde değişim yaparak kodları bloglarınızda kullanabilirsiniz.
Yorum Gönder