How to Add Code Box on Blogger
Hello!
Dear friends my name is ARYA KHAN today I am going to show you! how to add code box between blogger post.
Code box is a good thing code box give a beautiful look like a professional blog. So we are going to use a CSS code. All you have to do is head on over to your Template/Theme page, click the Edit HTML and scroll down to where it says ]]</b:skin>. Just above ]]</b:skin> paste the step 1 code.
Step 1
Code:
.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; }
Steps 2
How To Use This:
To use this in your post just follow the following steps:
1. To use this just click on HTML tab in your blogger post editor.
2. Now write or paste the code given below in your blogger post editor :
Box code:
<div class="code"> Your Code Here </div>
3. Replace " Your Code Here " with your desired code.
4. Now click on " Publish Button " and see it live.
That’s all! Of course, don’t forget to save your changes. Thank You!
