How to Show Related Post in Between Blog Posts

How to Install Related Post plugin in between your blog posts - Hi guys I Hope you are enjoying my blog. You know guys I'm working harder to make your blog dashing. Anyways I have a new plugin for your blog, I got this plugin on an Indonesian Blogger Blog - "You can read that article from

Before you install it on your own blog, make sure to take a look of this plugin by clicking on the below demo button.


Now if you like it and want to install it, then simply follow the below simple steps to add this plugin.

How to Show Related Post In Between Blog Posts?

1. At the first, visit to your blogger dashboard
2. Go to the "TEMPLATE" section.
3. Click on "EDIT HTML" button.
4. Copy the Below CSS code and paste it just before ]]></b:skin> or </style>

/*RelatedPost*/.post-terkait{display:block;position:relative;background:#fff;padding:0;margin:15px auto 20px;width:100%}.post-terkait h4{background:#07ACEC;padding:7px 10px;display:inline-block;font-size:12px;text-transform:uppercase;color:#fff;border-radius:3px;line-height:normal;border:0}.post-terkait h4:before{display:none}.post-terkait ul{margin:0;padding:0}.post-terkait ul li{list-style:none;padding:1px 0;line-height:1.5em}.post-terkait a{color:#07ACEC;font-size:13px}.post-terkait a:hover{color:#000;text-decoration:underline}

Find the Below Code (Any one code).

<data:post.body/> 

!-->OR<--! 

<div class='artbody' itemprop='articleBody description'><data:post.body/></div>

Now Replace it with the below Code

<div expr:id='&quot;post1&quot; + data:post.id'/>

<div class='post-terkait'>

<b:if cond='data:post.labels'>

<b:loop values='data:post.labels' var='label'>

<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&amp;max-results=3&quot;' type='text/javascript'/>

</b:if>

</b:loop>

</b:if>

<h4>See Also</h4>

<script type='text/javascript'>

removeRelatedDuplicates();

printRelatedLabels();

</script>

</div>

<div expr:id='&quot;post2&quot; + data:post.id' class='artbody' itemprop='articleBody description'><data:post.body/></div>

<script type='text/javascript'>

var obj0=document.getElementById(&quot;post1<data:post.id/>&quot;);

var obj1=document.getElementById(&quot;post2<data:post.id/>&quot;);

var s=obj1.innerHTML;

var t=s.substr(0,s.length/3);

var r=t.lastIndexOf(&quot;&lt;br&gt;&quot;);

if(r&gt;0) {obj0.innerHTML=s.substr(0,r);obj1.innerHTML=s.substr(r+4);}

</script>

After that, copy the below code and paste it just before </head>

<div expr:id='&quot;post1&quot; + data:post.id'/>

<div class='post-terkait'>

<b:if cond='data:post.labels'>

<b:loop values='data:post.labels' var='label'>

<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&amp;max-results=3&quot;' type='text/javascript'/>

</b:if>

</b:loop>

</b:if>

<h4>See Also</h4>

<script type='text/javascript'>

removeRelatedDuplicates();

printRelatedLabels();

</script>

</div>

<div expr:id='&quot;post2&quot; + data:post.id' class='artbody' itemprop='articleBody description'><data:post.body/></div>

<script type='text/javascript'>

var obj0=document.getElementById(&quot;post1<data:post.id/>&quot;);

var obj1=document.getElementById(&quot;post2<data:post.id/>&quot;);

var s=obj1.innerHTML;

var t=s.substr(0,s.length/3);

var r=t.lastIndexOf(&quot;&lt;br&gt;&quot;);

if(r&gt;0) {obj0.innerHTML=s.substr(0,r);obj1.innerHTML=s.substr(r+4);}

</script>

Save the template, refresh your blog and see the magic.
That's it! I hope you like this plugin! Stay tuned for more cool plugins!

Share this post