किसी वेब पेज या ब्लॉग पोस्ट में पेज जम्प कैसे लगायें

पेज जम्प ऐसे लिंक को कहा जाता है जिसे क्लिक करने पर आप उस पेज में ऊपर या नीचे किसी स्थान विशेष पर बिना पेज रीलोड किये तत्काल पहुँच सकें। इन का प्रयोग आप अपने वेब पेज को इंटरैक्टिव बनाने के लिये कर सकते हैं। यह विशेषकर लम्बे पेजों हेतु उपयोगी है जिससे पाठक को पेज स्क्रोल नहीं करना पड़ता। माना आप किसी पोस्ट में कुछ विषयों पर लिख रहे हैं तो शुरु में पेज जम्प के उपयोग से विषय सूची बना सकते हैं जिसमें किसी विषय नाम पर क्लिक करने से पाठक सीधे उस सैक्शन में चला जायेगा। इसके अलावा किसी एक विषय को पढ़ते हुये पेज के किसी अन्य हिस्से में मौजूद भिन्न विषय पर जाने के लिये भी पेज जम्प लगाये जा सकते हैं। हमारे पाठक नवीन चतुर्वेदी जी ने पेज जम्प लगाने का तरीका पूछा, इसी बारे में जानकारी देने के लिये यह लेख लिखा जा रहा है।

डेमो:- आप यहाँ हैं। नीचे जाने के लिये यहाँ क्लिक करें।

आपको पेज जम्प डालने के लिये ऍचटीऍमऍल संशोधित करनी होगी। आपको पेज में दो चीजें लगानी होंगी।

  1. पेज के अन्य सैक्शन की ओर इंगित करता एक लिंक कोड
  2. पेज जिस स्थान पर जम्प करेगा वह स्थान चिह्नित करता एक संकेतक कोड

जहाँ पर लिंक लगाना है, वहाँ निम्न कोड सिंटैक्स प्रयोग करें।

<a href=“#TargetPoint”>यहाँ</a> क्लिक करें।

