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