How to Add Middle Related Posts in Median UI ?

Hello Blogmate's How are you ? I hope you are doing great. Most of you somehow will have noticed on many of blogs they have some recommended Posts in the middle of all the posts which were automatically generated by thier blog.

So today we are going to learn in this blog how to Middle Related Posts in Median UI, What are related posts and how to implement it.

What Are Related Posts?

Basically, All Blogger templates have a related post by default, which appears at the very end of the post. Mainly related post is article reference or recommendation, which is related to the article currently read by visitors. This means that more posts related to the topic can be read by the visitors. This method will surely prompt the visitors to click on the related article after reading the current article. Of course it can be very useful to increase some traffic to our blog.

How to Add Middle Related Posts in Median UI

• Login Your Blogger Account.
• Open your Blogger dashboard.
• Click on theme section and then edit HTML.
• Then Put all Below Code Under:

FOR MEDIAN UI V1.5

<div class='postBody' id='postBody'><data:post.body/></div>

<b:if cond='data:view.isPost and !data:view.isPreview'>

<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>

<b>Read Also : </b>

<script>removeRelatedDuplicates(); printRelatedLabels();</script>

</div>

<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[3]);}; /*]]>*/</script>

</b:if>

FOR MEDIAN UI V1.6

<div class='pS post-body postBody' id='postBody'><data:post.body/></div>

<b:if cond='data:view.isPost and !data:view.isPreview'>

<div class='pRelate' id='pRelated'>

<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>

<b>Read Also : </b>

<script>removeRelatedDuplicates(); printRelatedLabels();</script>

</div>

<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("pRelated"); var showAd3 = tgt.getElementsByTagName("p"); if (showAd3.length > 0) {insertAfter(midAd3,showAd3[3]);}; /*]]>*/</script>

</b:if>

• Then Don't Forget to Click on Save and See The Result.

(midAd3,showAd3[3] Where I have marked number 3, it means that the related post will appear after the 3rd paragraph, so please adjust it.

Keep in mind that you must use the p tag while writing the paragraph, if you use the br tag then the related post will appear at the end of the post.

Adjust the part I marked, max-results=3 The number 3 is the number of related posts you want to display.

Conclusion

So today we have discussed about How to Add Middle Related Posts in Median UI. I hope you like this post kindly do give a comment below. If you are having problem implementing this kindly contact me. Do visit regularly for getting more updates like this.

Copyright © The Taluat