How To Add HTML and JavdScripts Inside Blogger Blogs

If you display a lot of HTML or JavaScript on your blog you may want to display your script in a separate box. If you look around there is a lot of blogs that use this technique.
To be able to display HTML or JavaScript can look really cool to display the code in custom display boxes. It's also good if you add a lot of coding onto your blog, it helps to keep everything nice and tidy.
Follow these simple steps to add a display box to your blogger posts.
The first thing to do is log into Blogger > Dashboard > Design > Edit HTML and Download full Template. Then search for ]]></b:skin> and add the following code just above it.

pre
{
background:#efefef;
border:1px solid #A6B0BF;
font-size:120%;
line-height:100%;
overflow:auto;
padding:10px;
color:#000000 }
pre:hover {
border:1px solid #efefef;
}
code {
font-size:120%;
text-align:left;
margin:0;padding:0;
color: #000000;}
.clear { clear:both;
overflow:hidden;
}

Save the Template and your finished.
So now you need to add the code to the page.
You can now add the display box anywhere on your post by adding:
<pre>
"your HTML or JAVA script"
</pre>
Secondly the code you place between the tags above must be friendly. In order to do that, replace all "<" with < and all ">" with >.
That's it.
Please subscribe to this blog for regular updates.
If you have any comments to make or would like help with anything on this post please visit our Forum and I will try my best to help