ब्लॉगर में मौजूद ब्लॉग के मोबाइल वर्शन में वेब वर्शन वाले विजेट्स कैसे दिखायें/छुपायें?

आज  के वक्त में जब सबके हाथ में स्मार्ट फोन है तब किसी भी वेबसाइट पर ज्यादातर पाठक अपने अपने स्मार्ट फोन के जरिये ही आते हैं। ऐसे में यह जरूरी हो गया है कि आपकी वेबसाइट मोबाइल के लिए ऑप्टिमाइज़ हो। अगर आप भी मेरी तरह गूगल के ब्लॉगर का इस्तेमाल करते हैं तो अपनी वेबसाइट को आसानी से मोबाइल के लिए ऑप्टिमाइज़ कर सकते हैं।  मोबाइल ऑप्टिमाइजेशन क्या है, वह क्यों जरूरी है और blogger में मौजूद साईट को कैसे मोबाइल के लिए ऑप्टिमाइज़ किया जा सकता है यह सब आप मेरे निम्न लेख पर पढ़ सकते हैं:

मोबाइल ऑप्टिमाइजेशन और ब्लॉग के लिए उसका महत्व

वैसे तो मोबाइल ऑप्टिमाइजेशन आपके ब्लॉग की पठनीयता को बढ़ाकर आपके पाठकों के लिए आपके ब्लॉग को पढ़ना एक अच्छा, आसान अनुभव बनाता लेकिन इससे कुछ परेशानियाँ भी उपज सकती है। 

असल में होता यूँ है कि जब आप अपनी साईट को मोबाइल के लिए ऑप्टिमाइज़ करने के लिए उस पर मोबाइल थीम को सक्रिय करते हैं तो कई बार ऐसे कई सारे विजेट/गैजेट* आपके ब्लॉग के मोबाइल वर्शन से हट जाते हैं जो कि डेस्कटॉप वर्शन में रहते हैं। 

विजेट/गैजेट* – विजेट आपके  ब्लॉग के अलग अलग हिस्से होते हैं जिन्हें रखना न रखना आपके ऊपर निर्भर करता है। अगर आप अपने blogger डैशबोर्ड में मौजूद लेआउट में जायेंगे तो आपको अपने ब्लॉग के ये हिस्से दिखाई दे जायेंगे। आप इनमें से कईयों को सम्पादित कर सकते हैं। कई विजेट ब्लॉग पर जोड़ सकते हैं और कईयों को हटा भी सकते हैं।

मेरे ब्लॉग में मौजूद कुछ विजेट

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

आपके ब्लॉग में भी ऐसे काफी चीजें होंगी जो कि आप चाहते हैं कि डेस्कटॉप वर्शन में  दिखने के साथ साथ मोबाइल वर्शन में भी दिखें। अब यह करने का आपके पास एक तरीका तो यह है कि आप मोबाइल थीम को असक्रिय कर दें। इससे मोबाइल में भी साईट वैसे ही खुलेगी जैसे कंप्यूटर पर खुलती है। परन्तु यह करने से नुकसान यह होता है कि साईट की पठनीयता प्रभावित होती है। पाठक को साईट पर चीजें पढ़ने में असहजता हो सकती है जिससे वह आपकी साईट पर आना ज्यादा पसंद न करे। यही कारण है कि आपको कुछ ऐसा करना है जिससे साँप भी मर जाए और लाठी भी न टूटे। यानी डेस्कटॉप में दिखलाई देने वाला जो फीचर आप मोबाइल पर चाहते हैं वह मोबाइल की थीम लगे लगे हुए ही आपको दिखाई देने लगे। 

जहाँ पर मोबाइल पर किसी विजेट को दर्शाया जा सकता है वहीं इसके उलट अगर आप चाहते हैं कि मोबाइल थीम में दिखने वाला कोई विजेट मोबाइल में न दिखे तो उसे भी आसानी से छुपाया जा सकता है।

मोबाइल थीम में डेस्कटॉप वर्शन के विजेट को सक्रिय करना या किसी विजेट को असक्रिय करना काफी आसान है और यह आप निम्न चरणों का पालन करके कर सकते हैं:

1. अपने ब्लॉग पर कस्टम मोबाइल थीम को सक्रिय करें

2. अपने विजेट की आई डी का पता लगायें

