Cara Menampilkan Kode HTML pada Postingan

file-HTML-iconSeperti yang sudah kita ketahui bahwa kode-kode HTML selalu tersembunyi dibalik sebuah halaman web, meski begitu karena fungsi dari tag-tag HTML itulah sebuah browser bisa membuka dan menampilkan halaman web dengan baik.

Biasanya tujuan Kode HTML ditampilkan dalam sebuah postingan untuk memberi contoh dari sebuah penjelasan, menshare sebuah link, script iklan atau widget untuk dicopy paste dan maksud-maksud lainnya. Untuk menampilkan kode html dalam postingan kita harus “melumpuhkan” atau menon-aktikan kode tersebut sehingga menjadi tidak berfungsi dan tampil di halaman web sebagai teks karakter biasa.

Cara yang umum digunakan untuk menampilkan kode HTML ialah dengan mengganti simbol-simbol dari HTML tersebut menjadi sebuah wujud karakter HTML, sehingga browser pun hanya akan mengenali tag-tag tersebut sebagai sebuah simbol karakter, bukan sebagai sebuah TAG HTML. Misalnya untuk menampilkan kurung sudut buka ( < ), kurung sudut tutup ( > ) dan kode-kode lainnya diubah penulisannya menjadi seperti ini :

< = &lt;
> = &gt;
/ = & #47;
] = & #93;
[ = & #91;
" = & #34;
' = & #39;
& = &amp;

Contoh: &lt;html&gt;konten&lt;/html&gt; menjadi

<html>konten</html>

Proses ini disebut encoding atau parsing Cara yang sama berlaku juga jika kita akan memasukan kode HTML ke dalam Teks area. Untuk memudahkan copy paste.

Cara yang baik dalam menampilkannya pada post adalah dengan memisahkannya dengan spasi, bahasa kerennya monospaced types tujuannya agar pembaca tahu bahwa yang ditampilkan adalah sebuah kode. Cara memisahkannya pun tak perlu satu persatu karena ada tag HTML yang berfungsi untuk itu yakni <code>KODE</code> menjadi KODE.

Untuk membuat kode terlihat seperti berada dalam kotak cukup tambahkan tag <pre>KODE DALAM KOTAK</pre> Contoh :

<b>textbold</b>

Kalau merasa tidak hapal dengan kode2 pengganti tersebut atau terlalu ribet jangan khawatir karena sudah banyak tersedia online encoder decoder HTML file,sebuah free tool yang bisa digunakan untuk mengkonversi wujud keberadaan HTML.silahkan masuk ke salah satu alamat berikut :

http://htmlentities.net
http://encode.ykub.xtgem.com

Pertama-tama masukan file HTMLnya lalu pilih encode untuk membuat proses pemecahan kode/symbol html menjadi teks biasa, Atau decode untuk proses pembalikan dari kode teks html biasa menjadi kode html kembali (vice versa). Copy hasilnya dan pastekan ke dalam postingan atau teks area.

Iklan

Tinggalkan Balasan

Isikan data di bawah atau klik salah satu ikon untuk log in:

Logo WordPress.com

You are commenting using your WordPress.com account. Logout / Ubah )

Gambar Twitter

You are commenting using your Twitter account. Logout / Ubah )

Foto Facebook

You are commenting using your Facebook account. Logout / Ubah )

Foto Google+

You are commenting using your Google+ account. Logout / Ubah )

Connecting to %s