अपने ब्लॉग पोस्ट में जोड़े "Read More" विकल्प

अपने ब्लॉग पोस्ट में जोड़े "Read More" विकल्प

Read More यानि आगे पढने के विकल्प जैसे कि आप उपरोक्त तस्वीर में देख रहे हैं को ब्लॉग में "लगाने का तरीका" के बारे में काफी ब्लॉगस पर लिखा गया है | इसी "रीड मोर" लगाने के बारे में "नवीन प्रकाश? जी ने बहुत ही विस्तार से एक लेख लिखा है इस लेख में आपको "रीड मोर" टेक्स्ट की जगह "रीड मोर" का बटन लगाने के बारे में बताया जा रहा है कि कैसे आप अपने ब्लॉग पर रीड मोर को बटन के रूप में प्रयुक्त करें |
अब जानिये और अपने ब्लॉग पर लगाइए Read More या Jump break विकल्प ।
"रीड मोर" बटन लगाने से पहले आप का ये जानना जरूरी है कि ये Read More या Jump break है क्या ?

ये एक विकल्प है जो आपके ब्लॉग पोस्ट को दो हिस्सों में बाँट देता है जिससे आपके ब्लॉग के होम पेज पर आपके ब्लॉग पोस्ट का आपके द्वारा निर्धारित हिस्सा ही दिखाई देता है और एक अतिरिक्त लिंक होती है जिस पर क्लिक करने पर आपका पूरा लेख देखा जा सकता है । मूल रूप से ब्लॉग पर ये लिंक "Read More" के नाम से दिखाई देता है जिसे आप अपनी पसंद के किसी भी रीड मोर बटन (चित्र) से बदल सकते हैं ।
इसका उपयोग आपके ब्लॉग होम पेज को हल्का रखने के लिए व होम पेज को तेजी से लोड होने के लिए किया जाता है । मान लीजिये आप अपने द्वारा लिखी गई पोस्ट को एक से अधिक "पांच, सात या दस पोस्ट को अपने बलोंग के होम पेज पर दिखाते हैं तो आपका ब्लॉग देर से लोड होगा | यदि आप अपनी पोस्ट में तस्वीरों का इस्तेमाल करने हैं तो पेज और भी ज्यादा देर से लोड होगा | परन्तु "Read More" विकल्प का उपयोग कर के आप इतने ही पोस्ट को अपने ब्लॉग के होम पेज पर दिखा सकते है व अपने ब्लॉग के होम पेज को भारी भरकम होने से बचा सकते हैं | इस को एक फायदा ये भी है कि आप अपने ब्लॉग के होम पेज पर पिछले दिनों में किस किस विषय पर लिखा है के बारे में आपके इस ब्लॉग पर आने वालों को बता सकते हैं | इसका एक उदाहरण आप इस ब्लॉग पर भी देख सकते है आप निम्न दिखाई दे रहे इस "रीड मोर" बटन पर कलिक करेंगे तो "यदि आप इस रीड मोर बटन को ब्लॉग के होम पेज पर देख रहे हैं तो ये आपको उस पेज से सबंधित पेज पर ले जायेगा और आप उस विषय पर लिखी गई पोस्ट पूर्ण से पढ़ पाएंगे |"


अब इसे आपके ब्लॉग पोस्ट पर लगाने का तरीका बहुत आसान है, यहाँ हम मान लेते हैं की आपको आप द्वारा नई लिखी जा रही पोस्ट पर इस विकल्प का प्रयोग करना हैं तो :-

सबसे पहले अपने ब्लॉगर अकाउंट में लोगिन करे
फिर New Post पर क्लिक करें, फिर अपने लेख को टाइप कर लें
अब आप जितने हिस्से को ब्लॉग होम पेज पर दिखाना चाहते है उसके ठीक नीचे माउस कर्सर को को रख कर निम्न बाक्स में दिखाई दे रहे अनुसार टाइप करें |


"अथवा" मेरे ख्याल से आज के समय में आप सभी नए ब्लॉग एडिटर का उपयोग कर रहे हैं और इस नए एडिटर में इस चित्र में दिखाए अनुसार Insert jump Break बटन पर क्लिक करे ।

(इस तस्वीर को बड़े प्रारूप में देखने के लिए इस तस्वीर पर कर्सर ले जाएं)

अब आप अपनी पोस्ट को पब्लिश करें व आप पायेंगे कि आपने अपनी पोस्ट कि जिस लाइन के बाद आप ने Insert jump Break पर कलिक करके इस आप्शन का प्रयोग किया था आप द्वारा लिखी गई पोस्ट का ऊपरी हिस्सा ही आपके ब्लॉग के होम पेज पर दिखाई देगा और इसके अंत में रीड मोर बटन लगा (विकल्प) दिखाई देगा | इस बटन पर जब आप कलिक करेंगे तो आप उस लिंक पर पहुँच जाएंगे जिस लिंकपर इस पोस्ट से संबंधित पूरा बयोरा लिखा होगा ।


अब आप जानिए कि इस रीड मोर बटन को अपने ब्लॉग लगाया कैसे जाये
इसके लिए आप सबसे पहले अपने ब्लॉगर अकाउंट में लोगिन करें
निम्न तस्वीर में आप देख सकते हैं कि आप को कहाँ-कहाँ पर कलिक करना है

