ब्लोगर टिप्सः ब्लोग लेखक के कमेंट को हाईलाईटेड बॉक्स में कैसे दिखायें

डा. अनुराग ने मुझसे बहुत पहले पूछा था “एक सवाल जैसे की मैंने इंग्लिश के कई टेम्पलेट्स में देखा है author कमेन्ट highlight होते है ऐसा कैसे ?” तो आज आपको बताते हैं कि आप ये कैसे कर सकते हैं।

सबसे पहले तो अपने टेंपलेट का बैकअप ले लें (बैकअप कैसे लें जानने के लिये इस पोस्ट को पढ़ सकते हैं)। उसके बाद सबसे पहले आपको अपने कमेंट के लिये एक सेटिंग बदलनी है। इसे करने के लिये सेटिंग में जायें फिर कमेंट के टैब पर क्लिक करके “Comment Form Placement” के लिये तीसरा आप्शन “Embedded below post” सलेक्ट कर लें।

इसके बाद आपको layout टैब पर जाकर Edit HTML पर क्लिक करना है, उसके बाद आपको HTML कोड एक बड़े बॉक्स में दिखायी देगा। इस बॉक्स के ऊपर लिखे “Expand Widget Templates” आप्शन को सलेक्ट करना है। अब कोड के बॉक्स में आपको कमेंट के कोड से कमेंट के कुछ टैग सर्च करने या ढूँढने होंगे। मैंने अपने टेस्ट ब्लोग के टेंपलेट में से कोड लेकर नीचे कॉपी किया है, आप में से ज्यादातर के ब्लोग में शायद ये कोड ऐसा ही मिलेगा लेकिन यहाँ पर ध्यान रहे ये जरूरी नही कि आपको अपने टेंपलेट में बिल्कुल यही कोड दिखायी दे। उसके लिये इसी कोड से आयडिया लेकर कुछ कमेंट के टैग सर्च कर सकते हैं।

सर्च करने के लिये आप चाहें तो निम्न टैग ढूँढ सकते हैं -

  • <data:comment.body/>
  • <data:comment.author/>
  • <data:comment.timestamp/>
  • <b:loop values=’data:post.comments’ var=’comment’>
  • मेरे ब्लोग टेंपलेट में कमेंट का पूरा कोड ऐसा है, ऐसा ही आप को भी देखना है -

    आपने यहाँ नोट किया होगा कि ऊपर के कोड में <dl> और <dd> के टैग यूज हुए हैं, हो सकता है कुछ टेंपलेट में इनके जगह पर <li> या <ul> टैग दिखें और या हो सकता है सिर्फ <div> टैग ही नजर आये।

    [tip]कोड कापी करने के लिये बॉक्स में कहीं पर भी क्लिक करके CTRL + A (कंट्रोल और A बटन को साथ-साथ दबायें) दबायें इससे कोड हाईलेट हो जायेगा, उसके बाद CTRL + C दबायें कोड कापी हो जायेगा।[/tip]

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

    कोड को बदलने के बाद Preview के बटन पर क्लिक करके देखें, अगर कोई Error नही आती है तो आप आगे बढ़ सकते हैं और अगर कोई Error आये तो फिर Clear Edits के बटन पर क्लिक करके अपने Changes को Undo कर लें। इससे पुराना कोड वापस आ जाता है। फिर से एक बार कोड को चैक करके बदलने की कोशिश करें हो सकता है आपने कोई एक लाईन छोड़ दी हो।

    बस अब हमें ब्लोग लेखक के कमेंट को स्पेशल तरीके से दिखाने का इंतजाम करना है। इसके लिये हम टेंपलेट में एक नये स्टाईल के लिये क्लास एलीमेंट डालेंगे। ऊपर दिये गये कोड में हमने author-commenting-style यूज की है। तो इसके लिये नीचे दिया गया कोड टेंपलेट में डालना है। अपने टेंपलेट में </b:skin> कोड को ढूँढे और इससे ठीक पहले जो भी ऐलीमेंट का क्लोज ब्रैकेट दिखता है (ये कुछ ऐसा दिखेगा } ), उसके तुरंत बाद नीचे दिया गया कोड कॉपी करके डाल दें।

    .author-commenting-style {
    background: #ffcc66;
    border: 1px solid #e1771e;
    padding: 5px;
    }

    अगर आपको मेरे दिये गये रंग से अलग रंग दिखाना है तो आप बैकग्राउंड और बोर्डर का कलर कोड अलग दे सकते हैं। (ये आप इस Color Picker की साईट से पिक कर सकते हैं) ये सब करने के बाद आपका कमेंट कुछ ऐसा दिखायी देगा -

    इस स्टाईल में आप चाहें तो थोड़ा और बदलाव ला सकते हैं जैसे मैने इसे कुछ इस तरह से बदला -

    .author-commenting-style {
    color: #DD6245;
    font-size: 12pt;
    font-weight:italic;
    background: #ffcc66;
    border: 1px solid #e1771e;
    padding: 10px;
    }

    तो अब ये कैसा दिखेगा वो आप यहाँ पर जाकर देख सकते हैं। अगर आपको कोई समस्या आती है कमेंट का कोड ढूँढने में तो आप अपना टेंपलेट बतायें और कहाँ से डाऊनलोड किया है, मैं कोशिश करके देख सकता हूँ।

    This entry was posted in Blogger Tips, Blogging Templates, How to and tagged , , , . Bookmark the permalink.

    15 Responses to ब्लोगर टिप्सः ब्लोग लेखक के कमेंट को हाईलाईटेड बॉक्स में कैसे दिखायें

    1. seema gupta says:

      ” very informative and wonderful post”

      Regards

    2. yunus says:

      हम्‍म । सही है । फुरसत से इस अभियान में जुटेंगे ।

    3. alpana says:

      yah to main bhi janNa chahti thi.
      bahut shukriya–aap ka yah blog pahli baar dekha.

    4. alpana says:

      arrey nahin–pahle bhi aayi hun..:)

    5. badiyaa jaankaaree hai dhanyvaad

    6. ye line nahi mil pa rahi hai.jaise ki mai apne templete ka example de raha hun……

      ab upar vaali line ke badle kya dhoondhu samjh nahi pa raha hun.

    7. templete ke html nahi le raha hai…mujhe apna mail id do .

    8. बहुत काम की जानकारी. आभार.

    9. Abhi says:

      jankari bahut achchi hai.
      ye bataye ki blog me offline me posting ki formating aur typing kar sakte hai? yadi han to kaise ?

    10. हालॉंकि मामला थोडा टेढा है, पर फुर्सत के क्षणों में ट्राई किया जा सकता है।

    11. खाली वक्त का जरूरी काम हो सकता है. धन्यवाद.

    12. जय जुगाड़! बहुत अच्छी लगी पोस्ट।

    13. Amit says:

      bahut accha..Thanks

    14. है तो बड़े काम की चीज, लेकिन इसको लगाने में बड़ी मेहनत लगने वाली है। …समय देखकर आजमाते हैं।

    15. बहुत बढिया जानकारी दी है । मैने तो आसानी से बदल लिया है । बहुत बहुत धन्यवाद