Skip to main content

Cara Membuat Tool Parse HTML (HTML Converter) di Blogger

Cara Membuat Parse HTML (HTML Converter) di Blogger - Kali ini saya akan membagikan cara memasang alat parse html (konversi kode atau Ads Converter) sendiri di halaman blog anda.

Parse HTML adalah alat yang digunakan untuk menguraikan atau mengkonversi kode pemrograman, seperti CSS, HML dan JavaSribd agar kode tersebut dapat dengan mudah terbaca oleh blog kita. Yang menjadi pertanyaan adalah, kenapa kita harus menggunakan parse html?. Sebagai contoh jika kita ingin menempatkan kode AdSense di HTML blog kita, kita harus mengkonversiya terlebih dahulu untuk menghindari terjadinya error pada struktur blog kita.

Parse HTML ini juga banyak digunakan oleh para khususnya yang membagikan kode-kode dipostingan blognya seperti CSS, HTML dan JavaSribd, pastinya menggunakan parse html terlebih sebelum menempatkannya di dalam postingannya.

Saya sendiripun sering menggunakan parse html ini, bahkan saya menempatkannya sendiri di halaman statis blog saya, karena daripada kita numpang konversi di website orang lain, mendingan saya membuatnya sendiri di halaman blog saya.

Cara Memasang Tool Parse HTML di Halaman Statis Blogger

1. Masuk ke Blogger > pilih menu Halaman > pilih Buat Halaman Baru

2. Kemudian Masuk ke mode HTML (Bukan Compose) > selanjutnya letakkan kode ini dalamnya

Jika anda ingin memasukkan Kode SCC, HTML, JavaCript atau kode lainnya di dalam postingan HTML anda, salin kode anda dan letakkan di dalam kotak ini kemudian pilih <b>Konversi</b>. Setelah itu salin kedalam postingan blog anda.

<textarea id="codes" placeholder="Tulis/salin kode anda di sini kemudian pilih 'Konversi'" spellcheck="false" style="height: 158px; margin: 0px; width: 951px;"></textarea>
<div class="button-group">
<button id="convert" onclick="cdConvert();this.disabled = true;">Konversi</button><button onclick="cdClear();">Bersihkan</button></div>

<input checked="true" id="opt1" type="checkbox" />Konversi <code>&amp;</code> menjadi <code>&amp;amp;</code>
<input checked="true" id="opt2" type="checkbox" />Konversi <code>&lt;</code> menjadi <code>&amp;lt;</code>
<input checked="true" id="opt3" type="checkbox" />Konversi <code>&gt;</code> menjadi <code>&amp;gt;</code>
<input id="opt4" type="checkbox" />Konversi <code>"</code> menjadi <code>&amp;quot;</code>
<input id="opt5" type="checkbox" />Konversi <code>'</code> menjadi <code>&amp;#039;</code>
<ul></ul>
<style 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{font:13px 'Courier New',Monospace;border:1px solid #e9e9e9;width:550px;height:250px;margin:0 auto;display:block;background-color:#f3f3f3;color:#333;padding:15px;}
.button-group{margin:0 auto 0;text-align:center}
button,button[disabled]:active{border: none;padding: 9px 72px;color: #fff;background-color: #2fc8b4;cursor: pointer;font-size: 17px;margin: 0 10px;line-height: 23px;border-radius: 3px;transition: all 0.3s ease-in-out;}
button:active{background:#2fc8b4;}
button[disabled],button[disabled]:active{background:#e9405c;}
#opt1,#opt2,#opt3,#opt4,#opt5{display:inline-block;margin-right:10px;}
</style>  <script type="text/javascript">
function cdClear() {
    var wtarea = document.getElementById('codes');
    wtarea.value = '';
    wtarea.focus();
    document.getElementById('convert').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, "&lt;");
    if (opt3.checked) cv = cv.replace(/>/g, "&gt;");
    if (opt4.checked) cv = cv.replace(/"/g, "&quot;");
    if (opt5.checked) cv = cv.replace(/'/g, "&#039;");
    ctarea.value = cv;
    ctarea.focus();
    ctarea.select();
};
</script>

3. Jangan lupa Isi Judul halaman anda > kemudian pilih Publikasikan

Demikian tutorial Cara Membuat Parse HTML (Ads HTML), mohon maaf sebelumnya apabila penulisan artikel ini banyak terdapat kesalahan. Jika ada hal yang ingin ditanyakan bisa langsung menuju kolom komentar, Terimakasih.

Comment Policy: Silahkan tuliskan komentar Anda yang sesuai dengan topik postingan halaman ini. Komentar yang berisi tautan tidak akan ditampilkan sebelum disetujui.
Buka Komentar
Tutup Komentar