Blogger Blogspot’a Küçük Resimlerle İlgili Yayınlar Widget’ı Nasıl Eklenir?

Blogger için Küçük Resimli İlgili Gönderiler Widget’ı blogger’ın mevcut yazının ilgili gönderilerini okuyucularınıza göstermesi için bir widget’a sahip olması gerekir Bu size birçok yönden yardımcı olacaktır ve ilk şey, blogunuzun sayfa görüntülemelerini artırmanıza ve hemen çıkma oranını azaltmanıza yardımcı olmasıdır. Ayrıca bu iki avantajın yanı sıra harika bir görünüm oluşturur.

Küçük Resim İçeren İlgili Yazılar Blogger'a Nasıl Eklenir?

Blogger için Küçük Resimli İlgili Gönderiler Widget‘ı blogger’ın mevcut yazının ilgili gönderilerini okuyucularınıza göstermesi için bir widget’a sahip olması gerekir Bu size birçok yönden yardımcı olacaktır ve ilk şey, blogunuzun sayfa görüntülemelerini artırmanıza ve hemen çıkma oranını azaltmanıza yardımcı olmasıdır. Ayrıca bu iki avantajın yanı sıra harika bir görünüm oluşturur.

DEMO

Küçük Resim İçeren İlgili Yazılar Blogger’a Nasıl Eklenir? 

ADIM: 1 – Arama kutusunu etkinleştirmek ve </head> etiketini bulmak için,  Blogger, Kontrol Paneli > Şablon “Tema” > sağ üstte üç nokta tikla ve HTML’yi Düzenle’ye gidin.
 
Uyarı Notu: İşlemlere başlamadan önce blogunuzun yedeğini kesin alın.
 
ADIM: 2CTRL + F 
 
ADIM: 3 – Aşağıdaki Etiketin hemen altına aşağıdaki kodları kopyala – yapıştır. 
 
</head>

<!–Related Posts with thumbnails Scripts and Styles Start–> <!– remove –><b:if cond=’data:blog.pageType == &quot;item&quot;’> <style type=’text/css’> #related-posts{float:left;width:auto;} #related-posts a{border-right: 1px dotted #eaeaea;} #related-posts a:hover{background: #f2f2f2;} #related-posts h2{margin-top: 10px;background:none;font:18px Oswald;padding:3px;color:#999999; text-transform:uppercase;} #related-posts .related_img {margin:5px;border:4px solid #f2f2f2;width:100px;height:100px;transition:all 300ms ease-in-out;-webkit-transition:all 300ms ease-in-out;-moz-transition:all 300ms ease-in-out;-o-transition:all 300ms ease-in-out;-ms-transition:all 300ms ease-in-out;} #related-title {color:#222;text-align:center;padding: 0 10px;font-size:14px Oswald; line-height:16px;text-shadow:0 2px 2px #fff;height:28px;width:100px;} #related-posts .related_img:hover{border:4px solid #E8E8E8;opacity:.7;filter:alpha(opacity=70);-moz-opacity:.7;-khtml-opacity:.7}</style> <script type=’text/javascript’ src=’http://makingdifferent.github.io/blogger-widgets/related_posts_widget.js’ /> <!– remove –></b:if>

<!--Related Posts with thumbnails Scripts and Styles End-->. 

 

Widget’ın yüksekliğini veya genişliğini değiştirmek için yukarıdaki kodda 100 piksel kırmızı renkli, yükseklik ve genişlik değerini düzenleyebilirsiniz.

 
İlgili yazı başlıklarının rengini ve boyutunu değiştirmek için Mavi renkli değeri düzenleyebilirsiniz. 
 
İlgili yazıların ana sayfada da görüntülenmesini istiyorsanız Yeşil renkli satırları kaldırın. Daha sonra karar değiştirirseniz bu makaleyi Favorilerinize ekleyin.
 
ADIM: 4 CTRL + F kullanarak blogunuzun HTML’sinde aşağıdaki Etiketi bulun, aynı etiketi birkaç yerde bulacaksınız. Doğru sonucu alabilmek için ilk ikinci etiketten sonra denemeye başlayabilirsiniz. Kaydedin ve yeni sekmede açacağınız blogunuzda sonucu kontrol edin. Herşey yolunda ise, okumaya devam edin…

<div class=’post-footer’>

ADIM: 5 – Şimdi, hemen üstüne, aşağıdaki kodu kopyalayıp yapıştırın.

 
<!-- Related Posts with Thumbnails Code Start-->
<b:if cond='data:blog.pageType == &quot;item&quot;'>
<div id='related-posts'>
<b:loop values='data:post.labels' var='label'>
<b:if cond='data:label.isLast != &quot;true&quot;'>
</b:if>
<b:if cond='data:blog.pageType == &quot;item&quot;'>
<script expr:src='&quot;/feeds/posts/default/-/&quot; + data:label.name + &quot;?alt=json-in-script&amp;callback=related_results_labels_thumbs&amp;max-results=5&quot;' type='text/javascript'/></b:if></b:loop>
<script type='text/javascript'>
var currentposturl=&quot;<data:post.url/>&quot;;
var maxresults=5;
var relatedpoststitle=&quot;<b>Related Posts:</b>&quot;;
removeRelatedDuplicates_thumbs();
printRelatedLabels_thumbs();
</script>
</div><div class='clear'/>
</b:if>
<b:if cond='data:blog.url == data:blog.homepageUrl'><b:if cond='data:post.isFirstPost'>
<a href='http://www.bloggerwidgetgenerators.com'><img alt='Blogger Widgets' src='http://3.bp.blogspot.com/-K65p5zLLKQk/T3ObCINoP7I/AAAAAAAABmI/dF84-alnOu4/s1600/best+blogger+tips.png'/></a>
</b:if>
</b:if>
<!-- Related Posts with Thumbnails Code End-->
 

Düzenleme değeri 5  maxResults = 5 görüntülü olmasını istediğiniz mesajların sayısı ile. İlgili gönderinin ana sayfada da görüntülenmesini istiyorsanız yeşil renkli etiket satırlarıkaldırın. 

 

Related Posts : CRTL + F aratın, İlgili mesajlar yazın. Bu metinin hemen üstünde var maxresults=5; etiketini görüyorsanız doğru yerdesiniz.


ADIM: 6 – Şablonu kaydedin.

Süper tüm anlatım bitti şimdi makale altında Related Posts görülüyor mu? birkaç farklı yazı açarak kontrol edin.

11.07.2021 Pazar, 12:19’da Revize edilmilmiştir.
Kaynak:http://www.bloggerwidgetgenerators.com/2014/02/related-posts-widget-for-blogger-blogspot.html.

Yazar Adnan Güney

Samsun-Turkey doğumlu. 1989-2005 Temsa Mitsubishi Sabancı Otomotiv grubunda çalıştı. Araştırma, Geliştirme, Web siteleri ile uğraşma ve Paylaşımı seven biri.

Yorum yazarak bir çiçek'de siz dikin.

Google, Android 12 ile birlikte oyun geliştiriciler için yeni API'ler getirmeye hazırlanıyor. Teknoloji devi, yeni mobil işletim sistemi ile birlikte gelecek olan yenilikleri düzenleyici geliştirici etkinliği ile tanıtacak.

Google, Android 12 İçin Yeni Oyun API’leri Üzerinde Çalışıyor

Resident Evil serisinin en son oyunu Village, 4,5 milyon kopya satış yakaladı. Oyun bu hızla devam ederse rekor kırabilir.

Resident Evil Village rekora koşuyor