Cara Menampilkan Kode Script pada Posting

Posted by : Arief Hilman Nugraha Monday, January 14, 2013

Jika sobat mempunyai blog yang bertemakan tutorial blog, atau blog trik maka yang pasti anda sering menggunakan kode script HTML, CSS, dll. Ada cara yang mudah untuk menayangkan kode tersebut pada blog agar mudah dilihat namun tetap terlihat cantik dan stylis. Jika sobat ingin tau cara kerjanya maka ikuti langkah berikut ini:

1. Masuk ke Rancangan --> Edit HTML
2. Carilah kode ]]></b:skin>
3. Paste kode dibawah ini diatas kode tadi:

.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/AVvXsEgegOpEgQjyvBzTbvu26lj0p8uZVkJc5ib2gur5v0W_Y-ZNY7G9YFvNoul1UVJjtgVpUZ5vgESiG4vIB6EUvyUBPK7SCMedIrIQPk04CEAtQMrnrggVjTulfmAH16lKvUZKy6iTYdzK1VSq/') 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;
}

Keterangan: Anda dapat mengganti kode berwarna biru dengan url gambar yang anda inginkan

4. Simpan template anda

Untuk cara kerjanya, jika sobat menulis Script Kode pada posting maka masuk ke tab Edit HTML, lalu sisipan kode yang ingin ditayangkan (kode warna merah) pada div class seperti dibawah ini: