Sekarang di sini ialah tutorial yang untuk menampilkan related post di bawah setiap posting blog Anda, bersama dengan thumbnail. Related Posts dipilih dari posting lain yang sama kategori/label/tag.
Dengan Cara ini banyak pembaca Anda akan tetap di situs Anda untuk waktu yang cukup usang saat mereka melihat Related Posts sesuai kepentingan.
Langkah 2. Klik di mana saja di dalam area isyarat dan tekan tombol CTRL + F:
Langkah 3. Cari belahan isyarat ini menambahkan di dalam kotak pencarian (tekan Enter untuk menemukannya):
</head>
Langkah 4. Copy dan paste isyarat di bawah sebelum / di atas </ head> tag:
<!--Related Posts with thumbnails Scripts and Styles Start-->
<b:if cond='data:blog.pageType == "item"'>
<style type='text/css'>
#related-posts{float:left;width:auto;}
#related-posts a{border-right: 1px dotted #eaeaea;}#related-posts h4{margin-top: 10px;background:none;font:18px Oswald;padding:3px;color:#999999; text-transform:uppercase;}#related-posts .related_img {margin:5px;border:2px solid #f2f2f2;object-fit: cover;width:110px;height:100px;-webkit-border-radius: 5px;-moz-border-radius: 5px; border-radius: 5px; }#related-title {color:#333;text-align:center;text-transform:capitalize;padding: 0px 5px 10px;font-size:12px;width:110px; height: 40px;}</style><script type='text/j4vascript'>//<![CDATA[var relatedTitles=new Array();var relatedTitlesNum=0;var relatedUrls=new Array();var thumburl=new Array();function related_results_labels_thumbs(json){for(var i=0;i<json.feed.entry.length;i++){var entry=json.feed.entry[i];relatedTitles[relatedTitlesNum]=entry.title.$t;try{thumburl[relatedTitlesNum]=entry.gform_foot.url}catch(error){s=entry.content.$t;a=s.indexOf("<img");b=s.indexOf("src=\"",a);c=s.indexOf("\"",b+5);d=s.substr(b+5,c-b-5);if((a!=-1)&&(b!=-1)&&(c!=-1)&&(d!="")){thumburl[relatedTitlesNum]=d}else thumburl[relatedTitlesNum]='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh_qAUcJ-klo9mBiOWiDdH9KQeLoEq7pnsXuTZNJNC43H2epE3F_nCnEGZJkmHpIC2nigrAI-jYMi5AD_pmf2rUHpLW9osUR8eludL7ao3cgTdG-Y5GJQo06_FMyG3DbUm2p0_jrcnz5Cn5/s1600/no-thumbnail.png'}if(relatedTitles[relatedTitlesNum].length>35)relatedTitles[relatedTitlesNum]=relatedTitles[relatedTitlesNum].substring(0,35)+"...";for(var k=0;k<entry.link.length;k++){if(entry.link[k].rel=='alternate'){relatedUrls[relatedTitlesNum]=entry.link[k].href;relatedTitlesNum++}}}}function removeRelatedDuplicates_thumbs(){var tmp=new Array(0);var tmp2=new Array(0);var tmp3=new Array(0);for(var i=0;i<relatedUrls.length;i++){if(!contains_thumbs(tmp,relatedUrls[i])){tmp.length+=1;tmp[tmp.length-1]=relatedUrls[i];tmp2.length+=1;tmp3.length+=1;tmp2[tmp2.length-1]=relatedTitles[i];tmp3[tmp3.length-1]=thumburl[i]}}relatedTitles=tmp2;relatedUrls=tmp;thumburl=tmp3}function contains_thumbs(a,e){for(var j=0;j<a.length;j++)if(a[j]==e)return true;return false}function printRelatedLabels_thumbs(){for(var i=0;i<relatedUrls.length;i++){if((relatedUrls[i]==currentposturl)||(!(relatedTitles[i]))){relatedUrls.splice(i,1);relatedTitles.splice(i,1);thumburl.splice(i,1);i--}}var r=Math.floor((relatedTitles.length-1)*Math.random());var i=0;if(relatedTitles.length>0)document.write('<h4>'+relatedpoststitle+'</h4>');document.write('<div style="clear: both;"/>');while(i<relatedTitles.length&&i<20&&i<maxresults){document.write('<a style="text-decoration:none;margin:0 4px 10px 0;float:left;');if(i!=0)document.write('"');else document.write('"');document.write(' href="'+relatedUrls[r]+'"><img class="related_img" src="'+thumburl[r]+'"/><br/><div id="related-title">'+relatedTitles[r]+'</div></a>');if(r<relatedTitles.length-1){r++}else{r=0}i++}document.write('</div>');relatedUrls.splice(0,relatedUrls.length);thumburl.splice(0,thumburl.length);relatedTitles.splice(0,relatedTitles.length)}//]]></script></b:if><!--Related Posts with thumbnails Scripts and Styles End-->
Catatan:
- untuk mengubah lebar dan tinggi thumbnail, Ubah 110 px dan 100 px yang berwarna merah
- untuk mengubah warna dan ukuran judul Related Posts, mengubah nilai dalam biru
- Hapus bab berwarna ungu jika Anda ingin Related post yang akan ditampilkan baik di homepage dan halaman posting.
Langkah 5. Cari baris dibawah (Anda akan menemukannya dua baris, tetapi Anda cukup pilih yang pertama):
<div class='post-footer'>
Langkah 6. Tepat di atas <div class = 'post-footer'> sisipkan isyarat ini:
<!-- Related Posts with Thumbnails Code Start-->
<b:if cond='data:blog.pageType == "item"'>
<div id='related-posts'>
<b:loop values='data:post.labels' var='label'>
<b:if cond='data:label.isLast != "true"'></b:if><script expr:src='"/feeds/posts/default/-/" + data:label.name + "?alt=json-in-script&callback=related_results_labels_thumbs&max-results=5"' type='text/j4vascript'/></b:loop><script type='text/j4vascript'>var currentposturl="<data:post.url/>";var maxresults=5;var relatedpoststitle="<b>Related Posts:</b>";removeRelatedDuplicates_thumbs();printRelatedLabels_thumbs();</script></div><div class='clear'/><div style="font-size: 9px;float: right; margin: 5px;"><a style="font-size: 9px; text-decoration: none;" href="belajar-sabarr.blogspot.com/search?q=cara-tambah-related-posts-widget-untuk" rel="nofollow" >Related Posts Widget</a></div></b:if><!-- Related Posts with Thumbnails Code End-->
Catatan:
- Ubah nilai 5 dari max-results = 5 sesuai dengan jumlah postingan yang ingin ditampilkan
- kalau Anda ingin Related Posts yang akan ditampilkan pada homepage juga, hapus bab yang berwarna ungu
Update! Jika Anda tidak sanggup melihat widget related posts sesudah menyimpan template, Tambahkan isyarat (langkah 6) sempurna di atas </ b: includable> tag yang sanggup ditemukan di atas garis ini (CTRL + F untuk menemukannya):
<b:includable id='postQuickEdit' var='post'>
Untuk gosip lebih lanjut, klik gambar di bawah ini:
Langkah 7. Simpan Template dan hanya itu.
Untuk Lebih Jelasnya nonton video berikut:
Untuk Lebih Jelasnya nonton video berikut:
Sekarang Related Posts widget akan muncul di bawah setiap posting blog yang mempunyai label di atasnya. Enjoy it!
Mari berteman dengan saya
Follow my Instagram _yudha58
0 Response to "Cara Pembayaran Pajak Kendaraan Lewat E-Samsat Jawa Barat"
Posting Komentar