3. थीम में बदलाव कर विजेट को मोबाइल में दिखाये या छुपायें 

अब आगे की पोस्ट में मैं आपको बताऊँगा कि ऊपर के तीनों चरणों को आप कैसे सफलता पूर्वक अंजाम दे सकते हैं। 

कस्टम थीम को कैसे सक्रिय करें?

कस्टम थीम सक्रिय करने के लिए आपको निम्न चरणों का पालन करना होगा:

1. ब्लॉगर डैशबोर्ड में जाकर थीम को क्लिक करें

थीम पर क्लिक कर थीम सेक्शन पर जायें

2. थीम सेक्शन खुलने पर आपको अपने ब्लॉग की थीम दिखने लगेंगी। एक my theme/मेरी थीम सेक्शन दिखेगा जिसके बगल में तीन बिंदु बने होंगे। उन बिन्दुओं को क्लिक करें। 

मेरी थीम के बगल में मौजूद तीन बिन्दुओं पर क्लिक करें

3. बिंदु के क्लिक करने पर कुछ विकल्प दिखाई देने लगेंगे। विकल्पों में से मोबाइल सेटिंग नाम का विकल्प खोलें।

मोबाइल सेटिंग का विकल्प खोलें

4. अब एक पॉप अप आपके सामने होगा। अगर आपने मोबाइल थीम नहीं चुना है तो इधर चुन सकते हैं। यही पर मोबाइल थीम कॉन्फ़िगर करने का विकल्प आपके पास मौजूद होगा। यह एक सेलेक्ट बॉक्स के फॉर्म में होगा जिसमें डिफ़ॉल्ट थीम चुनी हुई होगी। 

मोबाइल थीम वाला पॉप अप

5. आपको इस पर क्लिक करना है और उपलब्ध विकल्पों में से Custom या हिन्दी में मनमुताबिक विकल्प चुनना है। इसी विकल्प के माध्यम से आप अपने मोबाइल में दिखने वाले वर्शन में बदलाव कर पाएंगे।

मनमुताबिक़/Custom  थीम चुने

6. नीचे अब सेव का विकल्प दिख रहा होगा। उधर ही पूर्वालोकन या प्रीव्यू का विकल्प भी होगा। प्रीव्यू पर क्लिक करके आप यह देख सकते है कि आपकी साईट मोबाइल पर कैसे दिखेगी। एक बार देख लें ताकि यह सुनिश्चित कर लें कि वेब वर्शन में से कौन कौन  से विजेट आप मोबाइल वर्शन पर दिखाना चाहेंगे या कौन सा विजेट छुपाना चाहेंगे। 

मोबाइल थीम सेव करें

अब चूँकि आपके मोबाइल की कस्टम थीम सेट हो गयी है तो अब अगले चरण की तरफ बढ़ते हैं। उम्मीद है आपने वो विजेट चुन लिए होंगे जो कि आप अपनी साईट  पर दर्शाना चाहते हैं। मुझे अपनी साईट पर पोपुलर पोस्ट्स वाला विजेट चाहिए था तो मैं उसी का उदाहरण आपको दूँगा।

अपने विजेट की आई डी का पता कैसे लगायें?

1. अपने डैशबोर्ड के साइड मेनू में लेआउट का विकल्प चुनें

लेआउट पर क्लिक करके लेआउट सेक्शन में जाएँ

2. अब डैशबोर्ड का लेआउट सेक्शन खुल गया होगा। लेआउट सेक्शन में आपकी साईट के विभिन्न हिस्से आपको दिखाई दे रहे होंगे। जिस विजेट को आप मोबाइल वर्शन में दिखलाना चाहते हैं उस पर जाएँ और एडिट का विकल्प चुने। मैंने पोपुलर पोस्ट्स के विजेट में यह चुना था।

क्योंकि मुझे लोकप्रिय पोस्टस के विजेट पर बदलाव करना है तो मैं उधर गया

3. अब आपके समक्ष एक पॉपअप खुला विंडो खुला होगा। उस विंडो में विजेट की सेटिंग होती है। हमें उसका कुछ नहीं करना है। अगर आप ब्राउज़र के एड्रेस विंडो में जायेंगे तो पाएंगे कि उधर जो लिखा है उसके आखिर में widgetId लिखा हुआ होता है। यही widget की आई डी होती है। उदाहरण के लिए जब मैं पोपुलर पोस्ट्स वाले विजेट को खोलता हूँ तो निम्न पता ब्राउज़र के एड्रेस विंडो में खुलता है। आखिर का हिस्सा ही विजेट आई डी है:

