How to make a Convert Html Code on a Static Page Blogspot

How to make a Convert Html Code on a Static Page Blogspot - HTML Converter or HTML Parse is a tool that can be used to convert HTML code into unique code, there are times when we need the HTML code that we make converted first, for example when entering adsense ad code and for other purposes.

how to enter HTML Converter / HTML Parse into a Blog is as follows:

1. Create a new page, fill in the page title
2. Between Compose and HTML, select HTML and then paste the following code:

To enter the AdSense code into the blog via <kbd>Edit HTML</kbd>, You can't copy paste directly. The way to copy your Adsense is good <kbd>Google Adsense</kbd> or even <kbd>Kode Javascript</kbd> the other, then click the button <kbd>Conversion</kbd>. After that copy and paste on your blog.<br /><br />
<textarea id="codes" placeholder="Write / paste the code here then click 'Conversion'" spellcheck="false">
</textarea><br /><br /><div class="button-group"><button id="cvrt" onclick="cdConvert();this.disabled = true;" class="nqnia">Conversion</button><button onclick="cdClear();" class="nqnia">Clean up</button>
</div>
<ul id='wrapin'>
<li><input checked="true" class="option-input checkbox" id="opt1" type="checkbox" />Conversion <code>&</code> Becomes <code>&</code></li>
<li><input id="opt2" class="option-input checkbox" type="checkbox" />Conversion <code>'</code> Becomes <code>'</code></li>
<li><input id="opt3" class="option-input checkbox" type="checkbox" />Conversion <code>"</code> Becomes <code>"</code></li>
<li><input checked="true" class="option-input checkbox" id="opt4" type="checkbox" />Conversion <code><</code> Becomes <code><</code></li><li><input checked="true" class="option-input checkbox" id="opt5" type="checkbox" />Conversion <code>></code> Becomes <code>></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,"&")),d.checked&&(b=b.replace(/'/g,"'")),e.checked&&(b=b.replace(/"/g,""")),f.checked&&(b=b.replace(/</g,"<")),g.checked&&(b=b.replace(/>/g,">")),a.value=b,a.focus(),a.select()} </script>
<br />
<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>
<link href='//maxcdn.bootstrapcdn.com/font-awesome/4.5.0/css/font-awesome.min.css' rel='stylesheet'/>

3. Publish
4. finished

Live DEMO - Click Here