Related Article middle Blogger Widget Full Code

Script Code

    Search </head> in your blogger template and paste above by using below code.

     
        <style type='text/css'>
    .arpianz{background:#FFF;position:relative;display:inline-block;border:2px dashed #DDD;margin:22px 0}
    .arpianz h4{background:#393939;font-family:Poppins,sans-serif;color:#fff;font-size:12px;font-weight:700;position:absolute;top:-21px;left:2.5%;padding:8px 18px;border:1px solid #DDD;border-radius:5px;text-transform:uppercase}
    .arpianz h4:before{
          content:'\25bc';
          right: 10px;
          bottom: 0;
          font-family:FontAwesome;
          font-style: normal;
          font-weight: 400;
          margin: 0 10px 0 0;
          color: #fff;
          }
    .arpianz ul{
    padding-top: 12px;
    list-style: none;
    padding-right: 8px;
    }
    .arpianz ul a:before{font-family:fontawesome;content:'\25b6';padding-right:10px}
    .arpianz li{border-radius:5px;border-bottom:1px solid rgba(227,227,227,0.33);line-height:1.7em}
    .arpianz li:hover {text-decoration: underline;}
    </style>
    <b:if cond='data:blog.pageType == "item"'>
    <script type='text/javascript'>
    //<![CDATA[
    // Articles Related to Middle of Posts by Technical Arp
    var arpianz = new Array(); var arpianzNum = 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]; arpianz[arpianzNum] = entry.title.$t; for (var k = 0; k < entry.link.length; k++) { if (entry.link[k].rel == 'alternate') {relatedUrls[arpianzNum] = entry.link[k].href; arpianzNum++; 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] = arpianz[i];}} arpianz = 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((arpianz.length - 1) * Math.random()); var i = 0; document.write('<ul>'); while (i < arpianz.length && i < 20) { document.write('<li><a href="' + relatedUrls[r] + '">' + arpianz[r] + '</a></li>'); if (r < arpianz.length - 1) { r++; } else { r = 0;} i++;} document.write('</ul>');}
    //]]>
    </script>
    </b:if>
        

HTML Code

    Search <data:post.body/> in your blogger template and replace it by using below code.

    
    <div expr:id='"post1" + data:post.id'/>
    <div class='arpianz'>
    <b:if cond='data:post.labels'>
    <b:loop values='data:post.labels' var='label'>
    <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=7"' type='text/javascript'/>
    </b:if>
    </b:loop>
    </b:if>

    <script type='text/javascript'>
    removeRelatedDuplicates();
    printRelatedLabels();
    </script>
    </div>
    <div expr:id='"post2" + data:post.id'><p><data:post.body/></p></div>
    <script type='text/javascript'>
    var obj0=document.getElementById("post1<data:post.id/>");
    var obj1=document.getElementById("post2<data:post.id/>");
    var s=obj1.innerHTML;
    var t=s.substr(0,s.length/2);
    var r=t.lastIndexOf("<br>");
    if(r>0) {obj0.innerHTML=s.substr(0,r);obj1.innerHTML=s.substr(r+4);}
    </script>

Hot Links