https://www.blogger.com/rearrange?blogID=myblog id&action=editWidget&sectionId=main&widgetType=null&widgetId=PopularPosts1

ब्राउज़र के विंडो में इंगित स्थान पर विजेट आई डी मिल जायेगा

4. अब आप अपने विजेट की आई डी को अपने पास नोट कर लें और तीसरे चरण की ओर बढ़ें।

कैसे विजेट को अपनी थीम में बदलाव कर मोबाइल में दिखाये या छुपायें?

1. अब वापस थीम सेक्शन में जाएँ।

थीम पर क्लिक कर थीम सेक्शन पर जायें

2. थीम सेक्शन खुलने पर आपको अपने ब्लॉग की थीम दिखने लगेंगी। एक my theme  सेक्शन दिखेगा जिसके बगल में तीन बिंदु बने होंगे। उन बिन्दुओं को क्लिक करें। 

मेरी थीम के बगल में मौजूद तीन बिन्दुओं पर क्लिक करें

3. बिन्दुओं पर क्लिक करने के बाद ही आपके समक्ष कुछ विकल्प दिखने लगेंगे। उसमें एक विकल्प बैकअप लें या Take backup होगा। इस पर क्लिक करेंगे तो आपको एक पॉपअप खुलेगा जिसमें आपको बैकअप डाउनलोड करने का विकल्प दिखेगा। आपको डाउनलोड पर क्लिक करना है और इससे आपका बैकअप डाउनलोड हो जायेगा। यह एक xml फाइल होती है। उदाहरण के लिए मेरे थीम की बेकअप फाइल का नाम theme-7854343964637884711.xml है। 

बैकअप लेना इसलिए जरूरी है क्योंकि अगर आगे की कार्यवाही करते हुए कुछ गड़बड़ हो जाती है तो इस xml फाइल से आप अपनी थीम को वापस पा सकते हैं।

थीम का बेकअप ले लें

बैकअप को डाउनलोड कर लें

4. बैकअप लेने के पश्चात आप फिर उन बिन्दुओ को क्लिक करें। इस बार आपको विकल्पों में से change/update html नाम से मौजूद विकल्प पर क्लिक करना है। चूँकि मैंने हिन्दी भाषा को अपनी पसंद सेट किया हुआ है तो मेरी साईट पर  html में बदलाव करें दिखाई देता है। इस विकल्प पर क्लिक करेंगे तो आपके समक्ष एक स्क्रीन खुल आएगी जिसके एक हिस्से में कुछ कंप्यूटर कोड आपको दिखाई देने लगेंगे। यह कोड ही असल में यह निर्धारित करते हैं कि आपका ब्लॉग किस तरह दिखेगा। यह कोड ही आपकी थीम है।

html में बदलाव करें का विकल्प चुनें

थीम का  कोड दर्शाती स्क्रीन

5. जहाँ कोड लिखा है उधर माउस या लैपटॉप के टचपैड से क्लिक करके कर्सर को लायें। अब कीबोर्ड में ctrl + f  दबाएँ । ctrl+f  दबाने से इस कोड वाली स्क्रीन में एक सर्च बॉक्स खुल जायेगा।

सर्च बॉक्स

 5. इस सर्च बॉक्स में आप अपने विजेट का आईडी डालें और एंटर(Enter) बटन दबाएँगे तो आपका विजेट किधर है यह आपको पता चल जायेगा। आपके विजेट की लोकेशन पीले रंग से दर्शाई जाएगी। 

सर्च बॉक्स में विजेट आईडी डालिए

पीले रंग से दिखता विजेट

6. अब आप अपने विजेट पर हैं। यह वह कोड है जिसके वजह से आपका विजेट आपकी साईट पर दिखता है। जिस पंक्ति पर आपके विजेट का नाम है वह लाइन कुछ यूँ दिखेगी। (मेरा विजेट चूँकी पोप्लुँर पोस्ट है तो मैं उसी पंक्ति को आपको दिखा रहा हूँ।)

