All of you might have noticed that in my blogger posts I use a custom CSS style to show CSS codes , Scripts and other important notes. After looking at this cool features one of my reader asked me how to do this. So I am Posting this " Post Styling Hack for blogger to display scripts and CSS codes in unique style " .
Just Follow This steps to add this " Post Styling Hack " to your Blog .
Step 1 :
Login to your Blogger account and navigate to Layout section . Then go to Edit Html subtab .
No Need to Check Expand Widgets Box
Step 2 : Add This CSS code above this line ]]> .
.codeview {
margin : 15px 35px 15px 15px;
padding : 10px;
clear : both;
list-style-type : none;
background : #f9f9f9 url(http://i263.photobucket.com/albums/ii150/mohamedrias/cv-1.gif) no-repeat right bottom;
border-top : 1px solid #eeeeee;
border-right : 2px solid #cccccc;
border-bottom : 2px solid #cccccc;
border-left : 1px solid #eeeeee;
}
.codeview li {
font-size : 13px;
line-height : 24px;
font-family : "Courier New", "MS Sans Serif", sans-serif, serif;
color : #333333;
font-weight : normal;
margin : 0;
padding : 0;
}
you can change the text in red to your wish to suit your Template.
Step 3 :
Whenever you create new posts just include the speical Script ( CSS code , Scripts , etc ) within this div section .
...Insert the Special code here...
Don't use id instead of class
that's it you have add this post Styling hack to your blogger template .
See you soon with a new hack . please tell your suggestions to this post. It will help me to improve the standard of this hack.
0 comments:
Post a Comment