Memposting kode HTML di blog

Dengan tujuan agar pembacaan post bisa lebih fokus, para blogger biasanya memposting kode HTML di dalam sebuah tabel. Tidak jarang atribut2 teks tertentu juga diberi warna. Untuk pewarnaan relatif tidak terlalu sulit karena blogger.com sudah menyediakan editor teks untuk itu.

Dalam posting ini akan dijelaskan bagaimana menyisipkan kode HTML atau CSS di dalam tabel. Langkahnya sebagai berikut :
1. Login ke Dashboard Blogger -> Rancangan -> Edit HTML
2. Untuk keamanan back up dulu template blog sobat
3. Pada edit HTML cari kode ]]></b:skin>
4. Letakkan kode CSS di bawah ini tepat di atasnya.
.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/AVvXsEiwcQAUPtSlKLkGZ8SBVeBrwTeHwNMxL6ERT8LEZfIJh9Wwikmz4NYXC6Izc0hGUEqTZgdfz6C1qvr8_clxxePG6Tt5zd9Upq5di0BR_QHgseizb7xQ8wefqQymN7JkTHCip1XdLLgMevw/s1600/codeicon.gif") no-repeat scroll bottom right #E0E0E0;
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;
}
5. Preview dulu, jika tidak ada masalah simpan template.
6. Selanjutnya jika sobat mau memposting kode html tambahkan kode yang saya bold merah di bawah dan tempatkan kode html sobat yang mau diposting pada kode berwarna biru ini :
<div class="codeview">
<!-- Simpan Kode HTML nya disini -->
</div>
7. Untuk merubah warna background kotak kode nya silahkan sobat ganti nilai yang saya bold warna hijau di atas.

Update: Jika sobat tidak mau ribet dengan cara di atas sobat bisa menggunakan tombol quote (tanda kutip) pada editor blogger.

8. Selamat mencoba dan salam blogger.

0 komentar :

Posting Komentar

Jika anda menyukai artikel di atas silahkan share atau tinggalkan komentar. Mohon maaf, untuk menghindari spam, komentar yang menyertakan live link akan dihapus.