Blogger Template: आओ जाने सीखें ब्लोगर टेंपलेट – अंतिम भाग

[अगर आप अपने ब्लोग के लिये ब्लोगर टेंपलेट उपयोग में लाते हैं तो शायद ये आलेख आप को ब्लोगर टेंपलेट समझने में मदद पहुँचा सके।]

आज आपके ब्लोग के पीछे छिपे HTML कोड को समझने की कोशिश करते हैं, Edit HTML के मेनु को सलेक्ट करने पर एक बड़े से बॉक्स में जो कोड दिखायी देता है वो ही बनाता है हमारा ब्लोग। आप अगर इसे देखें तो ये रेगुलर HTML कोड और CSS का मिश्रण दिखायी देता है लेकिन इस में बहुत सारे कस्टमाईजड टैग भी हैं जो Layout वाले स्क्रीन या टैब में Page Element के ड्रैग एंड ड्रॉप यानि इधर-उधर करने से कोड में जुड़ते हैं। साथ ही साथ फोंट और कलर की सैटिंग से जुड़े कोड भी होंते हैं।

Blogger Template: आओ जाने सीखें ब्लोगर टेंपलेट- भाग १, भाग २ Expand Widget Template का जो बॉक्स है वो अगर सलेक्ट नही है तो आपको ब्लोग में उपयोग में आये Page Element का कोड एक लाईन में दिखेगा लेकिन अगर आप इस बॉक्स को सलेक्ट करके कोड देखेंगे तो Page Element के कोड डिटेल में यानि डॉटा और उसके टेंपलेट के साथ दिखेंगे। उदाहरण के लिये नीचे के दो चित्रों में नजर दौड़ायें
Expand Widget Template बॉक्स जब सलेक्ट नही है

Expand Widget Template बॉक्स जब सलेक्ट है


सबसे पहले नजर डालते हैं Page Elements Tag के ऊपर

सेक्शन (जैसे साईडबार, फुटर) और विजेट के कोड से भरा होता है HTML का बॉडी टैग “<BODY>“। विजेट कुछ और नही एक अकेला पेज एलिमेंट है जैसे कोई पिक्चर या ब्लोगरोल या दूसरे ब्लोगस की फीड। इससे साफ होता है कि हम किसी भी सेक्शन में जो चाहें वो HTML कोड उपयोग में ला सकते हैं।

हर सेक्शन में एक शुरूआती टैग होता है दूसरा उस सेक्शन को बंद करने का। ऊपर के पहले चित्र में दिये गये कोड में हैडर रैपर के नीचे देखें तो वो हैडर सेक्शन का कोड है। जो कुछ ऐसा दिखता है -

<b:section id='header' class='header' maxwidgets="1" showaddelement="no">
</b:section>

हर टैग में कुछ Attributes होते हैं जैसे इसमें भी दिखायी देते हैं। आगे बढ़ने से पहले इन्हें आसान शब्दों में समझने की कोशिश करते हैं। जैसे आपका घर होता है उस घर में अलग अलग कमरे होते हैं और हर कमरों में अलग अलग सजावट का सामान होता है वैसे ही होता है ब्लोग का टेंपलेट, यानि टेंपलेट जैसे घर, टेंपलेट के सेक्शन जैसे कमरे और सजावट का सामान जैसे Attribute। आइये अब सेक्शन टैग के Attributes जानते हैं -

ID - ये एक नाम का एक ही होना चाहिये और ये एक जरूरी अंग या Attribute है

Class - ये आप्शनल है जरूरी नही लेकिन टेंपलेट बदलने में ब्लोगर के लिये सहायक सिद्ध होते हैं और या सजावट के लिये CSS में ईस्तेमाल करके यहाँ उसका नाम दे सकते हैं।

maxwidgets - ये भी आप्शनल है लेकिन इसकी वेल्यू ये तय करती है कि किसी सेक्शन में अधिकतम कितने विजेट उपयोग में आ सकते हैं। उदाहरण के लिये हैडर के सेक्शन में इसकी वेल्यू हमेशा एक ही होती है। अगर आप चाहें कि हैडर के सेक्शन में कोई और विजेट डालें तो इस सुविधा को Layout में लाने के लिये आपको इस वेल्यू को बदलना होगा।

showaddelement - ये भी आप्शनल है और इसकी वेल्यू या तो नो (no) होती है या यस (yes)। ज्यादातर आप्शनल एट्रीब्यूट की कोई ना कोई डिफॉल्ट वेल्यू होती है, इसकी yes है। लेकिन हैडर के सेक्शन में आपको ये ‘no’ दिखायी देगी।

अगर आप हैडर में दो Page Element या विजेट चाहते हैं तो maxwidget की वेल्यू होगी २ और फिर showaddelement की वेल्यू होगी yes। इससे आपको ‘Add a Page Element’ (पुराना वर्जन) या ‘Add a Gadget’ (नया वर्जन) वाला लिंक Layout में दिखायी देने लगेगा।

growth - ये भी आप्शनल एट्रिब्यूट है जो तय करता है कि विजेट को एक दूसरे के साइड में रखना है या एक दूसरे के ऊपर। इसकी डिफॉल्ट वेल्यू वर्टिकल (vertical) है, दूसरी वेल्यू horizontal।

Widget Tag
एक सेक्शन के अंदर विजेट हो सकते हैं लेकिन दूसरा सेक्शन या कोड नही। सेक्शन की तरह विजेट में भी एट्रीब्यूट होते हैं। एक नजर उनमें भी डालकर देखते हैं, ऊपर के पहले चित्र में हैडर सेक्शन के बीच में विजेट दिखायी देता है, कुछ ऐसा -

<b:widget id='Header1' locked='true' title='Tarun's Test Blog (Header)' type='Header'/>

इसके एट्रिब्यूट कुछ इस प्रकार हैं -

ID - ये एक नाम का एक ही होना चाहिये और ये एक जरूरी अंग या Attribute है इस ID को बगैर विजेट को हटाये नही बदल सकते यानि पहले विजेट हटायें फिर नया बनाये।

type - ये भी जरूरी अंग है जो बताता है कि कोई किस प्रकार का विजेट है, ये नीचे दी गये प्रकार में से किस एक प्रकार का ही हो सकता है।

locked - ये आप्शनल है और इसकी वेल्यू या तो ‘yes’ या ‘no’ हो सकती है, ‘no’ इसकी डिफॉल्ट वेल्यु है। अगर विजेट को लॉक किया गया है तो Page Element tab or screen में से ना उसे एक स्थान से दूसरे स्थान मूव किया जा सकता है और ना ही मिटाया जा सकता है।

title - ये भी आप्शनल है और विजेट का टाईटिल बताता है। अगर कुछ नाम नही दिया तो ये विजेट टाईप का नाम टाईटिल की तरह ईस्तेमाल करता है।

pageType - ये भी आप्शनल है जो बताता है कि इस विजेट को किस तरह के पेज में दिखाना है। इसकी वेल्यू है -’all’, ‘archive’, ‘main’, या ‘item’, इसकी डिफॉल्ट वेल्यू ‘all’ है। आप चाहे इनमें से कोई भी वेल्यू सलेक्ट करें लेकिन Page Element के टैब में आपको सारे विजेट दिखायी देंगे।

विजेट के प्रकार इस तरह हैं -

  • BlogArchive
  • Blog
  • Feed
  • Header
  • HTML
  • SingleImage
  • LinkList
  • List
  • Logo
  • BlogProfile
  • Navbar
  • VideoBar
  • NewsBar
  • यहाँ एक बात ध्यान देने योग्य ये है कि आपके पब्लिशड ब्लोग यानि कि अगर आप अपने ब्लोग का सोर्स कोड ब्राउजर के “व्यू सोर्स” लिंक में जाकर देखेंगे तो आपको सेक्शन और विजेट के कोड <DIV> टैग में बदले हुए नजर आयेंगे।

    अगर आपको Internet Explorer पर कोई लिंक नही दिखते या कुछ save करने में समस्या आती है तो किसी दूसरे ब्राउजर खासकर फायर फोक्स में भी ट्राई करके देखें।इसी तरह के टैग फोंट और कलर के लिये भी रहते हैं जिसके अपने एट्रिब्यूट होते हैं। आगे पोस्ट होने वाली कई अलग अलग ब्लोगर टिप्स में हम इन कस्टमाईजड टैगस को उपयोग में लायेंगे, उम्मीद करता हूँ कि इस पोस्ट से आपको उन्हें समझने में थोड़ा आसानी रहेगी।

    ब्लोगर ने भी अपनी हैल्प में से काफी कुछ का हिन्दी में अनुवाद कर दिया है लेकिन अभी भी टेंपलेट को समझने वाली हैल्प का अनुवाद बाकि है। आप चाहें तो ब्लोगर की हिन्दी में दी गयी हैल्प को बुकमार्क कर सकते हैं, इसमें काफी सारे सवालों को समझाया गया है। इसके लिये लिंक ये रहा – ब्लोगर सहायता

    This entry was posted in Blogging, Blogging Tools and tagged , , . Bookmark the permalink.

    5 Responses to Blogger Template: आओ जाने सीखें ब्लोगर टेंपलेट – अंतिम भाग

    1. Dr.Anurag says:

      बहुत अच्छे दोस्त ,आगे ओर किसी काम की जानकारी का इंतज़ार रहेगा

    2. kaabeera says:

      yah siriij ,bahut pasand aaee.ham jaise agyaanii logon keliye gyaan kaa bhandaar hai .
      kisi lekh men nimna binduon parbhi gyan vardhan karen :—–>
      [1]._ html code evam java script men kya antar hai .
      [2] kyon nahiin html/java code kisi bhi prakar ke page par likhne par code sakriy ho jaataa hai .vaiseis siriij ke liye dhanyavaad .
      koee aur nahii
      http://anyonasti.blogspot.com

    3. Basant Kumar Kanwat says:

      Useful information, Thanks Tarun Bhai

    4. मैने आज पेहली बार आप्का ब्लोग पढा और पिछ्ले २ घन्टे से आपका ब्लोग पढ रहा हू, एक पोस्ट खत्म होती है तो दूसरी मिल जाती है…

      आपका बहुत – बहुत धन्यवाद