Blog yazılarınızın altında Linkwithin benzeri (Related Posts) Bunlarda ilginizi çekebilir posts yazılarınızı imleç üzerine geldiğinde ter...

...

Blog yazılarınızın altında Linkwithin benzeri (Related Posts) Bunlarda ilginizi çekebilir posts yazılarınızı imleç üzerine geldiğinde ters çevirerek yazı başlık ismini resmin arkasında gösteren Related Posts İlgili mesajların farklı versiyonu. 2015 senesine çok kısa bir süre kaldı. Bu süre içinde birçok site Benzer yazılar eklenti kendilerine yük getirmesinden dolayı uygulamalarını kaldırmaya başlayarak okuyucu pörtföyüne e-posta yolu ile mesaj göndererek Aralık 2014 tarihinden itibaren Benzer yazılar Related Posts App’lerinin artık çalışmayacağını bildiriyor. Dolayısı ile artık blog yazılarınızın altında Linkwithin benzeri farklı uygulamalar çalışmayacak. Maalesef üzülerek sizlere belirtmek isterim ki! Birkaç gündür bu konuda yazı yazıyorum. Böyle önemli bir konuya yaklaşım gösterip de soru soran, Sevdaninsokagi.blogspot yemek kategorisinde yazı yazan ve admin yazar arkadaşımız Sn. +Sevda Şen Ünsev hanfendiye, göstermiş oldukları araştırmacı ruh ve ilgisi için çok teşekkür ederim.

Tüm yazar arkadaşlara bir kez dah hatırlatmak istediğim konu ; Related Posts ilgili mesajlar eklentisi tüm özel tema tasarım ve Blogger varsayılan şablonlarında kullanılmakta olduğudur. DEMO

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 Widget Stil 4 kullanımı :

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 şu etiketi bulun.( ]]></b:skin> )

]]></b:skin>

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 ==== */

.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 5 */
.related-post-style-5,
.related-post-style-5 li {
  margin:0;
  padding:0;
  list-style:none;
  word-wrap:break-word;
  overflow:hidden;
}
.related-post-style-5 .related-post-item {
  display:block;
  float:left;
  width:110px;
  height:auto;
  padding:10px;
  border-left:1px solid #eee;
}
.related-post-style-5 .related-post-item:first-child {border-left:none}
.related-post-style-5 .related-post-item-wrapper {
  display:block;
  position:relative;
  overflow:hidden;
}
.related-post-style-5 .related-post-item-thumbnail {
  display:block;
  margin:0;
  width:110px;
  height:110px;
  max-width:none;
  max-height:none;
  background-color:transparent;
  border:none;
  padding:0;
}
.related-post-style-5 .related-post-item-tooltip {
  display:block;
  background-color:black;
  background-color:rgba(0,0,0,.9);
  position:absolute;
  top:0;
  right:0;
  bottom:0;
  left:0;
  padding:10px;
  line-height:normal;
  font-style:italic;
  color:white;
  overflow:hidden;
  display:none;
}
.related-post-style-5 .related-post-item:focus .related-post-item-tooltip,
.related-post-style-5 .related-post-item:hover .related-post-item-tooltip {display:block}

/* ==== Related Post Widget End ==== */

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 -->
<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: false,
      moreText: &quot;Read More&quot;,
      widgetStyle: 5,
      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 -->