Sunday, 26 March 2017

Blogger Post में Code Box कैसे Add करें



Blog post में code box को add करना बहुत ही जरुरी है क्योंकि यह हमारे blog के post को professional look देता है और users को भी code का  इस्तेमाल करने में सुविधा होती है | मैंने पिछले post में भी HTML और CSS code box को blogger post में add करने  का सबसे आसान तरीका बतलाया था|


Code box ko blogger post me kaise add kare


अब मैं आपको इस post में code box को add करने का दूसरा method बतलाऊंगा | इस code को add करना बहुत ही आसान है | आप मेरे steps को follow करें |






Step 1

सबसे पहले यह code copy कर लीजिए |

/* 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 2

  1. अपने blogger account में login करके blog के dashboard पर जाए |
  2. Theme पर click करें |
  3. Edit HTML पर click करें |

Click on theme and then edit html button



Step 3

Edit HTML पर click करने के बाद template का editor open होगा |

Paste CSS code

  1. Editor में कहीं पर भी click करके Ctrl + F key press करें |
  2. Ctrl + F key press करने के बाद editor में सबसे ऊपर दायां तरफ एक search box open होगा | उसमे ]]></b:skin> लिखकर search करें |
  3. ]]></b:skin> के ऊपर या पहले copy किये हुए code को paste कर दीजिए |
  4. अब Save पर click करें |


Note :- Code को add करने से पहले अपने template का backup ले लें ताकि अगर code को add करने में कोई गलती होती है तो फिर से अपने template को upolad कर सकते है |


Step 4

Post editor को open कीजिए |

Open post editor and switch on html mode

  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 को लगा सकते है |





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



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

2 comments:

Comment Rules :

1. Comments deemed to be spam or solely promotional in nature will be deleted.
2. Anonymous comments will be deleted. We only accept comment from posters who identify themselves.

About Admin