Blogger Post में HTML या CSS Code Box कैसे Add Kare

नमस्कार दोस्तों ! आज मैं आपको बताने जा रहा हूँ कि कैसे आप अपने post में HTML या CSS code के लिए code box को लगा सकते हैं | Blogger blog बहुत ही अच्छा platform है उन सभी के लिए जो कि अपने thought को share करना चाहते है और इससे money earning करना चाहते है | Blogger blog free है और यह आपको आपके choice के अनुसार blogger template को edit करने का option देते है |

आप blogger blog template को edit HTML ऑप्शन पर click करके edit कर सकते है और उसमे html या CSS code को add कर सकते है या फिर customise पर क्लिक करके CSS code को add कर सकते है |

जब आप कोई ऐसा post लिखते है जिसमे कि कुछ उपयोगी HTML और CSS program की जानकारी देते है तो आप जरूर चाहते होंगे कि HTML और CSS code आपके पोस्ट में stylish and professional दिखें | तो दोस्तों आप मैं आपको इसी बारे में बताने जा रहा हूँ कि HTML और CSS code box अपने post  में कैसे show करें |


Wordpress में इसके लिए विशेष plugins होता है | बहुत सारे tools भी है जहाँ
से आप code box के लिए code बना सकते हैं | परंतु इसमें एक समस्या यह हो सकती है कि code के साथ उनके site का link भी हो | इस तरह का code अपने site पर लगाना ठीक नहीं होगा | आपको डरने की जरुरत नहीं है | मैं जो आपको code दे रहा हूँ उसमे किसी भी तरह का link जुड़ा हुआ नहीं होगा |

• Social Media Fans Counter Widget को Blog में कैसे Add करे ?
• Blog बनाने के बाद New Post कैसे लिखे और Publish करे ?

Blogger Post में HTML और CSS Code Box कैसे Add करें ?

Blogger post में code box को लगाने के लिए मैं आपको आसान सा method बतलाता हूँ | बस आप मेरे steps को follow करें |

Step 1

सबसे पहले अपने blogger account में login करके blogger dashboard में जाएं |


Step 2

1. Theme (template) पर click करे |
2. Customise पर click करें |

Step 3

Customise पर click करने के बाद एक नया window open होगी |

1. Advanced पर click करें |
2. Add CSS option पर click करें |
3. अब आपके सामने एक new box open होगी जो कि CSS editor है | नीचे दिए code को copy करके इस box में paste कर दे और उसके बाद Apply to Blog button पर click करें |

/* Code Box ----------------------------------------------- */ .code { background:#f5f8fa; background-repeat:no-repeat; border: solid #5C7B90; border-width: 1px 1px 1px 20px; color: #000000; font: 13px 'Courier New', Courier, monospace; line-height: 16px; margin: 10px 0 10px 10px; max-height: 200px; min-height: 16px; overflow: auto; padding: 10px 10px 10px; width: 90%; } .code:hover { background: #FAFAFA; background-repeat:no-repeat;}

Step 4

Post editor को open कीजिए |

1. HTML button पर click करें |
2. Post में जिस place पर code box को रखना है, उस place पर नीचे दिए code का इस्तेमाल करें |
   

   <div class="code"> Your Code </div>

3. <div class="code"> और </div> के बीच में HTML or CSS code को रखें और फिर compose button पर click करें |

इसी प्रकार आप code को <div class="code"> और </div> के बीच में रखकर अपने post में code box को लगा सकते है |


Note:- बहुत से free blogger template में code को add करने के लिए customise option में CSS editor box नहीं होता है | अगर आपके ब्लॉगर टेम्पलेट में यह option नहीं है तो आप दूसरे method से HTML और CSS code box को अपने post में लगा सकते है | दूसरे method का इस्तेमाल करने के लिए यह post पढ़े : Blogger Post में Code Box कैसे Add करे ?

• सभी YouTube Videos में Subscribe Button कैसे Add करें ?
• Website के लिए Domain Name कैसे खरीदे या Register करें ?

HTML और CSS Code box को blog post में लगाने में कोई problem आती है तो मुझे comment करके बताये | मैं आपके problem को दूर करने का पूरी कोशिश करूँगा | इसी तरह का post पढ़ते रहने के लिए मुझे subscribe करें |

अगर यह post आपको पसंद आया हो तो इसे अपने दोस्तों के साथ facebook, twitter, google + etc. जैसे social site पर share करें | इस post को like करें |