Notifications
All Notifications

How To Add Working Auto Related Post On Blogger Template Middle of the Post l Blogger

If your website is hosted in blogger, then you need this Add Working Auto Related Post On Blogger Template Middle of the Post You Can Get More Views !

Hey There, Welcome to Itz Txs. How Are You? I hope You Guys Well. As You Can Know Auto Related Post In Middle Of the Post. Today I want To Show You How To Add Working Auto Related Post On Blogger Template Middle of the Post. So, Fast Hurry Up Add This Feature In You Blogger Theme.

Follow My All Step Please And If You Get Any Problem than Comment In This Post

So, If your website is hosted in blogger, then you need this Add Working Auto Related Post On Blogger Template Middle of the Post of the content, to get more SEO and views.

You can create a great inline article link using the methods on this web page. This brings more benefits to your website.

Add Working Auto Related Post On Blogger Template Middle of the Post

First, we will see the benefits of the related post in the middle of the articles.

     Get more optimised in search results
      More than four views per visitor

This Blogger widget helps to improve your SEO rankings. This Blogger script comes with many SEO benefits. Therefore, it is commonly used by many bloggers around the world. This script automatically creates an internal link to your post on the website.

Steps To Add This Script Correctly in Blogger

Don't forget to take backup of your theme, by chance if any mistake was done , you can able to restore it.

     Go to your blogger dashboard
    Navigate to theme
    Click on drop-down menu and
       select "edit html"

First we have to add CSS, copy below code and paste under   ]]></b:skin> tag of your blogs CSS.

.arpbyitztxs{color:var(--fotT);padding:10px;margin-top:10px;margin-bottom:10px;border-radius: 15px;text-align:center;border:4px solid #eee;font-size:small}

After this you have to search for <b:defaultmarkups> <!--[ Blogger defaultmarkups ]--> <b:defaultmarkup type='Common'>

And paste the given script just below it.

<b:includable id='postTextRelated'>
<div class='postRelated' id='postRelated'>
<script>/*<![CDATA[*/ var relatedTitles = new Array(); var relatedTitlesNum = 0; var relatedUrls = new Array(); function related_results_labels(json) { for (var i = 0; i < json.feed.entry.length; i++) { var entry = json.feed.entry[i]; relatedTitles[relatedTitlesNum] = entry.title.$t; for (var k = 0; k < entry.link.length; k++) { if (entry.link[k].rel == 'alternate') {relatedUrls[relatedTitlesNum] = entry.link[k].href; relatedTitlesNum++; break;}}}} function removeRelatedDuplicates() { var tmp = new Array(0); var tmp2 = new Array(0); for(var i = 0; i < relatedUrls.length; i++) { if(!contains(tmp, relatedUrls[i])) { tmp.length += 1; tmp[tmp.length - 1] = relatedUrls[i]; tmp2.length += 1; tmp2[tmp2.length - 1] = relatedTitles[i];}} relatedTitles = tmp2; relatedUrls = tmp;} function contains(a, e) { for(var j = 0; j < a.length; j++) if (a[j]==e) return true; return false;} function printRelatedLabels() { var r = Math.floor((relatedTitles.length - 1) * Math.random()); var i = 0; document.write('<ul>'); while (i < relatedTitles.length && i < 20) { document.write('<li><a href="' + relatedUrls[r] + '">' + relatedTitles[r] + '</a></li>'); if (r < relatedTitles.length - 1) { r++; } else { r = 0;} i++;} document.write('</ul>');} /*]]>*/</script>
<b:if cond='data:post.labels'>
<b:loop index='i' values='data:post.labels' var='label'>
<b:if cond='data:i&lt;1'>
<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;' rel='preload'/>
</b:if>
</b:loop>
</b:if>
<div class="arpbyitztxs"><b class="title">Read Also</b>
<script>removeRelatedDuplicates(); printRelatedLabels();</script></div>
</div>
</b:includable>

Now we have to find <data:post.body/> and paste the below script just after the <data:post.body/> tag

<b:include cond='data:view.isPost and !data:view.isPreview' data='post' name='postTextRelated'/><script>/*<![CDATA[*/ function insertAfter(tbh,tgt) {var prt = tgt.parentNode; if (prt.lastChild == tgt) {prt.appendChild(tbh);} else {prt.insertBefore(tbh,tgt.nextSibling);}} var tgt = document.getElementById("postBody"); var midAd3 = document.getElementById("postRelated"); var showAd3 = tgt.getElementsByTagName("p"); if (showAd3.length > 0) {insertAfter(midAd3,showAd3[5]);}; /*]]>*/</script>

Save your theme.

Well done your Blogger template is Ready to Show a Stylish Related Post in the middle of the Content.


Conclusion

This is all about How To Add Working Auto Related Post On Blogger Template Middle of the Post. I hope you enjoy this article. Please do share this article. And if you are facing problem in any section or you have any question then ask us in comment box.


Blogger Code CSS Feature HTML JS Widget
Itz TxS
Itz TxS
Whats up ! My Name is Samir, a expert Web Designer, Telegram Bot Maker,Logo Designer And UI / UX designer in addition to content material writer from Feni,Dagonbhuiyan,Bangladesh. I really like to Code and create interesting things whilst playing with it.
Join the conversation
Post a Comment