Add Code Box in Blogger - blogspot.com

The steps to use and add a code box in Blogger are as follows:

Step 1 - Log in to your blogger dashboard and select Template.

Step 2 - Next, select Customize.

Step 3 - A window will now open; select Advanced, followed by Add CSS.

Step 4 - A box will then open. To enable this in your blog, enter the following code in the box and click the apply to blog button.

.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; }

Step 5 - To apply this to a blogger post, select HTML while writing your post, and then insert the following tags.

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