Different Designs Collection For Displaying HTML,javascript,css and other code into blogger post

loggers often do many hacks to their blog themes or templates to give it a professional look. If you run a blog where you post tutorials and use HTML, CSS, JavaScript or any other codes in your posts then you can show these codes on a colored and professional looking background. It will not only help you to give your blog a professional look but it will also help your readers to easily distinguish the codes used in the post, so i have created some different designs for it, and you can use my all designs on different posts.

Here's How To Do It .

and mark the tick box "Expand Widget Templates"
Then, find (CTRL+F) this code in the template.

</head>

And immediately before it, paste this code:

Now save you template to make the changes apply

Style 1

whenever you want to insert some codes in your posts always put it between <div class=”md”> and </div> like these as Shown below:<br />

Result:

Style 2

whenever you want to insert some codes in your posts
always put it between <div class=”md2”> and </div> like these
as Shown below:

Result:

Style 3

whenever you want to insert some codes in your posts
always put it between <div class=”md3”> and </div> like these
as Shown below:

Result:

Style 4

whenever you want to insert some codes in your posts
always put it between <div class=”md4”> and </div> like these
as Shown below:

Result:

Style 5

whenever you want to insert some codes in your posts
always put it between <div class=”md5”> and </div> like these
as Shown below:

Result:

Style 6

whenever you want to insert some codes in your posts
always put it between <div class=”md6”> and </div> like these
as Shown below:

Result:

Style 7

whenever you want to insert some codes in your posts
always put it between <div class=”md7”> and </div> like these
as Shown below:

Result:

Style 8

whenever you want to insert some codes in your posts
always put it between <div class=”md8”> and </div> like these
as Shown below:

Result:

Style 9

whenever you want to insert some codes in your posts
always put it between <div class=”md9”> and </div> like these
as Shown below:

Result:

margin : 15px 35px 15px 15px;
padding : 20px 10px 10px 35px;
background : #EEEEEE url() repeat-y top left;
border-top : 1px solid #AAAAAA;
border-right : 1px solid #AAAAAA;
border-bottom : 1px solid #AAAAAA;
border-left : 1px solid #AAAAAA;margin : 15px 35px 15px 15px;
padding : 20px 10px 10px 35px;
background : #EEEEEE url() repeat-y top left;
border-top : 1px solid #AAAAAA;
border-right : 1px solid #AAAAAA;
border-bottom : 1px solid #AAAAAA;
border-left : 1px solid #AAAAAA;margin : 15px 35px 15px 15px;
padding : 20px 10px 10px 35px;
background : #EEEEEE url() repeat-y top left;
border-top : 1px solid #AAAAAA;
border-right : 1px solid #AAAAAA;
border-bottom : 1px solid #AAAAAA;
border-left : 1px solid #AAAAAA;

If You Enjoyed This Post Please Take 5 Seconds To Share It.

Title : Different Designs Collection For Displaying HTML,javascript,css and other code into blogger post
Description : B loggers often do many hacks to their blog themes or templates to give it a professional look. If you run a blog where you post tutorials...

Different Designs Collection For Displaying HTML,javascript,css and other code into blogger post

0 Response to "Different Designs Collection For Displaying HTML,javascript,css and other code into blogger post"

Post a Comment