Selamat datang agan
atau aganwati, kali ini saya akan berbagi tips blogging yaitu cara memasang
code parser dan pesan komentar untuk Disqus, sebelumnya anda harus memiliki dan
sudah memasang komentar Disqus di blog, jika belum mempunyai silakan terapkan komentar
Disqus dengan cara mengikuti artikel Cara Memasang Komentar Disqus Di Blog . Nah bagi yang sudah menerapkan komentar Disqus
di blog untuk memasang code parser dan pesan komentar untuk Disqus silakan
ikuti beberapa langkah berikut;
Langkah
1. Login pada blog anda
masing-masing,
2. Pada menu
dashboard pilih menu template,
3. Pilih
menu edit html,
4. Lalu cari
kode </b:skin> dengan cara
Ctrl
+F
,
5. Setelah
itu copy script di bawah ini,
.pesan-komentar{background:#efefef;padding:5px 10px 10px;width:auto;margin:15 auto 0;line-height:1.3em;position:relative;font-weight:400;border:1px solid #ddd;font-size:14px;color:#444}
.parser{background:#888;padding:3px 6px;margin:0;cursor:pointer;display:inline-block;float:left;text-align:center;color:#fff;}
#parser{padding:0;margin:10px 0 0;display:none}
#parser table,#parser2 table{margin:0 auto;width:100%}
#parser textarea#somewhere,#parser2 textarea#somewhere{background:#f8f8f8;border:1px solid #ccc;height:100px;width:100%;padding:5px;-moz-box-sizing:border-box;-webkit-box-sizing:border-box;box-sizing:border-box}
#parser textarea#somewhere:active,#parser textarea#somewhere:focus,#parser2 textarea#somewhere:active,#parser2 textarea#somewhere:focus{border:2px solid #e8554e;outline:0}
input.button-parse{padding: 5px;}
.pesan-komentar .strike{text-decoration: line-through;}
.pesan-komentar:before{content:"";width:0;height:0;position:absolute;bottom:-22px;left:14px;border:11px solid transparent;border-color:#ddd transparent transparent}
.pesan-komentar:after{content:"";width:0;height:0;position:absolute;bottom:-20px;left:15px;border:10px solid transparent;border-color:#efefef transparent transparent}
code{font-family:Consolas,Monaco,'Andale Mono',monospace;white-space:initial;word-spacing:normal;word-break:normal;hyphens:none;color:#000}
.clear{clear:both;}
6. Paste script tersebut tepat di
atas kode </b:skin> ,
7. Setelah
itu cari kode <body> dengan cara
Ctrl
+F
,
8. Lalu copy
script di bawah ini,
<script type='text/javascript'>
//<![CDATA[
$(document).ready(function(){$(".parser").click(function(){$("#parser").slideToggle("slow")})});
function convert(){var ele1 = document.getElementById("somewhere");var replaced;replaced = ele1.value;replaced = replaced.replace(/&/ig, "&");replaced = replaced.replace(/</ig, "<");replaced = replaced.replace(/>/ig, ">");replaced = replaced.replace(/"/ig, """);replaced = replaced.replace(/±/ig, "±");replaced = replaced.replace(/©/ig, "©");replaced = replaced.replace(/®/ig, "®");replaced = replaced.replace(/ya'll/ig, "ya'll");ele1.value = replaced;};
//]]>
</script>
9. Paste script tersebut tepat di
bawah kode <body> ,
10. Setelah
itu cari kode </article> dengan cara
Ctrl
+F
,
11. Copy
script di bawah ini,
<b:if cond='data:blog.pageType == "item"'>
<div class='pesan-komentar'>
<b>Cara style text di komentar Disqus:</b><br/>
<ul>
<li>Untuk menulis huruf <b>bold</b> silahkan gunakan <code>&lt;strong&gt;&lt;/strong&gt;</code> atau <code>&lt;b&gt;&lt;/b&gt;</code>.</li>
<li>Untuk menulis huruf <i>italic</i> silahkan gunakan <code>&lt;em&gt;&lt;/em&gt;</code> atau <code>&lt;i&gt;&lt;/i&gt;</code>.</li>
<li>Untuk menulis huruf <u>underline</u> silahkan gunakan <code>&lt;u&gt;&lt;/u&gt;</code>.</li>
<li>Untuk menulis huruf <span class='strike'>strikethrought</span> silahkan gunakan <code>&lt;strike&gt;&lt;/strike&gt;</code>.</li>
<li>Untuk menulis kode HTML silahkan gunakan <code>&lt;code&gt;&lt;/code&gt;</code> atau <code>&lt;pre&gt;&lt;/pre&gt;</code> atau <code>&lt;pre&gt;&lt;code&gt;&lt;/code&gt;&lt;/pre&gt;</code>, dan silahkan <b>parse</b> dulu kodenya pada kotak parser di bawah ini.</li>
</ul>
<div class='parser'><i class='fa fa-code'/></div>
<div class='clear'/>
<div id='parser'>
<table><tbody>
<tr> <td><textarea id='somewhere'/><br/>
<input class='button-parse' contenteditable='true' onclick='convert();' type='button' value='Parse Script'/></td> </tr>
</tbody></table>
</div>
</div>
</b:if>
12. Paste script tersebut tepat
diatas kode </article>,