How to add a code box on blogger

How to add a code box on blogger

Blogger blogs are good for newbie bloggers who start sharing his or her thoughts. Blogger blog is free, it gives the opportunity to edit templates option according to your choice. There are following step to use and add code box in blogger:

Step1: Log in to your blogger Dashboard >>> Template >>

Step2: Then Click on the Customize

Step3: Now a window will open their click on Advanced >>> then >>> Add CSS

Step4: After this, a box will open. Add the following code in the box and click on Apply to blog button to enable this into your blog.

.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: 28px 10px 10px; width: 90%; } .code:hover { background-repeat:no-repeat; }

Step5: Now in order to apply this to blogger post, when you're composing your post goes to HTML and then put code between the following tags

<div class="code">
Paste your code
</div>