Bumerang - Yazarkafe

Yazı İçerisinde Blogger Devamını Oku Eklentisi

Yazı İçerisinde Blogger Devamını Oku Eklentisi

Blogger Devamını Oku eklentisini, ana sayfadaki yazılarınızın tümüne tek kodla uygulamayı daha önceden anlatmıştık, bu yazımızın yorumlar kısmına, yazı içerisinde de istediği noktada yazıyı kısaltıp sonuna bir link koyup devamını oku özelliğini eklemek istediğini söyleyen @ebrarn isimli arkadaşımızın talebi üzerine kaleme alıyorum.Uygulayacağımız eklentinin nasıl çalıştığını merak ediyorsanız aşağıdaki demo görünüm butonuna basarak kontrol edebilirsiniz.
Demo Görünüm

Yazı İçerisine Blogger Devamını Oku linki Eklemek İçin;




1-Blogger hesabımızla giriş yapıyoruz.
2-Şablon>Html'yi Düzenle yolunu takip ediyoruz.
3-Html kodları içerisinde Ctrl+F yardımı ile ]]></b:skin> kodunu aratıp buluyoruz ve aşağıdaki kodu kopyalayıp bulduğumuz ]]></b:skin> kodunun hemen üst satırına yapıştırıyoruz.
.toggle-box {
  display: none;
}

.toggle-box + label {
  cursor: pointer;
  display: block;
  font-weight: bold;
  line-height: 21px;
  margin-bottom: 5px;
}

.toggle-box + label + div {
  display: none;
  margin-bottom: 10px;
}

.toggle-box:checked + label + div {
  display: block;
}

.toggle-box + label:before {
  background-color: #4F5150;
  -webkit-border-radius: 10px;
  -moz-border-radius: 10px;
  border-radius: 10px;
  color: #FFFFFF;
  content: "+";
  display: block;
  float: left;
  font-weight: bold;
  height: 20px;
  line-height: 20px;
  margin-right: 5px;
  text-align: center;
  width: 20px;
}

.toggle-box:checked + label:before {
  content: "\2212";
}
4-Şablonumuzu kaydedip çıkıyoruz.
5-Yazı İçerisinde Blogger Devamını Oku eklentisini kullanmak istediğimiz yere de aşağıdaki kodu Yazı yazdığımız alanda HTML modundayken yapıştırıyoruz.
<input class="toggle-box" id="identifier-1" type="checkbox" >
<label for="identifier-1">Devamını Oku!</label>
<div>Buraya Devamını Oku Linkine tıklayınca açılan pencerede görünmesini iztediğiniz yazı resim v.b şeyleri HTML modundayken HTML kodlarını ekleyin.</div>
Sonuç olarak aşağıdaki bir pencere içerisinde devamını oku eklentisini blogunuza uygalamış olacaksınız.

Yazınızı yayınlayın ve yazı içerisinde Blogger Devamını Oku eklentinizi test edin.