பிளாக்கர்க்கு மிக எளிமையான Related Posts Widget சேர்ப்பது எப்படி? | கற்போம்

பிளாக்கர்க்கு மிக எளிமையான Related Posts Widget சேர்ப்பது எப்படி?

நமது பதிவுகளை படிக்கும் நண்பர்கள், அடுத்த் பதிவுகளை படிக்க ஈர்ப்பவை நாம் பதிவிற்கு கீழே சேர்க்கும் தொடர்புடைய பதிவுகள் என்ற Wdiget தான். பெரும்பாலும் படங்களுடன் இருக்கும் இந்த Widget-கள் இருக்கிறது. ஆனால் படங்கள் இன்றி வேண்டும் என்று நினைப்பவர்களுக்கு மிக எளிமையான Widget எப்படி சேர்ப்பது என்பது தான் இந்தப் பதிவு. 



இது எப்படி இருக்கும் என்று கேட்பவர்கள், கீழே உள்ள படத்தில் காணலாம். 


இதை எப்படி உங்கள் பதிவிற்கு கீழே சேர்ப்பது?

1. முதலில் Blogger--> Template--> Backup Your Template சென்று உங்கள் Template -ஐ தரவிறக்கம் செய்து கொள்ளவும்.

2. இப்போது Edit HTML என்பதை கொடுக்கவும்.அதில் Expand Widgets என்பதை கிளிக் செய்து விடவும்.

3. இப்போது CTRL+F மூலம் </head> என்பதை தேடவும்.

4. கிடைத்தவுடன் கீழே உள்ள கோடிங்கை </head> க்கு மேலே Paste செய்யவும்.

<!--Related Posts Scripts and Styles Start www.karpom.com-->
<b:if cond='data:blog.pageType == &quot;item&quot;'>
<style>
.related-post-int{background:url() no-repeat;height:36px;width:auto;display:block;}
.related-post{padding:5px; background:#eeeeee;border-bottom:1px solid #EAEAEA;border-left:1px solid #EAEAEA;border-right:1px solid #EAEAEA;}
.related-post a:link,.related-post a:visited{display:block; height:26px; line-height:26px; text-decoration:none; border-bottom:solid 1px #EAEAEA;color:#000000;}
.related-post a:hover{text-decoration:underline;color:#000000;}
.related-post h2{display:none;}
.related-post ul{list-style-type:none;}
</style>
<script type='text/javascript'>
var relatedpoststitle=&quot;Related Posts&quot;;
</script>
<script type='text/javascript'>

//<![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() {
for(var i = 0; i < relatedUrls.length; i++)
{
if(relatedUrls[i]==currentposturl)
{
relatedUrls.splice(i,1)
relatedTitles.splice(i,1)

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

if(relatedTitles.length>1) document.write('<h2>'+relatedpoststitle+'</h2>');
document.write('<ul>');
while (i < relatedTitles.length && i < 20 && i<maxresults) {
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>
<!--Related Posts Scripts and Styles End www.karpom.com-->
5. இப்போது உங்கள் Template-ஐ Save செய்து கொள்ளவும்.

6. மீண்டும் <data:post.body/> என்பதை அதே பக்கத்தில் தேடவும்.

7. இப்போது கீழே உள்ள கோடிங்கை  <data:post.body/>  க்கு கீழே Paste செய்யவும். (Voting Widgetகளை வைத்து இருந்தால் அதனை கண்டுபிடித்து அதில் கடைசிக்கு கீழே இதை சேர்க்கவும். Voting Widget இல்லாதவர்கள் நேரடியாக கீழே சேர்க்கலாம். )

<!-- Related Posts Code Start  www.karpom.com -->
<b:if cond='data:blog.pageType == &quot;item&quot;'>
<div class='related-post-int'/><b>தொடர்புடைய பதிவுகள் :</b><div class='related-post'>
<b:loop values='data:post.labels' var='label'>
<b:if cond='data:label.isLast != &quot;true&quot;'>
</b:if>
<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=related_results_labels&amp;max-results=6&quot;' type='text/javascript'/></b:if></b:loop>
<script type='text/javascript'>
var currentposturl=&quot;<data:post.url/>&quot;;
var maxresults=6;
removeRelatedDuplicates(); printRelatedLabels();
</script>
</div>
<br/><br/>
</b:if>
<!-- Related Posts Code End  www.karpom.com -->

8. இதில் மஞ்சள் நிறப் பின்னணியில் இருப்பதை உங்கள் விருப்பத்துக்கு ஏற்ப மாற்றிக் கொள்ளலாம்.

9. இப்போது மீண்டும் உங்கள் Template-ஐ Save செய்து விடுங்கள்.

10. இப்போது உங்கள் வலைப்பூவில் ஏதேனும் ஒரு பதிவை ஓபன் செய்யுங்கள். பதிவிற்கு கீழே இது இருக்கும்.

இதில் ஏதேனும் சந்தேகம் இருப்பின் கீழே கேட்கவும்.

- பிரபு கிருஷ்ணா

3 comments

அனைவருக்கும் பயன்படக்கூடிய பதிவு.

Reply

பதிவர்களுக்கு மிகவும் பயனுள்ள தகவல் பிரபு!

Reply

பயனுள்ள பதிவு ! நன்றி !

Reply

Post a Comment

பதிவுக்கு தொடர்புடைய கேள்விகளை மட்டும் இங்கே கேளுங்கள். மற்ற கேள்விகள் கேட்பவர்கள் www.bathil.com என்கிற தளத்தில் கேட்கவும்.