How to Display Your Scripts and Codes in Blogger Posts

How to display the Scripts and Codes in blogger post To show codes in blogger post in special section.
Suppose we want to show a simple code like bellow
< h1> Related posts </h1>
but it is HTML Code so it will display like bellow.

Related postsTo avoid this we show codes in special Section amd make it friendly to post
Just follow these steps

1. Login to Blogger dashboard
2. Go to Design Section
3. Then select Edit HTML tab
4. Find ]]></b:skin> tag
5. Paste it above Code of section

   .codeview {
   margin : 15px 15px 15px 35px;
   padding : 10px;
   clear : both;
   font-family : "Courier New", "MS Sans Serif", sans-serif, serif;
   line-height:1.6;
   background: url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEih-YcVqpgr8FOR62hee0Q8r-WF2Wgg3T0WWMoKngvMws0r2AR3DZK-Y0nNy7NlmnKkPN-wlJekmTNNw7m-54R0xo6Iu1UNBjbYeDbCXvetEUURGRaavoUkW8Lq_ccmok1UVYcqnwHHAMH7/') no-repeat scroll bottom right #EFFBF5; 
   border-top : 1px solid #eeeeee;
   border-right : 2px solid #cccccc;
   border-bottom : 2px solid #cccccc;
   border-left : 1px solid #eeeeee;
   }
   .codeview li {
   line-height : 24px;
   color : #333333;
   margin : 0;
   padding : 0;
   }
   ]]>

6. Now save your template.

While creating any Post, If you want to show the special Code in post that CSS code or JavaScript code, what ever may be , Go to Edit HTML tab in Post and create Div section and put your code in Div section like bellow and publish Your Post.

<div class="codeview">

<!-- Put Your Special code here -->

</div>

Note:- Before Putting code, Make it Friendly to post Using these tools

a sample preview

.codeview {
margin : 15px 15px 15px 35px;
padding : 10px;
clear : both;
font-size:normal;
list-style-type : none;
font-family : “Courier New”, “MS Sans Serif”, sans-serif, serif;
background: url(‘https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEih-YcVqpgr8FOR62hee0Q8r-WF2Wgg3T0WWMoKngvMws0r2AR3DZK-Y0nNy7NlmnKkPN-wlJekmTNNw7m-54R0xo6Iu1UNBjbYeDbCXvetEUURGRaavoUkW8Lq_ccmok1UVYcqnwHHAMH7/’) no-repeat scroll bottom right #EFFBF5;
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;
color : #333333;
font-weight : normal;
margin : 0;
padding : 0;
}