हेल्लो दोस्तों,
आज के इस ब्लॉग पोस्ट में मैं आपको बताऊंगा की आप अपने Blogger Blog पर Read More का बटन कैसे लगा सकते हैं. इसे हम Jump Break के नाम से भी जानते हैं. असल में इसमें होता यह हैं कि Read More का jump break लगाने से आपका पूरा का पूरा पोस्ट सामने नहीं दीखता , सिर्फ ब्लॉग का title, summary और thumbnail दीखता हैं और साथ में Read More का लिंक दीखता हैं. और पूरा पोस्ट पड़ने के लिए आपको उस Read More के link पर click करना पढता हैं.
क्या फायदे ?
इस लिंक के डालने से फायदा यह हैं की आप एक screen पर एक साथ अपने बहुत सारे posts को दिखा सकते हैं और आपके ब्लॉग पर उपलब्ध बहुत सारे pages को आप आसानी से एक ही जगह दिखा पाते हैं. अगर मान लीजिये की एक पेज या screen पर आपका एक पोस्ट ही दिख रहा हैं तो chances हैं की visitor आपके दुसरे links या posts को ना देखे और आपके पेज की ranking पर असर पढ़ सकता हैं. कह सकते हैं कि यह Read More का लिंक SEO की और से काफी important हैं.
अपने Blog पर कैसे Read more को डाले ?
आप अपने Blogger blog पर दो तरह से Read more का लिंक दाल सकते हैं .
पहला तो manual method हैं जिसमे आप अपने हिसाब से read more का लिंक दाल सकते हैं , मतलब यह हैं कि आप summary का length हर पोस्ट के लिए अलग से खुद चुन सकते हैं और अलग से कोई आपको अपने ब्लॉग के HTML में changes नहीं करने पढ़ते .
दूसरा तरीका हैं automatic method जिसमे आपको अपने ब्लॉग के html में कुछ changes करने पड़ेगे और Read more का link आपके ब्लॉग के हर पोस्ट पर automatic add हो जाएगा एक predefined summary के बाद .इस method में आप summary का length बदल नहीं सकते .
मैं यहाँ आपको दोनों तरीके बताने वाला हूँ.
Manual Method
आप जब आप अपने blogger पर नया पोस्ट लिखते हैं तो आपने देखा होगा कि आपके Editing tool में एक insert jump break का option tool bar में रहता हैं . और अच्छे से जानने के लिए नीचे दिए गए फोटो को देखे
उदहारण के लिए ऊपर के चित्र को देखे . यहाँ मैंने manual method को फोटो से दिखाया हैं. मान लीजिये की ऊपर के चित्र के मुताबिक मुझे अपने summary पर "frog in a trap" तक दिखाना हैं. तो मैं वहां पर जाकर अपने mouse का cursor ले जाऊँगा और click करूँगा फिर "insert jump break" के option पर click करूँगा तो आप देखेंगे की आपके उस "frog in a trap" के नीचे एक line खिच जाएगा और फिर उसे आप Save कर ले.
अब जब आप अपने ब्लॉग पर जाकर अपने लिखे गए पोस्ट को देखेंगे तो आपको "Read more" link मिल जाएगा .
Automatic Method
सबसे पहले तो आप अपने template का backup ले ले . इसके लिए आप पहले "template" पर click करे ,फिर Back/Restore पर click करे और फिर अपना full template डाउनलोड कर ले.
इस method के लिए पहले आप अपने ब्लॉग के dashboard में जाकर बायीं तरफ के menu से "Template" पर click करें फिर "Edit HTML" के बटन पर click करें . अब आपके सामने आपके Blog का HTML change करने का Window खुल जाएगा .
फिर इस window पर खाली जगह पर एक बार click करे और फिर Ctrl + F का बटन दबाये और search करे निम्नलिखित code को :
<data:post.body/>
Search box में डालकर आप जब इस code को देखेंगे तब आपको यह code दो तीन बार मिलेगा . यहाँ पर आपको तीसरे code को निम्नलिखित code से बदलना हैं . अगर आपको तीन कि जगह दो बार ही यह code मिला तो दुसरे code को आप निम्नलिखित code से बदले.
<b:if cond='data:blog.pageType != "static_page"'>
<b:if cond='data:blog.pageType != "item"'>
<div expr:id='"summary" + data:post.id'><data:post.body/></div>
<script type='text/javascript'>createSummaryAndThumb("summary<data:post.id/>","<data:post.url/>","<data:post.title/>");</script>
<span class='readmore' style='float:right;'><a expr:href='data:post.url'>Read More »</a></span></b:if></b:if>
<b:if cond='data:blog.pageType == "item"'><data:post.body/></b:if>
<b:if cond='data:blog.pageType == "static_page"'><data:post.body/></b:if>
अब इसके बाद फिर से निम्नलिखित tag को search करें :
</head>
इस tag के ठीक ऊपर अब आपको एक नया code paste करना पड़ेगा जिसे आप नीचे से कॉपी करके paste कर दे.
<script type='text/javascript'>
posts_no_thumb_sum = 490;
posts_thumb_sum = 400;
img_thumb_height = 160;
img_thumb_width = 180;
</script>
<script type='text/javascript'>
//<![CDATA[
function removeHtmlTag(strx,chop){
if(strx.indexOf("<")!=-1)
{
var s = strx.split("<");
for(var i=0;i<s.length;i++){
if(s[i].indexOf(">")!=-1){
s[i] = s[i].substring(s[i].indexOf(">")+1,s[i].length);
}
}
strx = s.join("");
}
chop = (chop < strx.length-1) ? chop : strx.length-2;
while(strx.charAt(chop-1)!=' ' && strx.indexOf(' ',chop)!=-1) chop++;
strx = strx.substring(0,chop-1);
return strx+'...';
}
function createSummaryAndThumb(pID, pURL, pTITLE){
var div = document.getElementById(pID);
var imgtag = "";
var img = div.getElementsByTagName("img");
var summ = posts_no_thumb_sum;
if(img.length>=1) {
imgtag = '<span class="posts-thumb" style="float:left; margin-right: 10px;"><a href="'+ pURL +'" title="'+ pTITLE+'"><img src="'+img[0].src+'" width="'+img_thumb_width+'px" height="'+img_thumb_height+'px" /></a></span>';
summ = posts_thumb_sum;
}
var summary = imgtag + '<div>' + removeHtmlTag(div.innerHTML,summ) + '</div>';
div.innerHTML = summary;
}
//]]>
</script>
<b:if cond='data:blog.pageType != "static_page"'>
<b:if cond='data:blog.pageType != "item"'>
<style type='text/css'>
.post-footer {display: none;}
.post {margin-bottom: 10px; border-bottom: 1px dotted #E6E6E6; padding-bottom: 20px;}
.readmore a {text-decoration: none; }
</style>
</b:if>
</b:if>
बस अब आप अपने template को save कर ले.
आप अगर चाहे तो summary में number of characters change कर सकते हैं. अगर आपके पोस्ट में कोई thumbnail नहीं हैं तो characters change करने के लिए 490 change करिए. और अगर thumbnail हैं तब 400 को change करें. thumbnail का height और width भी आप चाहे तो 160 और 180 को बदल कर कर सकते हैं.
तो ये थे दो तरीके जिससे आप आसानी से अपने पोस्ट में Read more का link दाल सकते हैं.
अगर आपको कोई परेशानी आ रही हो तो ज़रूर बताये . और comments और facebook पर हमसे जुढ़े रहिये.
धन्यवाद
