मोहल्ले में हल्ला [आश्रय-21]
1 hour ago
इस तरह बनाइए अपना टैब बॉक्स (Tab Box Widget)
इस पोस्ट में एक खास टैब बॉक्स की जानकारी दी गई थी, जिसे कई ब्लॉगर साथियों ने पसंद किया और वे इसे अपने ब्लॉग की साइडबार में लगाना चाहते हैं। आज इसे तैयार करने की आसान सा तरीका आपको बताया जा रहा है। आप ध्यानपूर्वक नीचे दिए गए चरणों का अनुसरण करें और उसके बाद तैयार कोड को अपने पेज के लेआउट में एचटीएमएल/जावास्क्रिप्ट में जोड़ लें।
कोड तैयार करने से पहले आपको अपने ब्लॉग में लेबल (टैग) की पोजिशन ठीक करनी होगी। साथ ही यह भी सुनिश्चित करना होगा कि आपके टैग आवश्यक रूप से रोमन (अंग्रेजी लिपि) में होने चाहिए। टैग पोजिशन ठीक करने की जानकारी इस पोस्ट में दी गई है।
यह स्पष्ट कर देना चाहूंगा कि नीचे दिखाए गए चरण केवल ब्लॉगर (ब्लॉगस्पॉट) चिट्ठों के लिए ही मान्य हैं। जो साथी इस टैब बॉक्स को वर्डप्रेस, किसी अन्य ब्लॉग या अपनी वेबसाइट के लिए चाहते हैं वे मुझसे टिप्पणी के माध्यम से संपर्क कर सकते हैं।
चरण-1
सबसे पहले नीचे दिए गए कोड को कॉपी कर लीजिए और इसे अपनी मेल के कम्पोज बॉक्स में पेस्ट कर लीजिए (मेल के कम्पोज बॉक्स में पेस्ट करने का फायदा यह है कि इस कोड के विभिन्न रंग आपको पेस्ट करने के बाद भी दिखते रहेंगे।)
<iframe scrolling="NO" frameborder="0" width="100%" src="http://www.gmodules.com/ig/ifr?url=http://hosting.gmodules.com/ig/gadgets/file/108384585615022758673/tfr2_v1_sj.xml&up_t1=http://आपका-ब्लॉग.blogspot.com/feeds/posts/default/-/पहला-लेबल&up_t2=http://आपका-ब्लॉग.blogspot.com/feeds/posts/default/-/दूसरा-लेबल&up_t3=http://आपका-ब्लॉग.blogspot.com/feeds/posts/default/-/तीसरा-लेबल&up_t4=http://आपका-ब्लॉग.blogspot.com/feeds/posts/default/-/चौथा-लेबल&up_t5=http://आपका-ब्लॉग.blogspot.com/feeds/posts/default/-/पांचवां-लेबल&up_tn1=पहला-शीर्षक&up_tn2=दूसरा-शीर्षक&up_tn3=तीसरा-शीर्षक&up_tn4=चौथा-शीर्षक&up_tn5=पांचवां-शीर्षक&up_inc_desc=0&up_num_entries=10&up_show_summ=200&up_link_target=_blank&synd=open&w=360&h=250&title=Tabbed+Feed+Reader+v2a&border=%23ffffff%7C3px%2C1px+solid+%23999999&source=http%3A%2F%2Fwww.gmodules.com%2Fig%2Fcreator%3Fsynd%3Dopen%26url%3Dhttp%253A%252F%252Fmjin.kyungnam.ac.kr%252Ftfr2_v1_sj.xml%26lang%3Den" height="240px"></iframe><span style="font-size: 80%"><a href="http://tips-hindi.blogspot.com/2009/05/tab-box-widget_07.html">विजेट आपके ब्लॉग पर </a></span>
चरण-2
इस कोड में पांच जगहों पर आपका-ब्लॉग लिखा है और इसे लाल रंग से हाइलाइट किया गया है। आप इस जगह अपने ब्लॉग का पता लिख लीजिए (हिन्दी ब्लॉग टिप्स के उदाहरण में आपका-ब्लॉग की जगह केवल tips-hindi लिखना है, शेष पता वहां पहले से लिखा है)।
चरण-3
उपयुर्क्त बदलाव के बाद आप नीले रंग से दिखाए गए पहला-लेबल, दूसरा-लेबल, तीसरा-लेबल, चौथा-लेबल और पांचवां लेबल की जगह अपने लेबल के नाम कॉपी कर पेस्ट कर दें। यहां मैंने केवल पांच लेबल लगाने की ही सुविधा दी है। अगर आप कोड की समझ में दक्ष हैं तो इसकी संख्या घटा-बढ़ा सकते हैं अन्यथा आप कुछ और छेड़छाड़ नहीं करें।
चरण-4
इस अंतिम चरण में आपको वह सूचना भरनी है, जो टैब बॉक्स के पांच शीर्षकों के रूप में आपको दिखेगी। इसे यहां हरे रंग से दिखाया गया है। यहां आपको हरे रंग में पहला-शीर्षक, दूसरा-शीर्षक, तीसरा-शीर्षक, चौथा-शीर्षक और पांचवां-शीर्षक दिख रहे होंगे। इनकी जगह आप वह वेल्यू भर दीजिए, जो आपको अपने टैब बॉक्स में देखनी है।
ध्यान रखें बदलाव का काम बहुत सावधानी से करें। न तो किसी डॉट या अन्य करेक्टर को मिटाएं और न ही अतिरिक्त स्पेस छोड़ें।
यह करने के बाद आपका कोड पूरी तरह तैयार है। अब इसे अपने ब्लॉग के लेआउट में जाकर एड ए गैजेट में एचटीएमएल/जावास्क्रिप्ट में लगा दीजिए। परिवर्तन को सेव करते ही आपको अपना टैब बॉक्स दिखने लगेगा।
उदाहरण- हिन्दी ब्लॉग टिप्स के टैब बॉक्स का कोड कुछ इस तरह से दिख रहा है-
<iframe scrolling="NO" frameborder="0" width="100%" src="http://www.gmodules.com/ig/ifr?url=http://hosting.gmodules.com/ig/gadgets/file/108384585615022758673/tfr2_v1_sj.xml&up_t1=http://tips-hindi.blogspot.com/feeds/posts/default/-/widget&up_t2=http://tips-hindi.blogspot.com/feeds/posts/default/-/cool-tips&up_t3=http://tips-hindi.blogspot.com/feeds/posts/default/-/simple-tricks&up_t4=http://tips-hindi.blogspot.com/feeds/posts/default/-/useful-things&up_t5=http://tips-hindi.blogspot.com/feeds/posts/default/-/start-a-blog&up_tn1=साधन&up_tn2=युक्तियां&up_tn3=सजावट&up_tn4=औज़ार&up_tn5=गुर&up_inc_desc=0&up_num_entries=10&up_show_summ=200&up_link_target=_blank&synd=open&w=360&h=250&title=Tabbed+Feed+Reader+v2a&border=%23ffffff%7C3px%2C1px+solid+%23999999&source=http%3A%2F%2Fwww.gmodules.com%2Fig%2Fcreator%3Fsynd%3Dopen%26url%3Dhttp%253A%252F%252Fmjin.kyungnam.ac.kr%252Ftfr2_v1_sj.xml%26lang%3Den" height="240px"></iframe><span style="font-size: 80%"><a href="http://tips-hindi.blogspot.com/2009/05/tab-box-widget_07.html">विजेट आपके ब्लॉग पर </a></span>
और यह टैब बॉक्स में सबसे ऊपर दिखाए अनुसार परिवर्तित हुआ है।
उम्मीद है कि यह उदाहरण आपको इसके चरण समझने में मदद करेगा।
इस टैब बॉक्स की सबसे बड़ी खासियत यह है कि यह आपके ब्लॉग की साइडबार में मौजूद जगह में अपने आप फैल जाएगा। इसे आपको छोटा या बड़ा करने की जरूरत नहीं है। इसके अंत में हिन्दी ब्लॉग टिप्स का लिंक लगाया गया है। यह इस विजेट के प्रसार में मदद करता है। आप चाहें तो इसे अपने टैब बॉक्स के साथ रखिए। जो लोग इसे हटाना चाहते हैं वे इसके लिए स्वतंत्र हैं।
अगर किसी तरह की समस्या आ रही हो तो बिना किसी संकोच के टिप्पणी कीजिए। मैं आपसे व्यक्तिगत रूप से संपर्क करूंगा।
क्या आपको यह लेख पसंद आया? अगर हां, तो ...इस ब्लॉग के प्रशंसक बनिए ना !!
हिन्दी ब्लॉग टिप्स की हर नई जानकारी अपने मेल-बॉक्स में मुफ्त मंगाइए!!!!!!!!!!
Subscribe to:
Post Comments (Atom)
Posts
38 comments:
बहुत उपयोगी है यह कोड .. पर टैग के हिन्दी में होने में क्या दिक्कतें आएंगी ?
बहुत सरल बना दिया आशिष आपने... धन्यवाद.
बहुत शुक्रिया ..
पर मेरी समस्या का कोई जवाब नहीं दिया बंधुवर...
क्या हर पोस्ट पर नए टैग लिखकर ही पब्लिश करना होगा? आपकी पिछली पोस्ट पर मैने दो टिप्पणियां दी थीं।
आशीष जी, कमाल की तकनीक है. फिलहाल मैंने तो आपके ब्लॉग के लेबल ही लगाये है अपने ब्लॉग पर. देखिये कैसा दिख रहा है. मैंने अपने इस टाइमपास वाले ब्लॉग :) के लेबल को भी यूज करके देखा था. काम कर रहा है, लेकिन मेरे ब्लॉग में ऐसा कुछ नहीं है जिसे प्रर्दशित करूँ. इसलिए मैं तो आपके लेबल्स ही यूज करूँगा अगर आपको कोई आपत्ति न हो तो.
एक समस्या, इसमें बैक ग्राउंड ग्रे है, क्या वो सफ़ेद हो सकता है?
धन्यवाद आशीष भाई, बहुत उपयोगी तरकीब है।
बहुत उपयोगी बात आपने सहज और सरलता से समझा दी. धन्यवाद.
रामराम.
yah bahut hi asaan vidhi bataayee hai.shukriya..jarur try karke dekhengey.
उपयोगी जानकारी हेतु आभार
इस बहु प्रतीक्षित विजेट के लिये धन्यवाद ।
फुरसत में आजमाया जायेगा जी।
भाई मैं तो आपके यहां आ आकर ही थोडा बहुत जानने लगा हूं कम्प्यूटर की भाषा। सिर्फ़ आभार कहकर मुक्त नहीं होना चाहता।
आशीष जी, बहुत - बहुत धन्यवाद काफी अच्छी तरह से आपने समझाया है, मैं अभी इसको इस्तेमाल नहीं करूंगा अभी मैं अपने ब्लॉग को नया रूप देने की कोशिश कर रहा हूँ...कोशिश में कामयाब होने के बाद में इसका इस्तेमाल ज़रूर करूंगा....
आशीष जी मैंने अपने ब्लॉग का नवबार आपके बताये तरीके से हटाया तो मेरा ब्लॉग पुरे पेज पर फैल गया, साईड़ बार पोस्ट के नीचे आ गया, कुछ मदद करें
उपयोगी जानकारी. आभार.
विजेट के लिये धन्यवाद ।
बड़े काम की चीज़ है ये ..
wah..! wah..! wah..!
umda jankari hai ye to..
meet
लो जी एक ओर शुक्रिया कैच करो.....
रेडीमेड कोड व आसान, सरल विवरण देने के लिए धन्यवाद. रचनाकार में इसका प्रयोग करते हैं.
वाह जी, मजेदार जानकारी, वो भी फस्ट फूड की तरह तैयार माल ।
काशिफ आरिफ जी,
आप मुझे टेम्पलेट की .xml फाइल भेज दीजिए। मैं इसे सुधारने की कोशिश करता हूं।
सैयद जी, इसमें आपत्ति कैसी? आप तो हिन्दी ब्लॉग टिप्स के प्रसार में मदद कर रहे हैं.. आभार.. अगर आप कोड समझते हैं और रंगों के एचटीएमएल कोड जानते हैं तो कोड में दिए गए रंगों में आसान से परिवर्तन कर सकते हैं।
आशीष भाई एक बार फिर से काम की जानकारी दी । आपका हार्दिक आभार!
जानकारी तो काम की है। देखते है कोशिश सफल होती है या नही। पर आपका शुक्रिया।
आशीष जी
धन्यवाद।
लुधियाना पंजाब से टिप्पणी कर रहा हैँ।
खटीमा वापिस लौट कर
इसे अपने ब्लॉग पर लगाऊँगा।
आदरणीय आशिषभाई
नमस्कार
आपका फोर्मुला मुझे अच्छा लगा। नये अविष्कार कि बधाई।
मेरे "हे प्रभु यह तेरापन्थ " के ब्लोग पर यह विजेट लगाना है पर अन्तिम चरण वाली बात समझ नही आई।
{ वेल्यू भर दीजिए वेल्यू क्या है ? मुझे यह पता नही पडा रहा है कि हरे वाले मे कोनसे शिर्षक भरने है ? }और मुझे उपरोक्त १२ लेबल वाला विजेट बनाकर मेल करेगे तो आपकी मेहरबानी होगी। आभार
आपका अपना
महावीर बी सेमलानी
हे प्रभु यह तेरापन्थ
http://ombhiksu-ctup.blogspot.com/
..........................................
धर्मकर्म
तेरापन्थ
जैन धर्म
व्यग
समाचार
लेख
कविता
कहानी
परिचय
शुभकामनाऐ
विडीयो
भेलपुरी
सर मैनेकल १२ लेबलो वाला एक विजेट के लिऐ प्रार्थना पत्र आपको भेजा था। कृपया सुचित करे/
आभार
हे प्रभू
महावीर जी, आग्रह करना चाहूंगा कि आपने जो श्रेणियां मुझे मेल से भेजी हैं, वे आपके लेबल में कहीं मौजूद नहीं है। बॉक्स आपके लिए तभी बनाया जा सकता है जब आप अपने ब्लॉग के लेबल सिस्टम में आवश्यक परिवर्तन करें। इसके लिए आपको यह पोस्ट पढ़ने की जरूरत है- पोस्ट के नीचे लेबल (टैग) की स्थिति सुधारें
बहुत बहुत धन्यवाद आपका.
मैंने अपने ब्लोग्स में tab-box लगा लिया है...
मैं जानना चाहता हूँ की क्या अनेक icons को एक साथ लगाने की कोई युक्ति है?
इसकी आवस्यकता इसलिए महसूस हुई क्योंकि अधिकतर सोशल साइट्स अपने लिंक को ब्लॉग पर लगाने को कहते हैं और इस तरह ब्लॉग का लुक ख़राब होता है और crowded दीखता है।
add HTML में स्पेस देकर इन्हे एक line में शायद रखा जा सकता है लेकिन शक होता है की कहीं इससे स्पीड वगेरह पर कोई प्रभाव न पड़ता हो...
Thankx...
रेडीमेड माल तो सभी को पसंद आता है। फिर मैं इसका अपवाद कैसे हो सकता हूं।
-Zakir Ali ‘Rajnish’
{ Secretary-TSALIIM & SBAI }
बहुत उपयोगी है यह कोड ..
yah Widget main ne bhi apne blog par laga liya hai.
aur khaas dhnywaad aap ko kahne dobara aayi hun.
is widget ke liye bahut bahut dhnywaad.
May God bless you.
Sir ji yeh vijet pichhale 2 din se kaam nahi kar raha hai..........
hey bhut accha likha ha tumne
Post a Comment