अर्थात सामान्य लिंकों में href में जहाँ कोई वेब पता (यूआरऍल) आता है वहाँ उस जम्प वाले स्थान का नाम आयेगा और उसके आगे हैश चिह्न (#) लगेगा। हैश चिह्न बताता है कि यह लिंक पेज का ही आन्तरिक लिंक है।

अब आपको जहाँ पेज जम्प ले जायेगा उस स्थान पर निम्न ऍंकर लगाना है। यहाँ name ऍट्रीब्यूट से आप उस स्थान को एक अद्वितीय नाम देते हैं जहाँ पेज जम्प ले जायेगा।

<a name=“TargetPoint”>मैं टार्गेट स्थान हूँ</a>

इस कोड का सिंटैक्स ऊपर जैसा ही है, बस href की जगह name होगा तथा हैश चिह्न नहीं आयेगा।

TargetPoint (मैं टार्गेट स्थान हूँ) वाला स्थान कोई भी शब्द हो सकता हो जो किसी वाक्य या पैराग्राफ के बीच में भी हो सकता है। TargetPoint उस स्थान को चिह्नित करने के लिये एक विशिष्ट संकेतक शब्द (यूनीक आइडेंटिफायर) है। आप कोई भी शब्द प्रयोग कर सकते हैं, हाँ स्पेस न दें उसकी जगह हाइफन (-) या अंडरस्कोर (_) का प्रयोग कर सकते हैं। जहाँ आप यह कोड लगायेंगे लिंक करने से पेज जम्प होने पर वो स्थान स्क्रीन के टॉप पर होगा।

कुल मिलाकर हम करते यह हैं कि पेज के किसी हिस्से को name ऍट्रीब्यूट से यूनीक नाम देकर पेज के किसी और हिस्से पर लिंक लगाकर href ऍट्रीब्यूट से उसे रैफर करते हैं।

किसी अन्य पेज/पोस्ट से जम्प करना

सामान्यतया आप जब किसी पेज पर किसी अन्य पेज का लिंक लगाते हैं तो क्लिक करने पर वह उस टार्गेट पेज के टॉप पर ले जाता है। परन्तु यदि आप उस टार्गेट पेज पर टॉप की बजाय किसी अन्य सैक्शन पर सीधे जाना चाहें तो पेज जम्प लगाने से वह पेज सीधे उस स्थान विशेष पर लोड होगा।

इसके लिये टार्गेट पेज पर सैक्शन (जहाँ पेज जम्प के बाद पहुँचना है) को ऊपर वाले तरीके से ही निम्न कोड से चिह्नित करें।

<a name=“TargetSection”>मैं टार्गेट स्थान हूँ</a>

और जिस पेज पर लिंक लगाना है वहाँ निम्न कोड से लिंक लगायें। माना टार्गेट वेब पेज (या ब्लॉग पोस्ट) का पता http://alana.com/falana.html है तो कोड कुछ ऐसा होगा।

फलाने पेज पर जाने के लिये <a href=“http://alana.com/flana.html#TargetSection”>यहाँ</a> क्लिक करें।

इसका जीवन्त उदाहरण देखने हेतु यहाँ क्लिक करें जिससे कि आप इसी वेबसाइट पर मौजूद एक अन्य वेबपेज के सैक्शन में पहुँच जायेंगे।

आशा है आपको उपर्युक्त प्रक्रिया समझ आ गयी होगी। यदि कोई प्रश्न हो तो टिप्पणियों में पूछें।

—-

आप यहाँ आ गये। ऊपर वापस जाने के लिये यहाँ क्लिक करें।

How to insert page jump in a web page or blog post

Tags:

7 Responses to “किसी वेब पेज या ब्लॉग पोस्ट में पेज जम्प कैसे लगायें”

  1. पूरा समझ में ना आया

  2. प्रवीण पाण्डेय says:

    इतना विस्तृत समझाने के लिये धैर्य चाहिये।

  3. ravindra says:

    समझ मैं नहीं आया श्रीमान सीधी भाषा मैं बताएँगे तो बेहतर रहेगा

  4. ePandit says:

    @JATDEVTA SANDEEP,
    हा हा, यह तो वह बात हो गयी मुर्गा जान से गया, मुल्ला जी को स्वाद न आया।

    @प्रवीण पाण्डेय,
    उसके बाद यह प्रतिक्रिया सुनने के लिये भी धैर्य चाहिये कि समझ नहीं आया। :-)

    @ravindra,
    क्या यह सीधी नहीं थी?

    सीधी भाषा में यह करना है कि लिंक लगाने वाली जगह पर पहले का कोड (href वाला) लगाना है और जहाँ पेज जम्प के बाद जाना चाहिये वहाँ दूसरा कोड (name वाला) लगाना है।

  5. bhuvnesh says:

    पंडिज्‍जी मैं अपने एक ब्‍लॉग के लिए ourblogtemplates.com से लिया हुआ customized ‘professional blogger templae’ उपयोग कर रहा हूं… मैंने उसमें ‘Read More’ विकल्‍प लगाने के बहुत जतन किये तो भी कामयाब नहीं हुआ… नये ब्‍लॉगर इंटरफेस में सीधे ही एक बटन दबाने पर ये सुविधा है…. पर जंप वाला विकल्‍प लगाने पर उसके ऊपर का भाग तो दिखता है पर नीचे ‘Read more’ बटन नहीं दिखाता… मार्गदर्शन करें

  6. श्री नारायण प्रसाद जी के काम आ जाएगा यह। अच्छा है। हम वैसे माइक्रोसाफ्ट वर्ड में भी ऐसा कर सकते हैं। फिर उसका इस्तेमाल ब्लाग पर भी सम्भव होगा…

    • ePandit says:

      स्वागत है, चन्दन जी। आप मेरी साइट पर शायद पहली बार आये, आशा है आगे भी आगमन जारी रहेगा।

Leave a Reply