Blog me Related Posts widget kaise rakhe hindi main jane

दोस्तों
अगर आपने अपना ब्लॉग बना लिया है | तो आपने देखा होंगा अन्य ब्लॉग में post के निचे उनके ही ब्लॉग के कुछ सम्बंधित post you may also like करके आपको दिखाई देते है | दोस्तों कुछ ब्लॉगर थीम में ये अपने आप से आ जाता है | पर अगर आपके ब्लॉग में नहीं है तो आप आसानीसे यह रख सकते है | उसके बारे में आपको आज बताने जा रहा हु आशा है आपको पसंद आयेंगा |

चरण १. सबसे पहले blogger dashboard पर जाये | उसके बाद template edit Html करे | फिर crl + f  करके find करे</head> निचे दिखाई गयी image की तरह |

 

 चरण २. नीचे दिखाई गई कोड को copy (crl + c) करे और head के निचे pest करे 

<script type='text/javascript'>

//<![CDATA[

var relatedTitles = new Array();

var relatedUrls = new Array();

var relatedpSummary = new Array();

var relatedThumb = new Array();

var relatedTitlesNum = 0;

var relatedPostsNum = 4; // number of entries to be shown

var relatedmaxnum = 75; // the number of characters of summary

var relatednoimage = "https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgWHf3JGJaMrrKeo-dDc1SoXVYC0OgHyc98eUmxabi3_wTr2Y_9Kl0-ZT5ddmInE_ZoEzfzQdw5__A2MjKAKX6e0FF9HLltxeqo-pAahTyGdVwlEByP_1VFzpgGR-LMocchNvzoY5C5ukDV/s1600/no_image.jpg"; // default picture for entries with no image

function readpostlabels(json) {

  var entry, postimg, postcontent, cat;

  for (var i = 0; i < json.feed.entry.length; i++) {

    entry = json.feed.entry[i];

    if (i==json.feed.entry.length) { break; }

    relatedTitles[relatedTitlesNum] = entry.title.$t;

    postcontent = "";

    if ("content" in entry) {

      postcontent = entry.content.$t;

    } else if ("summary" in entry) {

      postcontent = entry.summary.$t;

    }

    relatedpSummary[relatedTitlesNum] = removetags(postcontent,relatedmaxnum);

    if ("media$thumbnail" in entry) {

      postimg = entry.media$thumbnail.url;

    } else {

      postimg = relatednoimage;

    }

    relatedThumb[relatedTitlesNum] = postimg;

    for (var k = 0; k < entry.link.length; k++) {

      if (entry.link[k].rel == 'alternate') {

        relatedUrls[relatedTitlesNum] = entry.link[k].href;

        break;

      }

    }

    relatedTitlesNum++;

  }

}

function showrelated() {

  var tmp = new Array(0);

  var tmp2 = new Array(0);

  var tmp3 = new Array(0);

  var tmp4 = 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];

      tmp3.length += 1; tmp3[tmp3.length - 1] = relatedpSummary[i];

      tmp4.length += 1; tmp4[tmp4.length - 1] = relatedThumb[i];

    }

  }

  relatedTitles = tmp2; relatedUrls = tmp; relatedpSummary = tmp3; relatedThumb = tmp4;

  for(var i = 0; i < relatedTitles.length; i++){

    var index = Math.floor((relatedTitles.length - 1) * Math.random());

    var tempTitle = relatedTitles[i]; var tempUrls = relatedUrls[i];

    var tempResum = relatedpSummary[i]; var tempImage = relatedThumb[i];

    relatedTitles[i] = relatedTitles[index]; relatedUrls[i] = relatedUrls[index];

    relatedpSummary[i] = relatedpSummary[index]; relatedThumb[i] = relatedThumb[index];

    relatedTitles[index] = tempTitle; relatedUrls[index] = tempUrls;

    relatedpSummary[index] = tempResum; relatedThumb[index] = tempImage;

  }

  var somePosts = 0;

  var r = Math.floor((relatedTitles.length - 1) * Math.random());

  var relsump = r; 

  var output;

  var dirURL = document.URL;

  while (somePosts < relatedPostsNum) {

    if (relatedUrls[r] != dirURL) {

      output = "<div class='relatedsumposts'>";

      output += "<a href='" + relatedUrls[r] + "' rel='nofollow'  target='_self' title='" + relatedTitles[r] + "'><img src='" + relatedThumb[r] + "' /></a>";

      output += "<h6><a href='" + relatedUrls[r] + "' target='_self'>" + relatedTitles[r] + "</a></h6>";

      output += "<p>" + relatedpSummary[r] + " ... </p>";

      output += "</div>";

      document.write(output);

      

      somePosts++;

      if (somePosts == relatedPostsNum) { break; }

    }

    if (r < relatedTitles.length - 1) {

      r++;

    } else {

      

      r = 0;

    }

    if(r==relsump) { break; }

  }

}

