I Look 12

Subscribe to I Look 12

Share

Digg

Bookmark

Stumble

Reddit

Email

---

Ever wondered how to add code boxes on your blogger post? There are two ways, one is a simple method which is best suited for beginners(like me) and the other is the advanced method which gives your code box a more professional look but requires a little source tweaking.

So here's the simple method, just paste this code on your post editor in Edit HTML tab.
<textarea name="textarea" cols="40" rows="4" wrap="VIRTUAL">
YOUR CODE 
</textarea>

Here's an image on where to post the code:















And here is the result:
YOUR CODE

It's just the simple version, but if you want it Professional Code Box look, follow this second method.

1. Follow this guide on How To Edit Your Blog Template

2. Find(CTRL+F) ]]></b:skin>

3. Add this code ABOVE ]]></b:skin>

4. Click Save Template

5. Now go to your Dashboard and make a new post on the blog where you added the Professional Code Box.

On Edit HTML tab, just paste this code:
<div class="code">
 YOUR CODE 
</div>
(refer to the image above for reference)

Here is the result:

Note: You cannot see the Professional Code Box on your post editor, so you'll have to save it and view the post from your blog.

Source: WebUpd8