Cara Membuat Tool Parse HTML Pada Halaman Statis

Cara Membuat Tool Parse HTML Pada Halaman Statis – Sobat semua pasti sudah tidak asing lagi dengan Parse HTML, ya parse HTML adalah sebuah tempat di mana kita dapat mengubah versi sebuah kode agar dapat di pasang pada Halaman teb HTML. Biasanya Tool Parse HTML ini tersedia pada sebuah website atau sebuah Aplikasi PC, namun kali ini saya akan memberikan tutorial bagaimana caranya agar Tool Parse HTML ini dapat terpasang di Halaman statis Blog sobat tanpa perlu sobat mengunjungi website penyedianya atau mengunduh aplikasinya. Luar biasa bukan?!. Baiklah langusng saja kita cari tahu cara membuatnya berikut ini.

Baca juga : Cara Agar Artikel Tidak Bisa di Copy-Paste Kecuali Pada Bagian Tertentu di Blog

1. Pertama Buka blog Sobat > Pergi ke menu post > buat Artikle Baru > Lalu letakkan kode di bawah ini pada halaman HTML atau Tab HTML post ( bukan Compose)

Untuk Memasukkan kode Adsense ke blog melalui <b>Edit HTML</b>, Anda tidak bisa langsung copy paste. Caranya salin Adsense Anda baik <b>Google Adsense</b> atau pun <b>Kode Javascript</b> yang lain, kemudian klik tombol <b>KONVERSI</b>. Setelah itu salin dan pastekan di blog Anda.<br />
<br />
<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, "&amp;");
    if (opt2.checked) cv = cv.replace(/'/g, "&#039;");
    if (opt3.checked) cv = cv.replace(/"/g, "&quot;");
    if (opt4.checked) cv = cv.replace(/</g, "&lt;");
    if (opt5.checked) cv = cv.replace(/>/g, "&gt;");
    ctarea.value = cv;
    ctarea.focus();
    ctarea.select();
};
</script><br />
<div style='clear: both;'></div>
<div class='clear'></div>
</div>

2. Terakhir Publikasikan Artikel dan Lihat hasilnya.

Baca juga : Cara Buat Blog Gratis Dari Awal Sampai Selesai

Sekarang sobat bisa menggunakan Parse HTML langsung pada Blog Sobat, sangat mudah bukan?!.

Demikianlah tutorial mengenai  Cara Membuat Tool Parse HTMLPada Halaman Statis, yang harus sobat ketahui. Semoga dapat memberikan ilmu yang bermanfaat dunia dan akhirat.