Skip to main content

Cara Membuat Halaman HTML Parse di Blogger

BlogDola Cara Membuat Halaman HTML Parse di Blogger - Pada kesempatan kali ini saya akan bahas seputar blogging mengenai tutorial untuk membuat halaman parse html atau ads converter. Fiturnya adalah menkonversi simbol tertentu seperti &, <, >, ", dan '.


Cara Membuat Halaman HTML Parse di Blogger

Ketika kalian akan memasang script-script tertentu seperti kode iklan adsense kalian perlu memparse dulu kode tersebut agar nantinya bisa dipasang diblog. Biasanya jika tidak diparse terlebih dahulu akan muncul error dalam mode edit html template, tetapi untuk tata letak/layout nggak perlu diparse.
Langsung saja ini dia tutorialnya.

Langkah pertama buka dasbor blogger kamu lalu buat halaman baru, ganti ke mode HTML dan salin lalu pastekan kode dibawah ini didalamnya.



<textarea id="codes" placeholder="Tulis/paste kode di sini lalu klik 'Konversi'" spellcheck="false"></textarea></ br><div class="button-group"><button id="cvrt" onclick="cdConvert();this.disabled = true;" class="ripplelink">Konversi</button><button onclick="cdClear();" class="ripplelink">Bersihkan</button></div><ul id='wrapin'><li><input checked="true" class="option-input checkbox" id="opt1" type="checkbox" />Konversi <code>&amp;</code> menjadi <code>&amp;amp;</code></li><li><input id="opt2" class="option-input checkbox" type="checkbox" />Konversi <code>'</code> menjadi <code>&amp;#039;</code></li><li><input id="opt3" class="option-input checkbox" type="checkbox" />Konversi <code>"</code> menjadi <code>&amp;quot;</code></li><li><input checked="true" class="option-input checkbox" id="opt4" type="checkbox" />Konversi <code>&lt;</code> menjadi <code>&amp;lt;</code></li><li><input checked="true" class="option-input checkbox" id="opt5" type="checkbox" />Konversi <code>&gt;</code> menjadi <code>&amp;gt;</code></li></ul><script type="text/javascript">function cdClear(){var a=document.getElementById("codes");a.value="",a.focus(),document.getElementById("cvrt").disabled=!1}function cdConvert(){var a=document.getElementById("codes"),b=a.value,c=document.getElementById("opt1"),d=document.getElementById("opt2"),e=document.getElementById("opt3"),f=document.getElementById("opt4"),g=document.getElementById("opt5");b=b.replace(/\t/g," "),c.checked&&(b=b.replace(/&/g,"&amp;")),d.checked&&(b=b.replace(/'/g,"&#039;")),e.checked&&(b=b.replace(/"/g,"&quot;")),f.checked&&(b=b.replace(/</g,"&lt;")),g.checked&&(b=b.replace(/>/g,"&gt;")),a.value=b,a.focus(),a.select()}</script><div style='clear: both;'></div><style scoped="" type="text/css">#main-wrapper{padding:0;width:100%;border:0}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 rgba(0,0,0,0.08);width:68%;height:250px;margin:0 auto;display:block;background-color:#fff;color:#999;padding:15px;border-radius:3px;font-size:13px;font-family:monospace;transition:all .3s}#codes:hover,#codes:focus{background-color:#fff;color:#222;border-color:rgba(0,0,0,0.2)}.button-group{width:100%;max-width:78.5%;float:none;margin:0 auto 0;text-align:center}button,button[disabled]:active{width:42.3%;border:none;padding:14px 12px;text-align:center;color:#fff;display:inline-block;white-space:nowrap;background-color:#3498db;cursor:pointer;font-size:13px;position:relative;top:-20px;margin:0 8px;letter-spacing:.5px;border-radius:3px;transition:all 0.2s}button:hover,button:focus{background:#43a9ed;color:#fff}button[disabled],button[disabled]:active{background:#43a9ed;color:#fff;}#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;}.post-body p{margin:0}#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{width:100%;max-width:68.5%;display:table;position:relative;margin:0 auto;font-size:13px}.post-body ul#wrapin li {display:block;margin:0 auto;text-align:left;}.post-body ul#wrapin br {display:none;}.option-input{-webkit-appearance:none;-moz-appearance:none;-ms-appearance:none;-o-appearance:none;appearance:none;position:relative;right:0;bottom:0;left:0;height:16px;width:16px;transition:all 0.15s ease-out 0s;background:#f0f0f0;border:none;color:#fff;cursor:pointer;display:inline-block;margin-right:0.5rem;outline:none;position:relative;border-radius:10%;}.option-input:hover{background:#eee}.option-input:checked{background:#2ecc71}.option-input:checked::before{height:16px;width:16px;position:absolute;content:'\f00c';font-family:fontawesome;display:inline-block;font-size:12.66667px;text-align:center;line-height:16px}.option-input:checked::after{-webkit-animation:click-wave 0.65s;-moz-animation:click-wave 0.65s;animation:click-wave 0.65s;background:#40e0d0;content:'';display:block;position:relative;z-index:100}.option-input.radio{border-radius:50%}.option-input.radio::after{border-radius:50%}</style>

Langkah terakhir, Publish.

Hasilnya nanti akan persis seperti yang ada diblog ini HTML Parse

kian informasi yang saya berikan tentang Cara Membuat Halaman HTML Parse di Blogger semoga bermanfaat bagi pengunjung dan kita semua.