Cara Mudah Membuat Parse HTML Tool di Laman Blog

Assalamu'alaikum Warahmatullahi Wabarakatuh.

Sekarang parse HTML tool bisa dibuat untuk website anda. Dengan cara - cara yang sangat mudah, saya akan membagikannya untuk anda.

Sebelum itu, saya akan memberi penjelasan tentang kelebihan memasang parse HTML di blog, berikut kelebihannya yang wajib anda baca!!!

Kelebihan Parse HTML Tool

1. Dapat meningkatkan pengunjung blog anda

2. Solusi untuk kode iklan yang tidak bisa dipasang di blog

3. Cara memasang dan menggunakan tool nya sangat mudah

Untuk cara memasang tool nya ada di bawah ini.

Cara Memasang Parse HTML Tool

1. Masuk ke Blogger dan buat laman baru

2. Letakkan kode di bawah ini pada Mode HTML bukan pada Compose.

<textarea id="codes" placeholder="Tulis/paste kode di sini lalu klik 'Konversi'" spellcheck="false"></textarea>  

<div class="button-group">

<button id="convert" onclick="cdConvert();this.disabled = true;">Konversi</button><button onclick="cdClear();">Bersihkan</button></div>

<ul id="wrapin">

<li><input checked="true" id="opt1" type="checkbox" />Konversi <code>&amp;</code> menjadi <code>&amp;amp;</code></li>

<li><input checked="true" id="opt2" type="checkbox" />Konversi <code>&lt;</code> menjadi <code>&amp;lt;</code></li>

<li><input checked="true" id="opt3" type="checkbox" />Konversi <code>&gt;</code> menjadi <code>&amp;gt;</code></li>

<li><input id="opt4" type="checkbox" />Konversi <code>"</code> menjadi <code>&amp;quot;</code></li>

<li><input id="opt5" type="checkbox" />Konversi <code>'</code> menjadi <code>&amp;#039;</code></li>

</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: 5px 12px;color: #fff;background-color: #0ea6d8;cursor: pointer;font-size: 13px;margin: 0 10px;line-height: 23px;border-radius: 3px;transition: all 0.3s ease-in-out;}

button:active{background:#3f92e1;}

button[disabled],button[disabled]:active{background:#3f92e1;}

#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. Publikasikan

Ingat !!! Jangan buka mode compose, dan jangan lupa memberikan Judul Postingan.

Maka hasilnya akan seperti ini.

Sekian tutorial yang bisa saya sampaikan, mudah - mudahan bermanfaat untuk anda, dan terima kasih sudah meluangkan waktu untuk membaca di sini.

Wassalamu'alaikum Warahmatullahi Wabarakatuh.