function removetags(text,length){

  var pSummary = text.split("<");

  for(var i=0;i<pSummary.length;i++){

    if(pSummary[i].indexOf(">")!=-1){

      pSummary[i] = pSummary[i].substring(pSummary[i].indexOf(">")+1,pSummary[i].length);

    }

  }

  pSummary = pSummary.join("");

  pSummary = pSummary.substring(0,length-1);

  return pSummary;

} 

function contains(a, e) {

  for(var j = 0; j < a.length; j++) if (a[j]==e) return true;

  return false;

}

//]]>

</script>

सूचना :

- जो आपको पिंक कलर से url दिख रहा है वह default picture है,उसे replace URL in pink कर दे अपने खुद के ब्लोग से
- यहा हमने ४ पोस्ट रखे है आप रेड कलर से जाकर उसे बदलकर ज्यादा भी कर सकते है अगर आपको  the value in red (4)
- यहा हमने पोस्ट के characters 75 रखें है आप ब्लू कलर से बदलकर ज्यादा कर सकते है  the value in blue (75)

चरण ३.

अब आपको निचे दिया code को copy करना है  उसे search करना

<a expr:href='data:label.url' rel='tag'><data:label.name/></a><b:if cond='data:label.isLast != &quot;true&quot;'>,</b:if>

उसके बाद ये निचे वाला code copy करके उपर वाले code पर pest करना है  

<b:if cond='data:blog.pageType == &quot;item&quot;'>

    <script expr:src='&quot;/feeds/posts/default/-/&quot; + data:label.name + &quot;?alt=json-in-script&amp;callback=readpostlabels&amp;max-results=50&quot;' type='text/javascript'/>

  </b:if>

चरण ४.  उसके बाद अब आपको निचे दिया code को copy करना है  उसे search करना 

</b:includable>          
                <b:includable id='postQuickEdit' var='post'>

उसके बाद ये निचे वाला code copy करके उपर वाले code पर pest करना है  

<b:if cond='data:blog.pageType == &quot;item&quot;'>

  <div class='post-footer-line post-footer-line-4'>

    <div id='relatedpostssum'><div style='text-align: left; font-size: 15px; margin-bottom: 10px; font-weight: bold;'>RELATED POSTS</div>

      <script type='text/javascript'>showrelated();</script>

    </div>

    <div style='clear:both;'/>

  </div>

</b:if>

चरण ५. 

अंत में  ]]></b:skin>

को search करना है उसके बाद ये निचे वाला code copy करके ]]></b:skin>   पर pest करना है 

<relatedsumposts {

  float: left;

  margin: 0px 5px;

  overflow: hidden;

  text-align: center;

  /* width and height of the related posts area */

  width: 120px;

  height: 210px;

}

.relatedsumposts:hover { 

background-color: #F3F3F3; -webkit-border-radius: 10px;

-moz-border-radius: 10px;

border-radius: 10px;

}

.relatedsumposts img:hover {

-khtml-opacity:0.4;

-moz-opacity:0.4;

opacity:0.4;

}

.relatedsumposts a {

  /* link properties */

color: #linkcolor;

  display: inline;

  font-size: 10px;

  line-height: 1;

}

.relatedsumposts img {

  /* thumbnail properties */

margin-top: 2px;

  height: 82px;

  padding: 5px;

  width: 82px;

border: 1px solid #fff;

-webkit-border-radius: 100px;

-moz-border-radius: 100px;

border-radius: 100px;

-webkit-box-shadow: 0 1px 2px rgba(0, 0, 0, .4);

-moz-box-shadow: 0 1px 2px rgba(0, 0, 0, .4);

box-shadow: 0 1px 2px rgba(0, 0, 0, .4);

}

.relatedsumposts h6 {

  /* title properties */

  display: table-cell;

  height: 5em;

  margin: 5px 0 0;

  overflow: hidden;

  padding-bottom: 2px;

  vertical-align: middle;

  width: 130px;

}

.relatedsumposts p {

  /* summary properties */

border-top: 1px dotted #777777;

border-bottom: 1px dotted #777777;

color: #summarycolor;

  font-size: 10px;

  height: 4em;

  line-height: 1;

  margin: 5px 0 0;

  overflow: hidden;

  padding: 5px 0 15px 0;

  text-align: left;

}

सुचना :

-अगर आपको widget एरिया की width या height बदलना है Modify the values in red to adjust the width (120) and height (210) of the widget area

-Replace #linkcolor with the hex value of your color to change the color of post titles

-To change the size of thumbnails, modify the values marked in pink (82)

-To determine the border roundness, modify the values in green (100)

-To change the color of the post snippet, change #summarycolor with color hex value

अंत में preview and save your template.

Thanks !