पहले स्टेप >>> Design >>> पर कलिक करें
दूसरा स्टेप "Edit HTML पर कलिक करें
तीसरा स्टेप >>>(यहाँ पर आपको सलाह दी जाती है कि आप अपने ब्लॉग के टेम्पलेट का बैकअप जरूर ले लें
फिर चौथा स्टेप >>> "Expand Widget Templates" के साथ दिखाई दे रहे छोटे से चौकोर बाक्स पर कलिक करें जब इस चौकोर बाक्स पर राईट टिक का निशान बन जाये
तो "CTRL+F" दबाएँ | एक फाइंड बाक्स उभरेगा उसमें hasjumplink लिख कर एंटर बटन दबाएँ आपको निम्न तस्वीर अनुसार कोड दिखाई देगा

अब आपने इस उप्तोकत दिखाई दे रहे कोड में कुछ बदलाव करने हैं | आप निम्न तस्वीर में देख सकते हैं कि क्या-क्या बदलाव करने हैं

जब उपरोक्त दिखाई दे रही तस्वीर में जहाँ पर "स्टाइल फ्लोट लेफ्ट लिखा है वही पर लेफ्ट के जगह राईट" करने पर बटन दाईं तरफ दिखाई देगा, अनुसार बदलाव कर लें तो आपको सेव टेम्पलेट पर कलिक करना है | "रीड मोर बटन" का विकल्प आपके ब्लॉग पर स्थापित हो जायेगा | आप निम्नलिखित बटनों में से किसी भी एक या अपने द्वारा निर्धारित बटन का प्रयोग कर सकते हैं | निम्न दिखाई दे रहे बटनों के कोड भी साथ में दिए जा रहे हैं | आप किसी भी कोड को कापी करके इसका उपयोग कर सकते हैं |























यदि आपको ये लेख पसंद आये तो कृपया टिप्पणी जरूर करें | (किसी भी मुश्किल दरवेश होने पर आप मुझसे संपर्क करें)

एक टिप्पणी भेजें

7 टिप्पणियाँ
* Please Don't Spam Here. All the Comments are Reviewed by Admin.
  1. विनोद जी 14 सितंबर 2011 के इस पोस्ट में आपने कुछ गलतियाँ की हैं। मैं यहाँ आया तो कई बार और हर बार सोचा की इन गलतियों की चर्चा आपसे करूँ लेकिन फिर कुछ सोच कर रह गया। इस पोस्ट में आपने ऊपर एक जगह लिखा है कि--
    "अब आपने इस उप्तोकत दिखाई दे रहे कोड में कुछ बदलाव करने हैं।..."
    इसके नीचे PNG में आपने लिखा है नामक कोड को style='float:right; से बदलना है। फिर नीचे निम्न कोड भी दिया है <img src... वाला। और इसमें width="100"height="75/> का विकल्प भी दिया है। यहाँ आपने यह नहीं बताया कि <data:post.jumpText/> को style='float:right; वाले कोड से बदलना है या फिर <img src...वाले से, क्योंकि <data:post.jumpText/> वाले कोड को style='float:right; वाले कोड से बदलने से वो चलता ही नहीं, दूसरे <img src...वाले कोड को लगाने के बाद चल तो जाता है, लेकिन अब left या right विकल्प समझ में नहीं आता की कहाँ प्रयोग होगा। और <img src...वाले कोड में ये कोड width="100"height="75/> कहाँ लगेगा।
    देखिये, आपको हो सकता है ये गलती न लगे क्योंकि इन बदलाव की जानकारी आपको अच्छी होगी। लेकिन उन लोगों को नहीं है जिन्हें HTML,XML के बारे में ज्यादा कुछ नहीं मालूम।
    बाकी आप जैसा बेहतर समझे। मैं यहाँ फिर भी आता रहूँगा।

    जवाब देंहटाएं
    उत्तर
    1. कोड को शायद आपने ध्यान से नहीं देखा | मैंने लिखा है की <a के बाद style='float:right; को प्रयोग करने के बार में लिखा है व इसे नीले रंग की लाइन से दिखाया है व इस कोड को हलके गुलाबी रंग से दिखा कर इसे रिमूव करने के बारे में लिखा है | शायद आपको इसे पढ़ने में दिक्कत महसूस हुयी है | आप पेज से साइज को थोडा सा बड़ा कर के देखें | इसके लिय आप की-बोर्ड से CTRL साथ के + कीज का प्रयोग करें | तब इस पेज के प्रीव्यू साइज के बढ़ जाने से आपको इस कोड का अंतर साफ़ दिखाई देगा |

      हटाएं
    2. विनोद जी लग रहा है आपने भी मेरे कमेंट को पूरा नहीं पढ़ा। width="100"height="75/> के बारे में आपने कुछ नहीं लिखा। दरअसल <a के बाद वाले कोड को आपने पोस्ट में ऐसे दर्शाया है कि उस पर ध्यान न जाना लाज़मी है। इतनी जल्दी उत्तर देने का धन्यवाद!

      हटाएं
  2. इस टिप्पणी को लेखक द्वारा हटा दिया गया है.

    जवाब देंहटाएं
  3. बहुत अच्छी जानकारी दी है आपने बहुत साईट देखा हूँ लेकिन आपका कोई जवाब नहीं

    शुक्रिया

    जवाब देंहटाएं

आपकी टिप्पणी मेरे लिए मेरे लिए "अमोल" होंगी | आपके नकारत्मक व सकारत्मक विचारों का स्वागत किया जायेगा | अभद्र व बिना नाम वाली टिप्पणी को प्रकाशित नहीं किया जायेगा | इसके साथ ही किसी भी पोस्ट को बहस का विषय न बनाएं | बहस के लिए प्राप्त टिप्पणियाँ हटा दी जाएँगी |