A blog about technology, Internet, social media, blogging tips, seo tips, computer tips and tricks, earning money online, etc.
How To Add Code Box Area In Blogger Posts
It is good to have a code box area in your blogger posts if your blog is about blogger tutorials, blogger widgets, blogger templates or it deals with any kind of blog customization. It will become easy for anybody to locate the html code and easily copy and paste the code for using it. It will also give a well organised look to your blog posts. Just read and follow all the steps given below to get this function in your blogger blog for each post.
Step1: Log in to your blogger account. Go to Dashboard >> Template.
Step2: Click on the Customize.
Step3: GO to Advanced >> Add CSS.
Step4: Copy and Paste the following code in the Add CSS section.
Step5: Now whenever you are composing new post , just select HTML section and paste the following code.
<div class="code">
Paste your code
</div>
Step6: Go to Compose mode. Replace Paste your code with your code. Complete your post and publish it.
Step1: Log in to your blogger account. Go to Dashboard >> Template.
Step2: Click on the Customize.
Step3: GO to Advanced >> Add CSS.
Step4: Copy and Paste the following code in the Add CSS section.
.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 whenever you are composing new post , just select HTML section and paste the following code.
<div class="code">
Paste your code
</div>
Step6: Go to Compose mode. Replace Paste your code with your code. Complete your post and publish it.
Subscribe to:
Post Comments (Atom)
-
HeartATech
Copyright©2012 HeartATech. Articles cannot be reproduced without permission from the author.
Powered by Blogger
Usefull .. thx and btw nice blog, very interesting
ReplyDeletethanks
Deletenice work.... thanks for communicating this information. http://crackmodo.blogspot.com/
ReplyDeleteWelcome. Keep visiting here.
DeleteGreat webpage brother I am gona inform this to all my friends and contacts.
ReplyDeletehow to box
Thanks for posting this!
ReplyDeletenice info
ReplyDeletewww.techrevert.com
Nice Post......
ReplyDeleteamazing post
ReplyDelete