<b:widget id=’PopularPosts1′ locked=’false’  title=’लोकप्रिय पोस्ट्स’ type=’PopularPosts’>

 अब इस पंक्ति में आपको कुछ बदलाव करने हैं। इस पंक्ति में आपको एक और वैल्यू जोड़नी है। यह वैल्यू ही निर्धारित करेगी कि विजेट आपके ब्लॉग पर दिखेगा। बदलाव करने के बाद यह पंक्ति कुछ ऐसे दिखेगी:

<b:widget id=’PopularPosts1′ locked=’false’ mobile = ‘yes’  title=’लोकप्रिय पोस्ट्स’ type=’PopularPosts’>

जैसा कि आप देख सकते हैं हमने मूल पंक्ति में mobile = ‘yes’ जोड़ा है। इसका अर्थ है कि अब थीम जब लोड होगी तो ब्राउज़र को पता होगा कि यह विजेट मोबाइल वर्शन में भी दिखाना है।

विजेट्स बदलाव से पहले, विजेट बदलाव के बाद

मोबाइल वर्शन में दिख रहे विजेट को कैसे छुपाये?

अगर मोबाइल में कोई ऐसा विजेट है जिसे आप छुपाना चाहते हैं तो आपको उस विजेट को तलाश कर उसमें mobile = ‘yes‘ की जगह mobile = ‘no‘ जोड़ देना है। इससे वह विजेट मोबाइल वर्शन में दिखना बंद हो जायेगा।

7. अब अपनी थीम को सेव बटन पर क्लिक करके सेव कर लें। अब जिस प्रकार आपने ऊपर कस्टम थीम को सक्रिय करते हुए मोबाइल थीम को प्रीव्यू किया था उसी प्रकार अब दोबारा जाकर देख लें। आपको अपनी साईट की मोबाइल थीम में बदलाव दिखने लगेगा।

अब थीम को सेव कर लें

मेरे साईट के स्क्रीन शॉट विजेट के सक्रिय होने से पहले और बाद में

कुछ गड़बड़ होने पर थीम के  बैकअप का उपयोग कैसे करें?

वैसे तो ऊपर जितने भी चरण बताये गये हैं उनमें गड़बड़ होने के आसार नहीं है लेकिन फिर भी अगर ऊपर की प्रक्रिया करते हुए कुछ गड़बड़ हो गयी तो घबराने की बात नहीं है। आप ऊपर लिए गये बैकअप के माध्यम से अपनी बदलाव से पहले की थीम आसानी से प्राप्त कर सकते हैं।

1. जो थीम का बैकअप आपने डाउनलोड किया है उसे किसी एडिटर (उदाहरण के लिए नोट पैड में खोले)

2. जब फाइल खुल जाये तो उसके अन्दर का कोड copy कर दें

3. ऊपर जो theme का कोड दर्शाती स्क्रीन है उधर जाकर उसके अंदर के कोड को पूरा सेलेक्ट करके डिलीट कर दें 

4. अब जो बैकअप का कोड आपने copy किया है उसे उधर पेस्ट कर थीम को सेव कर दें।

आपका बैकअप थीम दोबारा से सक्रिय हो जाएगी।

 

तो देखा अपने कुछ आसान चरणों का पालन करके आप अपनी ब्लॉगर साईट के मोबाइल थीम में उन विजेट्स को भी दर्शा सकते हैं जो कि मोबाइल थीम पर अक्सर दिखाई नहीं देती हैं। वहीं कुछ गड़बड़ होने पर अपनी पुरानी थीम को वापस पा सकते हैं। 

चलिए अब मुझे इजाजत दीजिये। मैं आशा करता हूँ यह लेख आपके काम आया होगा। 

ब्लॉगर वेबसाइट से जुड़े कुछ और टिप्स आप निम्न लिंक पर जाकर पढ़ सकते हैं:

ब्लॉगर टिप्स 

तकनीक से जुड़े मेरे और लेख आप निम्न लिंक पर जाकर पढ़ सकते हैं:

तकनीक

अगर आपको भी अपनी साईट या ब्लॉग से जुड़ी किसी समस्या का समाधान करना है तो आप मुझे निम्न ई-मेल आईडी मेल पर सम्पर्क कर सकते हैं:

nainwal.vikas@gmail.com

© विकास नैनवाल ‘अंजान’