Contextual Related Posts in Blogger Blogs

Today while looking at Google Webmaster Tools, I came across some 404 pages on Technology Inspired. Being curious, I proceeded to see which pages does Google reports as "Not Found" and I came across a strange URL, one which I have never seen associated with a blogger blog. The URL which Google reported as not being found was as follows:-

http://tweakandtrick.blogspot.com/related-content.g?q=

Update: Blogger has disallowed the related-content.g?q= page through robots.txt. It will no longer be anything worth worrying about.

Update: This was not what I expected. This was for a Related Content Search Engine.

When I checked on to see which pages linked to this page, I was surprised to see that almost all of the pages on this blog had links pointing to this page. As I did not remember placing such a link, I checked the source code of my blog. Strangely, I discovered a new bit of javascript added to it. The script which was added is as follows:-

<script type="text/javascript">
    
    function setAttributeOnload(object, attribute, val) {
      if(window.addEventListener) {
        window.addEventListener("load",
          function(){ object[attribute] = val; }, false);
      } else {
     window.attachEvent('onload', function(){ object[attribute] = val; });
      }
    }
    function showRelatedContent() {
      var el = document.getElementById('related-frame');
      if (el.style.visibility = 'visible') {
        return;
      }

      el.style.visibility = 'visible';
      el.src = '/related-content.g?q=' /* insert URL here */;
      showRelatedContent.prevOnClick = document.onclick;

      // Hide related-content dropdown when clicking anywhere but on it.
      document.onclick = function() {
        var el = document.getElementById('related-frame');
        if (el.style.visbility != 'hidden') {
          el.style.visibility = 'hidden';
        }
        document.onclick = showRelatedContent.prevOnClick;
      };
    }
    
  </script>

Anyone having basic knowledge of Java would understand that this code is for generating contextually related posts for blogger. So, this indicates that after launching the mobile supported themes, the Blogger development team is finally off to add another new and often demanded feature in blogger, and gladly it is one that will help bloggers to reduce bounce rate and display more appropriate related posts.

Investigating further, I have come to know that each blog hosted on blogger has received this new bit of code implying that this feature would be made public any time soon.

Meanwhile, you can use the related posts widget I have employed here.

Steps:-
1. Just, copy and paste this CSS in your design before </head>.

<b:if cond="data:blog.pageType == "item"">
<style type="text/css">
#related-posts{float:center;text-transform:none;height:100%;min-height:100%;padding-top:5px;padding-left:5px}
#related-posts .widget{padding-left:6px;margin-bottom:10px}
#related-posts ul{list-style-type:none;margin:0 0 0px 0;padding:0px;text-decoration:bold;font-size:12px;text-color:#000}
#related-posts ul li{background:transparent url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgpMjfYcMDThCNLH0v39SSYIwdD30wPD7-Pr5lj5lLgqxS7mzIOEmAy-h4QDqp82kLWnez4Oxn061FKJS11RfpnMCNRfhjkpDjR9uuibL-jjUTrwNv2itaeL6Tuc8s8jcHVYTOFk4JXWfo/s200/greentickbullet.png)
no-repeat;display:block;list-style-type:none;margin-bottom:13px;padding-left:30px;padding-top:0px}
#related-posts .widget h2, #related-posts h2{font-size: 12px;font-weight: bold;margin-bottom:0.75em;margin-top: 0em;padding-top: 0em;}
</style>
<script type="text/javascript">
var relatedpoststitle="You might also like:";
</script>
<script src="http://blogergadgets.googlecode.com/files/related-posts-for-blogger.js" type="text/javascript">
</b:if>

2. Copy and paste the code below under <data:post.body/>.

<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>
<b:if cond='data:blog.pageType == "item"'>
<script expr:src='"/feeds/posts/default/-/" + data:label.name + "?alt=json-in-script&callback=related_results_labels&max-results=6"' type='text/javascript'/></b:if></b:loop>
<script type='text/javascript'>
var maxresults=5;
removeRelatedDuplicates(); printRelatedLabels("<data:post.url/>");
</script>
</div>
</b:if>

3. Save the template and apply the changes.

Contextual Related Posts in Blogger Blogs - Internal Testing

Search

Arsip Blog