Adfly Links not working Find Direct Links HERE

How to Show Colored Background For HTML and JAVA Scripts In Post of Blogger Blogs.

To give a professional look to your blog you can show a colored Background to HTML and JAVA Scripts Shown in Post area in Blogger Blogs.So That reader can easily differentiate between code and simple here is a simple code to do this.

Login to Blogger>>>Go To LAYOUT>>>Then Click On Edit HTML>>>Check Mark Expand Widgets>>>Press Ctrl+F

Search For below code:-


And place Below CCS code above previous code

border:1px solid #A6B0BF;
color:#000000 }
pre:hover {
border:1px solid #efefef;
code {
color: #000000;}
.clear { clear:both;

(If you want to show image in background just replace background:#efefef; above with
background: Url(http://YOUR_IMAGE_URL);)

it will loo like this

The above code is for drawing a display box inside the Blogger post to show HTML and JavaScript.You can change the length ,width ,size and color of the box , back ground image etc. by editing the CSS code. After adding this code you can call the display box anytime into your post by following next step.

"your HTML or JAVA script"

In Blogger in draft , there would be a problem with this HTML and JavaScript display box . For fixing that,
Expand Post options from the Blogger text editor ( On the bottom left corner ) . From the compose settings, select Interpret typed HTML . Now everything would appear fine .

Before you add "your HTML or JAVA script " make it post friendly by following this link
Inside the box provided paste the script and click make it friendly
Now copy the generated code and paste between <pre> & </pre> to keep it inside display box

Making the script post able is the only requirement if you plan to show the HTML or Java Script alone , without a display box.

1 comment :

Feel free to leave comment if you like above widget, have any questions or just say Hi! :)