Cara Menciptakan Tools Parse Html Responsif Di Blogger

Cara Membuat Tools Parse HTML Responsif di Blogger - Alat parse HTML memang cukup penting bagi kalangan blogger (orang yang suka ngeblog). Tak jarang juga ada yang memasang alat parse HTML ini di dalam blognya terutama bagi yang mempunyai blog niche blogging atau pun koding. Karena memang parse HTML online ini berafiliasi dengan itu. Untuk membuat tools parse HTML online ini membutuhkan script parse yang harus di pasang di halaman statis. 

Jarang sekali ada yang memasang tools parse pada konten blog selain yang diterangkan di atas. Mungkin akan terlihat mubazir kan kalau di pasang di blog dengan niche berita, kesehatan, pendidikan, atau bahkan agama. Pengunjung tidak akan terfokus kepada itu alasannya yakni memang tujuan berkunjung ke blog berbeda.

Memang beberapa blogger memasang tools di dalam blognya ibarat HTML converter, Color Palette, CSS Minifer, dan masih banyak lagi.

Lalu bagaimana cara menciptakan dan memasang alat parse html online ini di blog? Berikut artikel ini akan menjelaskan tutorial perihal itu.

Apa bergotong-royong PARSE HTML itu?

Parse HTML yakni alat untuk menguraikan atau mengkonversi isyarat HTML menjadi abjad entitas HTML secara otomatis supaya terbaca dalam format XML. Kenapa harus di parse? Karena tema blogger ini memakai format XML. Sebenarnya dikala Kita mencoba memparse script HTML, tidak serta merta semua isyarat berubah (dikonversi). Hanya beberapa isyarat saja yang berubah, kalau Kamu menuliskan kata atau kalimat yang dibungkus isyarat html tersebut maka kata tersebut tidak berubah.

Berikut beberapa referensi isyarat HTML yang berubah kalau dikonversi memakai script HTML converter/parse.

• tanda < menjadi &lt;
• tanda > menjadi &gt;
• tanda " menjadi &quot;
• tanda ' menjadi &#039;
• tanda & menjadi &amp;

Biasanya orang memakai alat parse html ini untuk mengkonversi script html supaya tidak terjadi eror dikala di pasang di blog. Selain itu, untuk memasang script iklan google adsense, Kita juga harus memparse isyarat adsense terlebih dahulu supaya tidak terjadi eror dan iklan sanggup tayang kecuali kalau memasangnya di widget blog maka tidak perlu diparse terlebih dahulu.

Baca juga: /search?q=cara-memasang-material-design-colorCara Membuat Tombol Spoiler di Artikel.

Nah, berikut langkah-langkah memasang script untuk tools parse HTML yang responsive di blogger.

Cara Membuat Alat Parse HTML Online di Blog

1. Buka dashbor blogger mu terlebih dahulu.

2. Pilih sajian "Halaman" atau "Pages".

3. Buat Halaman gres dengan mengklik tombol "New Page" di bagia atas.

4. Terdapat dua pilihan mode yaitu Compose dan HTML, kalau ingin menuliskan paragraf pembuka silahkan pilih mode Compose terlebih dahulu, sesudah itu pilih mode HTML untuk menaruh kode.

5. Copy kemudian paste kan Script Kotak Parse HTML di bawah ini

<textarea id="codes" placeholder="Salin script di sini kemudian klik 'Kuy Parse'. Untuk parse script baru, klik 'Bersihin dulu'" spellcheck="false"></textarea>  <br /> <div class="button-group"> <center> <span class="Apple-style-span" style="font-family: &quot;trebuchet ms&quot;; font-size: x-small; line-height: 20px;">Alat Parse HTML &nbsp;oleh &nbsp;<a href="http://www.rekblogging.com/" style="color: #2980b9; text-decoration: none;">rekblogging.com</a></span></center> <button id="convert" onclick="cdConvert();this.disabled = true;">Kuy Parse</button><button onclick="cdClear();">Bersihin dulu</button></div> <br /> <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 #CCCCCC;width:550px;height:250px;margin:0 auto;display:block;background-color:#f2f2f2;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>

6. Save kemudian lihat preview, kalau sudah benar klik publish.

Catatan:
Kamu sanggup memodifikasi tampilannya sesuai dengan tema blog Kamu, contohnya ukuran kotak untuk memparse scriptnya sanggup diperbesar atau diperkecil.

Berikut ini tampilan screenshot alat parsenya.

Demikian tutorial untuk menciptakan tools online HTML converter di blog yang responsive. Paling tidak ini menjadi referensi bagi Kamu yang ingin memasang alat parse HTML di blog. Ada berbagai di internet yang menawarkan script kotak parse dengan tampilan yang berbeda.

Bagi yang belum terang mengenai tutorial di atas sanggup disampaikan di kolom komentar. Mohon maaf apabila dalam menuliskan artikel ini banyak kesalahana atau menciptakan Kamu bosan. Jangan segan-segan untuk memberikan kritik dan saran supaya rekblogging semakin berkualitas.


picture by rekblogging