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

How to make a Convert Html Code on a Static Page Blogspot
A way to make a Convert Html Code on a Static page Blogspot - HTML Converter or HTML Parse is a tool that may be used to convert HTML code into particular code, there are times whilst we want the HTML code that we make transformed first, as an example when entering adsense advert code and for other purposes.

The way to enter HTML Converter / HTML Parse into a blog is as follows:

1. Create a new web page, fill in the page name
2. Among Compose and HTML, pick 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

Demo