Cara Memodifikasi Tampilan Kode Agar Bergaya Tanpa Javascript

Membuat kode postingan anda bergaya tanpa javascript. Ini adalah trik sederhana membuat kode pada postingan anda sedikit berbeda, tanpa menggunakan javascript, layaknya sintax highlighter, yaitu hanya dengan menggunakan kode CSS.

Jika anda tertarik membuat tampilan berbeda seperti contoh diatas, demikian caranya:

1. Masuk ke edit HTML
2. masukkan kode berikut di script CSS anda diatas kode berikut ]]></b:skin> :

/*code*/
.code {
display:block;
font-family:Courier New;
font-size:9pt;
width:360px;/*ubah angka merah tersebut dengan lebar tampilan kode yang anda inginkan*/
overflow:auto;
repeat-y;
max-height:200px;
margin:5px 10px;
padding: 2px 15px 2px 25px;
background:url(http://i583.photobucket.com/albums/ss279/negativa/code.png) no-repeat left top; }
background image diatas dapat anda rubah sesuai selera anda. 

3. Klik save template
4. Masuk ke postingan anda dan masukan kode berikut ditiap anda memposting kode:

<span class="code">
....ini tempat kode yang anda ingin posting
</span> 

5. Selesai.