HTML Parser Tool On Blogger

 Create HTML Parser Tool On Blogger

Blogger သမားများအတွက်အလွန်အသုံးဝင် သော Tool တခုဖြစ်သည်။အဘယ်ကြောင့်ဆိုသော်ဒီ Parser Tool သည် Code များစွာကို HTML Code အဖြစ်ခွဲခြမ်းစိတ်ဖြာပေးသောကိရိယာတခုဖြစ် သော ကြောင့်ပါ။အဓိကအားဖြင့် pre tag code box အသုံးပြု‌ သောသူများအတွက်မရှိမဖြစ်လိုအပ်‌ သော online tool တခုဖြစ်သည်။ထိုကြောင့် HTML Parser ကိုဖန်တီးရန် အောက်ပါပြုလုပ်နည်းများအတိုင်းပြုလုပ် ပေးဖို့လိုအပ်ပါတယ်။

1. မိမိ blog site ကို account အရင်ဝင်ပါ
2. dashboard ထဲက Pages ကိုနှိပ်
3. + အိုင်ကွန်ကိုနှိပ်
4. 🖍️ အိုင်ကွန်ကိုနှိပ်၍ < > HTML view ကိုရွေးချယ်၍နှိပ်ပါ
5. အောက်က code ကို copy ယူပြီးကူးထည့်ပေးပါ
6. save ကိုနှိပ်ပြီးပါပြီ

<textarea id="codes" placeholder="Write/copy your code here then select 'Parse'" spellcheck="false" style="height: 250px; margin: 0px; width: 100%;"></textarea>
<br />
<div class="button-group">
<button id="convert" onclick="cdConvertundefined);this.disabled = false;">Convert</button>
<button onclick="cdClearundefined);">Clear</button>
<button id="btncode">Copy</button>
</div>
<br />
<input checked="true" id="opt1" type="checkbox" /><code>&amp;</code> replaced with <code>&amp;amp;</code>
<br />
<input checked="true" id="opt2" type="checkbox" /><code>&lt;</code>replaced with <code>&amp;lt;</code>
<br />
<input checked="true" id="opt3" type="checkbox" /><code>&gt;</code> replaced with <code>&amp;gt;</code>
<br />
<input checked="true" id="opt4" type="checkbox" /><code>"</code>replaced with <code>&amp;quot;</code>
<br />
<input id="opt5" type="checkbox" /><code>'</code> replaced with <code>&amp;#039;</code>
<br />
<br />
<ul></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:100%;height:250px;margin:0 auto;display:block;background-color:#f3f3f3;color:#333;padding:15px;}
.button-group{margin-right:1px;}
button,button[disabled]:active{border: none;padding: 3px 15px;color: #fff;background-color: #cf0202;cursor: pointer;font-size: 17px;margin: 0 10px;line-height: 23px;border-radius: 3px;transition: all 0.3s ease-in-out;}
button:active{background:#cf0202;}
button[disabled],button[disabled]:active{background:#e9405c;}
#opt1,#opt2,#opt3,#opt4,#opt5{display:inline-block;margin-right:10px;}
</style> 
<script type="text/javascript">
function cdClearundefined) { var wtarea = document.getElementByIdundefined'codes'); wtarea.value = ''; wtarea.focusundefined); document.getElementByIdundefined'convert').disabled = false; } function cdConvertundefined) { var ctarea = document.getElementByIdundefined'codes'), cv = ctarea.value, opt1 = document.getElementByIdundefined'opt1'), opt2 = document.getElementByIdundefined'opt2'), opt3 = document.getElementByIdundefined'opt3'), opt4 = document.getElementByIdundefined'opt4'), opt5 = document.getElementByIdundefined'opt5'); cv = cv.replaceundefined/\t/g, " "); if undefinedopt1.checked) cv = cv.replaceundefined/&/g, "&amp;"); if undefinedopt2.checked) cv = cv.replaceundefined/</g, "&lt;"); if undefinedopt3.checked) cv = cv.replaceundefined/>/g, "&gt;"); if undefinedopt4.checked) cv = cv.replaceundefined/"/g, "&quot;"); if undefinedopt5.checked) cv = cv.replaceundefined/'/g, "&#039;"); ctarea.value = cv; ctarea.focusundefined); ctarea.selectundefined);  
};
let codes = document.getElementByIdundefined"codes");
let btncode = document.getElementByIdundefined"btncode");
      btncode.onclick = function undefined) {
        codes.selectundefined);
        document.execCommandundefined"copy");
        btncode.innerText = "Copied";
};
</script>
 

1. Write/paste code here... နေရာတွင်မိမိရဲ့ pre tag codebox တွင်ထည့်သွင်းအသုံးပြုမဲ့ code ကိုထည့်၍ Convert ကိုနှိပ်ပါ
2. ထိုသို့ Convert နှိပ်လိုက်လျှင် code များ ပြောင်းသွားပြီဆိုရင် Copy code နှိပ်၍ copy ယူပြီးမိမိရဲ့ pre tag codebox တွင်ထည့်သွင်းအသုံးပြုနိုင်သွားပါပြီ