How to Add CustomHTML code or Java script in blogger

PLACE YOUR AD CODE HERE

For beginner or amateur blogger like me, will be very difficult to make posting that contains the HTML, CSS, or JavaScript. You might have ever seen a blog post which showing html script in a display box. >

So, how to make our blog post able to show HTML or Java Script?. You don't need to have headache about it. You only need doing some simple steps as follow:

1. Log in to your blogger account
2. Click Layout
3. Then click Edit HTML
4. Backup your template
5. Find ]]>
6. Add below script right above ]]> section.

pre
{
background:#c0c0c0;
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;
}

7. Save your template

The code above is for drawing a display box inside the post to show HTML and Java Scripts you want to post. Hemmm.... You can change the length ,width ,size and color of the box as well by editing the code . Even you can add an image background by adding image url following color code of display box background.

Now you able to post HTML and Java Script code in your blog post. You can call the display box anytime into your post by writing below code:

<pre> Place your HTML or JAVA Script Here </pre>

But, before you place your HTML or Java Script code, you need to make your code postable by generate your HTML or Java Script here to make it friendly. Paste your HTML or Java Script inside the box provided and then click make it friendly.

And then, copy the generated code and paste between

<pre> & </pre>

to make it posted inside display box