Cara Membuat Halaman Tool Parse HTML di Blogger Terbaru

Cara Membuat Halaman Tool Parse HTML di Blogger Terbaru


Parse HTML adalah merubah kode-kode tertentu menjadi kode entitas atau kode unik. Biasanya tool ini digunakan para blogger untuk mem-parse kode iklan adsense, karena jika tidak di parse akan menyebabkan eror, selain itu, tool ini juga biasa digunakan untuk mem-parse script.

Beberapa contoh kode sebelum dan setelah di parse.
  • & menjadi &
  • < menjadi &lt;
  • > menjadi &gt;
  • " menjadi &quot;
  • ' menjadi &#039;

Hayo... Kamu biasanya mencari tool parse kode apa harus mencari-cari di google terlebih dahulu? tapi tenang kamu bisa membuat tool parse HTML di halaman blog kamu tanpa harus mencari-cari di google lagi.

Cara membuat tool parse html ini juga terbilang mudah, langsung saja simak tutorialnya di bawah!

Cara Membuat Halaman Tool Parse HTML di Blogger

1. Buka dashboard blogger kamu.
2. Pilih menu Halaman > Halaman Baru.

3. Tempel kode di bawah, di (lihat gambar di atas). Pilih mode HTML bukan Compose.
<style scoped="" type="text/css">
code{font-family:Consolas,Monaco,'Andale Mono','Courier New',Courier,Monospace;color:#2a5ead;font-size:13px;padding:2px 4px;color:#d14;}
#codes{border:1px solid #ccc;width:68%;height:250px;margin:0 auto;display:block;background-color:#fafafa;color:#333;padding:15px;font:400 14px 'Courier New',Monospace;border-radius:4px}
.button-group{margin:0 auto 0;text-align:center}
button,button[disabled]:active{border:none;padding:5px 12px;text-align:center;color:#fff;display:inline-block;white-space:nowrap;background-color:#0ea6d8;cursor:pointer;font-family:'Open Sans',Arial,Sans-Serif; font-size:13px;position:relative;top:-1px;margin:0 10px;line-height:23px;border-radius:3px;transition:all 0.3s ease-in-out;}
button:active{background:#0095c6;}
button[disabled],button[disabled]:active{background:#0095c6;}
#opt1,#opt2,#opt3,#opt4,#opt5{display:inline-block;margin:0 10px 0 0;vertical-align:middle;border:none;outline:none}
#outer-wrapper {margin:0 auto;text-align:left;float:none;background-position:center!important;}
#post-wrapper {width:100%;max-width:100%;margin:0 auto;text-align:left;float:none;background-position:center!important;}
.post-body,.post{background-position:center!important;}
#blog1,#artikel,.blog-posts{background-position:center!important;}
#comments,#sidebar-wrapper,#menu-wrap {display:none;margin-top:0;margin:0;}
.post-inner {padding:0 0 0 0;margin:20px auto;}
.post-body ul#wrapin {display:block;position:relative;margin:30px auto 0 auto;}
.post-body ul#wrapin li {display:block;margin:0 auto;text-align:left;}
.post-body ul#wrapin br {display:none;}
</style><br />
<textarea id="codes" placeholder="Tulis/paste kode di sini lalu klik 'Konversi'" spellcheck="false"></textarea><br />
<br />
<div class="button-group">
<button id="cvrt" onclick="cdConvert();this.disabled = true;">Konversi</button><button onclick="cdClear();">Bersihkan</button></div>
<ul id="wrapin">
<li><br />
<input checked="true" id="opt1" type="checkbox" />Konversi <code>&amp;</code> menjadi <code>&amp;amp;</code><br />
</li>
<li><br />
<input id="opt2" type="checkbox" />Konversi <code>'</code> menjadi <code>&amp;#039;</code><br />
</li>
<li><br />
<input id="opt3" type="checkbox" />Konversi <code>"</code> menjadi <code>&amp;quot;</code><br />
</li>
<li><br />
<input checked="true" id="opt4" type="checkbox" />Konversi <code>&lt;</code> menjadi <code>&amp;lt;</code><br />
</li>
<li><br />
<input checked="true" id="opt5" type="checkbox" />Konversi <code>&gt;</code> menjadi <code>&amp;gt;</code><br />
</li>
</ul>
<script type="text/javascript">
function cdClear() {
    var wtarea = document.getElementById('codes');
    wtarea.value = '';
    wtarea.focus();
    document.getElementById('cvrt').disabled = false;
}
function cdConvert() {
    var ctarea = document.getElementById('codes'),
        cv = ctarea.value,
        opt1 = document.getElementById('opt1'),
        opt2 = document.getElementById('opt2'),
        opt3 = document.getElementById('opt3'),
        opt4 = document.getElementById('opt4'),
        opt5 = document.getElementById('opt5');
    cv = cv.replace(/\t/g, "    ");
    if (opt1.checked) cv = cv.replace(/&/g, "&");
    if (opt2.checked) cv = cv.replace(/'/g, "'");
    if (opt3.checked) cv = cv.replace(/"/g, """);
    if (opt4.checked) cv = cv.replace(/</g, "<");
    if (opt5.checked) cv = cv.replace(/>/g, ">");
    ctarea.value = cv;
    ctarea.focus();
    ctarea.select();
};
</script><br />
<div style="clear: both;">
</div>
<div class="clear">
</div>

4. Publikasikan halaman.

DEMO

Mudahkan cara membuat tool parsenya, jadi, mulai sekarang kamu sudah tidak perlu mencari tool parse di google, karena kamu sudah bisa membuatnya di blog kamu.

2 komentar

Peraturan Berkomentar
1. Jangan menggunakan kata-kata kotor dan kasar
2. Jangan menyertakan link dalam berkomentar
3. Jangan membahas keluar topik, jika keluar topik sebaiknya gunakan Contant Form yang disediakan
EmoticonEmoticon