Panduan Membuat Kode HTML Parser Box

Semalam bingung seri fikirkan macamana nak tampilkan kode HTML dalam bentuk posting. Banyak cara sudah seri cuba tetap juga tak berjaya.

Jadi terpaksalah seri selongkar internet, dan terjumpa gadget ini yang boleh memparse kode HTML agar dapat tampil di posting.

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>

01 - Height boleh diubah mengikut kesesuaian.
02 - Border kalau nak besarkan boleh guna angka tinggi, contoh 2 atau 3. Kalau hendak hilangkan border guna angka 0.
03 - 000000, ini warna border, boleh juga ditukar mengikut kesesuaian latar blog.


Kalau ada apa-apa cadangan untuk memperbaiki artikel ini amat seri alu-alukan. Mohon tinggal pesan/cadangan di kotak komen.

Share :

Facebook Twitter Google+