Menampilkan kode HTML pada postingan blog

Anda tengah kesulitan menampilkan kode-kode HTML pada blog yang menyajikan tutorial HTML? Ini dia cara membuatnya tampil sebagaimana Anda inginkan pada postingan blog tutorial Anda.

Langkah pertama

Meluncurlah ke Dashboard > Design > Edit HTML. Carilah tag kode ]]></b:skin>, dan tambahkan kode di bawah ini di atas tag kode tersebut

          pre { background:#efefef; 

          border:1px solid #A6B0BF; 

          font-size:120%; 

          line-height:100%; 

          overflow:auto; 

          padding:10px; 

          color:#000000 } 

          pre:hover { 

          border:1px solid #efefef; } 

          code { 

          font-size:120%; 

          text-align:left; 

          margin:0;padding:0; 

          color: #000000;} 

         .clear { clear:both; overflow:hidden; }

Cobalah preview untuk memastikan kode-kode telah sesuai, kemudian Save.

Langkah kedua

 

Saatnya beraksi! 

Sekarang untuk membuat postingan yang di dalamnya terdapat kode HTML untuk ditampilkan, Anda perlu mengubah kode tersebut terlebih dahulu ke dalam karakter yang dapat dilewatkan (escapable characters). Untuk itu pakailah perangkat pada situs yang diberi nama Quick Escape. Masukkan kode yang Anda ingin tampilkan apa adanya ke dalam kolom yang tersedia. Selanjutnya klik "Convert to escaped character" untuk mendapatkan kodenya.

Selamat mencoba!

Sumber: blogkori.com