Membuat Kode HTML Parser Box

Sempat saya bingung bagaimana cara menampilkan kode HTML pada sebuah postingan setelah saya keliling keliling dunia maya dengan bantuan mbah google akhir na saya menemukan sebuah gadget yang dapat memparse sebuah kode HTML agar dapat tampil disebuah postingan.

Sebenarnya gadget ini amat berguna untuk para blogger terutama kepada mereka-mereka yang sering membuat posting tentang blogger tips. Ada kalanya kita terpaksa buat post kode HTML untuk dicopy-paste oleh blogger.


Ini Kode Untuk Membuat HTML Parser Box
<script type="text/javascript">

function convert(){
var ele1 = document.getElementById("somewhere");
var replaced;
replaced = ele1.value;
replaced = replaced.replace(/&/ig, "&amp;");
replaced = replaced.replace(/</ig, "&lt;");
replaced = replaced.replace(/>/ig, "&gt;");
replaced = replaced.replace(/"/ig, "&quot;");
replaced = replaced.replace(/&#177;/ig, "&plusmn;");
replaced = replaced.replace(/&#169;/ig, "&copy;");
replaced = replaced.replace(/&#174;/ig, "&reg;");
replaced = replaced.replace(/ya'll/ig, "ya'll");
ele1.value = replaced;
}
</script>

<table border="0" cellpadding="0" cellspacing="0" style="width: 400px;"><tbody>
<tr> <td valign="top" width="400"><textarea cols="50" id="somewhere" rows="15" style="background: none repeat scroll 0% 0% rgb(248, 248, 248); border: 2px solid rgb(204, 204, 204);"></textarea>

<input onclick="convert();" type="button" value="Parse Script" /></td> </tr>
</tbody></table>



01 - Nama Parse Script boleh diubah mengikut kehendak masing-masing.
02 - Ukuran Box boleh diubah dengan menukar angka-angka di bahagian ini:
a) width: 400px
b) "top" width="400"
c) textarea cols="50"
03 - Cara Pengunaan: Copy-paste kode HTML yang hendak diparse kedalam kotak dan klik SEKALI sahaja.
04 - Cara Pemasangan: Pergi ke Blogger - Dashboard - Design - Add a Gadget – HTML/JavaScript - Save
05 - Contoh Parser Box lihat dibawah C/Box seri.


Kotak Kosong Untuk Menyimpan Kode HTML yang telah diparse agar kelihatan kemas sewaktu diposting. Copy-paste kodenya dibawah ini.

<div style="overflow:auto; width:100%px; height:290px; padding:0px;border:1px solid #000000;">Letakkan Kode Yang Telah Di Parse Di Ruangan Ini</div>

Posted in: HTML