How to create Related Post on blogger

At this time I will show you how to create a related post. This method is very useful to increase page views since the end of the article will be displayed titles of the articles are linked, so that visitors interested in opening our other articles.

Simply, do something like this:

  1. Open your Blogger account
  2. Open | Edit HTML | then give a checklist on | Expand Widget Templates |
  3. Before making changes to the code, you should do a backup first with a click on the | Download Full Template | and save.
  4. In the area of the template code find this code <data:post.body/>. Use Ctrl + F or F3 for faster.
  5. Copy the code below and paste it right below the code <data:post.body/>

    <b:if cond='data:blog.pageType == "item"'><div class='similiar'> <div class='widget-content'> <h3>Related Posts by Categories</h3> <div id='data2007'/><br/><br/><div id='hoctro'> </div><script type='text/javascript'> var homeUrl3 = &quot;<data:blog.homepageUrl/>&quot;; var maxNumberOfPostsPerLabel = 4;var maxNumberOfLabels = 10; maxNumberOfPostsPerLabel = 100;maxNumberOfLabels = 3; function listEntries10(json) { var ul = document.createElement(&#39;ul&#39;); var maxPosts = (json.feed.entry.length &lt;= maxNumberOfPostsPerLabel) ? json.feed.entry.length : maxNumberOfPostsPerLabel; for (var i = 0; i &lt; maxPosts; i++) {var entry = json.feed.entry[i]; var alturl;for (var k = 0; k &lt;; k++) { if ([k].rel == &#39;alternate&#39;) { alturl =[k].href;break;}} var li = document.createElement(&#39;li&#39;); var a = document.createElement(&#39;a&#39;);a.href = alturl; if(a.href!=location.href) {var txt = document.createTextNode(entry.title.$t); a.appendChild(txt);li.appendChild(a);ul.appendChild(li); }} for (var l = 0; l &lt;; l++) { if ([l].rel == &#39;alternate&#39;) { var raw =[l].href;var label = raw.substr(homeUrl3.length+13); var k; for (k=0; k&lt;20; k++) label = label.replace(&quot;%20&quot;, &quot; &quot;); var txt = document.createTextNode(label); var h = document.createElement(&#39;b&#39;);h.appendChild(txt); var div1 = document.createElement(&#39;div&#39;);div1.appendChild(h); div1.appendChild(ul); document.getElementById(&#39;data2007&#39;).appendChild(div1);}}} function search10(query, label) { var script = document.createElement(&#39;script&#39;); script.setAttribute(&#39;src&#39;, query + &#39;feeds/posts/default/-/&#39; + label +&#39;?alt=json-in-script&amp;callback=listEntries10&#39;); script.setAttribute(&#39;type&#39;, &#39;text/javascript&#39;); document.documentElement.firstChild.appendChild(script);} var labelArray = new Array();var numLabel = 0; <b:loop values='data:posts' var='post'> <b:loop values='data:post.labels' var='label'> textLabel = &quot;<>&quot;; var test = 0; for (var i = 0; i &lt; labelArray.length; i++) if (labelArray[i] == textLabel) test = 1;if (test == 0) { labelArray.push(textLabel); var maxLabels = (labelArray.length &lt;= maxNumberOfLabels) ? labelArray.length : maxNumberOfLabels;if (numLabel &lt; maxLabels) { search10(homeUrl3, textLabel);numLabel++;}}</b:loop></b:loop> </script></div></div></b:if>

  6. Click | Save Template |
  7. Done.

The result is like below.

related post

You can replace 'Related Post' (red color) with the words you like. For example, Other Articles, Read Also, or something like that. To show the 10 titles of related articles, change the number 6 (red color) with 10.

Hopefully useful :)

Related Posts by Categories