Linkwithin Formatında Benzer Yazılar Eklentisi

Blog’unuz da yayınlanmış yazılar altında Linkwithin benzeri (Related Posts) Bunlarda ilginizi çekebilir posts yazılarınızı gösterip iste...

...

Blog’unuz da yayınlanmış yazılar altında Linkwithin benzeri (Related Posts) Bunlarda ilginizi çekebilir posts yazılarınızı gösterip istediğiniz gibi özelleştirebileceğiniz Related Posts İlgili mesajlar eklentisi. 2015 yeni yıla başladığımız bu ilk günlerde hiçbir özelleştirme yapamadığınız Linkwithin site eklentisinin yerine artık kendinizin özelleştirme yapabileceği Related Posts benzer makaleler veya Bunlarda ilginizi çekebilir eklentisini üye kayıtsız, reklamsız tamamen size ait olarak kullanabileceksiniz.

2015 ocak ayı sonuna kadar birçok site kendilerine yük teşkil ettiği gerekcesi ile Related Posts eklentisini kapatıyor. Bunlarda ilginizi çekebilir eklenti uygulaması birçok site için artık çalışır durumda olmayacak. Bunlarda ilginizi çekebilir eklentileri, Blogger Özel Tema Tasarım ve tüm bloglar da kullanılmakta olup, tüm veriler kendi blogunuz dan çekilmektedir.

Bu neden ile farklı sitelerde farklı eklentiler arayışına girmenize artık gerek duymayacaksınız. Yeni eklentimizin nasıl çalıştığını görmek için Adnan Güney klasik blog’umdan inceleyebilirsiniz. Açılan sayfayı her yenilediğinizde farklı yazılar göreceksiniz. Eklentiyi kendi blog’unuz da kullanmak için aşağıdaki adımları takip etmeniz yeterli olacaktır.

Related Posts eklenti kurulum aşamaları :

Öncelikle her türlü hatalara karşı önlem olarak blog’unuzun bir yedeğini alın. Blogger yedek alma ile ilgili konuyu ;

Okuyun ⇒ Blogunuzu iki şekilde yedekleyeceğinizi biliyormusunuz

Related Posts Bunlarda ilginizi çekebilir eklenti kurulumu :

1. Blogger kumanda paneline giriş yapın.

2. Şablon kodlarınızı açın. İmlecinizi kod içinde bir yere tıklayın ve CTRL + F arama özelliği ile CSS kodlarının düzenlendiği aşağıda verilen etiketi bulun.

]]></b:skin>

CSS başlangıç ve bitiş etiket grubu

3. Bulduğunuz bu etiketin hemen üstüne aşağıda verilen CSS kodlarını kopyalayıp yapıştırın. CSS kodlarını yapıştırdıktan sonra blog’u kaydedin.

/* ==== Related Post Widget Start AG ==== */
.related-post {
  margin:2em auto 0;
  font:normal normal 11px/1.4 Arial,Sans-Serif;
}
.related-post h4 {
  font-size:150%;
  margin:0 0 .5em;
}

/* Style 3 */
.related-post-style-3,
.related-post-style-3 li {
  margin:0;
  padding:0;
  list-style:none;
  word-wrap:break-word;
  overflow:hidden;
}
.related-post-style-3 .related-post-item {
  display:block;
  float:left;
  width:110px;
  height:auto;
  padding:10px;
  border-left:1px solid #eee;
  margin-bottom:-989px;
  padding-bottom:999px;
}
.related-post-style-3 .related-post-item:first-child {border-left:none}
.related-post-style-3 .related-post-item-thumbnail {
  display:block;
  margin:0 0 10px;
  width:110px;
  height:110px;
  max-width:none;
  max-height:none;
  background-color:transparent;
  border:none;
  padding:0;
}
.related-post-style-3 .related-post-item-title {font-weight:bold}
/* ==== Related Post Widget End AG ==== */

4. Blog şablanlarında arayacağımız 2. kod birkaç tane olduğundan dolayı sizin bulduğunuz kodun hemen üst kısmında şu etiket ve kodlar vardır. Bu kodları görüyorsanız doğru yerdesiniz.

“ post.hasJumpLink ”

5. Şimdi aşağıda verilen etiketi aratın.

<div class='post-footer'>

6. Bulduğunuz etiketin üst kısmında 4. maddede anlatılan (post.hasJumpLink) etiketi varsa doğru yerdesiniz. Arama sonucu bulduğunuz etiketin hemen üstüne aşağıdaki kodları ekleyin ve blog’u kaydedin.

<!-- Related Post Widget Start AG -->
<b:if cond='data:blog.pageType == &quot;item&quot;'>
  <div id='related-post' class='related-post'/>
  <script type='text/javascript'>
  var labelArray = [<b:if cond='data:post.labels'><b:loop values='data:post.labels' var='label'>
          &quot;<data:label.name/>&quot;<b:if cond='data:label.isLast != &quot;true&quot;'>,</b:if>
      </b:loop></b:if>];
  var relatedPostConfig = {
      homePage: &quot;<data:blog.homepageUrl/>&quot;,
      widgetTitle: &quot;&lt;h4&gt;Bunlarda ilginizi çekebilir :&lt;/h4&gt;&quot;,
      numPosts: 4,
      summaryLength: 370,
      titleLength: &quot;auto&quot;,
      thumbnailSize: 110,
      noImage: &quot;data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAIAAACQd1PeAAAAA3NCSVQICAjb4U/gAAAADElEQVQImWOor68HAAL+AX7vOF2TAAAAAElFTkSuQmCC&quot;,
      containerId: &quot;related-post&quot;,
      newTabLink: true,
      moreText: &quot;Read More&quot;,
      widgetStyle: 3,
      callBack: function() {}
  };
  </script>
  <script type='text/javascript' src='http://blogger-json-experiment.googlecode.com/svn/resources/related-post/related-post.min.js'/>
</b:if>
<!-- Related Post Widget End AG -->

Related Posts Widget Stil 5 kodların özelleştirilmesi :

1. widgetTitle : “Bunlarda ilginizi çekebilir” farklı bir yazı ile değişebilirsiniz.

2. numPosts : Yazı altında görülmesini istediğiniz link sayısı.

3. summaryLength : Özet yazı uzunluğu

4. titleLength : Mesaj başlığı otomatik ayarlıdır.

5. thumbnailSize : Resminizin ebadını belirler. Değerleri temanızın genişliğine göre değiştirin.

Not: Resim ebadını değiştirdiğinizde, CSS kodlarında bulunan width:110px; iki yerde mevcut, height:110px; değerlerini de değiştirin. Bu değerleri değiştirmezseniz CSS doğru çalışmaz.

6. noImage : Yazınızda görülmeyen resimlerin yerine çıkan otomatik resimdir.

7. containerId : Bu ayarı ellemeyin. Kod taşıyıcı ıd.

8. newTabLink : Yazı linkini yeni sekmede açan kod bağlantısıdır. False : Linki yeni sekmede açar. True : Linki ana sayfa içinde açar. Tercih sizin, false ve true küçük harfle yazın.

NOT: Kodlar üzerinde değişiklik yaparken lütfen tırnak işaretlerinin silinmemesine dikkat edin. Eklediğiniz kod çalışmıyorsa silin ve tekrar kaydedin. Ana sayfanızda kontrol ederken birkaç dk. bekleyin. Kısa bir süre sonra kodlar çalışmaya başlayacaktır.

İlgili Konular ⇒ Related Posts hakkında ilgili diğer yazılar.