Blogger Devamını Oku Eklentisi

 Bu yazımda, yazıların birbirine karışmaması ve daha az yer kaplaması için kullanabileceğiniz havalı bir eklentiyi paylaşıyorum.

Nasıl Eklenir ?

• Blogger yönetim paneline giriş yapıyoruz.
• Tema → HTML'yi Düzenle yolunu izleyerek sitemizin kaynak kodlarına ulaşıyoruz.
• Kodların içerisinde her hangi bir yere bir kere tıklayıp Ctrl+F yardımı ile ]]></b:skin> kodunu aratıyoruz ve hemen üzerine aşağıdaki Css kodunu ekliyoruz.
#more {display: none;}
• Ardından </body> kodunu aratıyoruz, onunda üzerine aşağıdaki JavaScript kodunu ekliyoruz. Ve temamızı kaydediyoruz.
function myFunction() { var dots = document.getElementById("dots"); var moreText = document.getElementById("more"); var btnText = document.getElementById("myBtn"); if (dots.style.display === "none") { dots.style.display = "inline"; btnText.innerHTML = "Devamını Oku"; moreText.style.display = "none"; } else { dots.style.display = "none"; btnText.innerHTML = "Daha Az Göster"; moreText.style.display = "inline"; } }
• Son olarak eklentinin gözükmesini istediğimiz yere aşağıdaki HTML kodunu ekliyoruz, gerekli düzenlemeleri yaptıktan sonra test edebiliriz.
<p>Gözükecek olan yazı.<span id="dots">...</span><span id="more">Gizli yazı.</span></p><button onclick="myFunction()" id="myBtn">Devamını Oku</button>

ÖN İZLE TIKLA