Apr 10, 2017

Cara Memasang Komentar Disqus Di Blogger Valid HTML5

Komentar Disqus

Seperti yang sudah kita ketahui bersama memasang komentar di blogger ada banyak cara dan metode agar dapat memudahkan pengunjung berinteraksi dengan pemilik blog. Salah satu platform komentar yang sekarang ini banyak di gunakan adalah penggunaan komentar Disqus pada blog.

Postingan kali ini akan membahas Alternatif lain memasang komentar Disqus blogger tanpa harus mengintal widget dari Disqus, biasanya jika mengikuti petunjuk pemasangan melalui Disqus adalah meletakkannya pada sidebar, lalu bagaimana jika kita ingin memasangnya pada body atau di bawah postingan, di postingan kali ini akan dibahas Cara Memasang Komentar Disqus Di Blogger Valid HTML5 dan ini adalah lanjutan dari postingan sebelumnya.


Buat sobat yang mau mencoba Alternatif Lain Memasang Komentar Disqus Di Blogger silahkan simak berikut ini.

Langkah Pertama
Silahkan sobat salin kode dibawah ini

            <b:includable id='disqus-comment' var='post'>
            <script type='text/javascript'>
                var disqus_blogger_current_url = &quot;<data:blog.canonicalUrl/>&quot;;
                if (!disqus_blogger_current_url.length) {
                    disqus_blogger_current_url = &quot;<data:blog.url/>&quot;;
                }
                var disqus_blogger_homepage_url = &quot;<data:blog.homepageUrl/>&quot;;
                var disqus_blogger_canonical_homepage_url = &quot;<data:blog.canonicalHomepageUrl/>&quot;;
            </script>
            </b:includable>

Kemudian kode diatas letakkan di antara kode berikut

            <b:includable id='comments' var='post'>
            ..............
            ..............
            </b:includable>

Jadi nantinya seperti ini penampakannya

            <b:includable id='comments' var='post'>
            ..............
            ..............
            </b:includable>
            <b:includable id='disqus-comment' var='post'>
            <script type='text/javascript'>
                var disqus_blogger_current_url = &quot;<data:blog.canonicalUrl/>&quot;;
                if (!disqus_blogger_current_url.length) {
                    disqus_blogger_current_url = &quot;<data:blog.url/>&quot;;
                }
                var disqus_blogger_homepage_url = &quot;<data:blog.homepageUrl/>&quot;;
                var disqus_blogger_canonical_homepage_url = &quot;<data:blog.canonicalHomepageUrl/>&quot;;
            </script>
            </b:includable>


Langkah Ke Dua
Silahkan Sobat salin kode dibawah ini dan simpan diatas kode </body>

<script type='text/javascript'>
var disqus_shortname = &quot;dibalikseo&quot;;
!function(){var e=document.createElement(&quot;script&quot;);e.type=&quot;text/javascript&quot;,e.async=!0,e.src=&quot;//&quot;+disqus_shortname+&quot;.disqus.com/blogger_index.js&quot;,(document.getElementsByTagName(&quot;head&quot;)[0]||document.getElementsByTagName(&quot;body&quot;)[0]).appendChild(e)}();
</script>
<b:if cond='data:blog.pageType == &quot;item&quot;'>
<script type='text/javascript'>
!function(){var e=document.createElement(&quot;script&quot;);e.type=&quot;text/javascript&quot;,e.async=!0,e.src=&quot;//&quot;+disqus_shortname+&quot;.disqus.com/blogger_item.js&quot;,(document.getElementsByTagName(&quot;head&quot;)[0]||document.getElementsByTagName(&quot;body&quot;)[0]).appendChild(e)}();
</script>
</b:if>

Perhatikan kode yang ditandai dibalikseo silahkan sobat ganti dengan user Disqus blog sobat, jika ingin tidak mau menampilkan komentar blog sobat dapat lakukan dengan cara menambahkan kode display:none di kode CSS #comments jika kurang paham tampilannya seperti dibawah ini

#comments{....................;display:none}


Langkah Ke Tiga
Untuk nantinya menampikan dan menyimpan komentar Disqus di halaman postingan blog cari kode dibawah ini

            <b:includable id='comments' var='post'>
             <div class='comments' id='comments'>

Setelah ketemu silahkan sobat salin kode dibawah ini dan letakkan tepat dibawah kode yang tadi dicari


<b:include data='post' name='disqus-comment'/>

Yang nantinya akan jadi seperti penampakan ini

            <b:includable id='comments' var='post'>
             <div class='comments' id='comments'>
<b:include data='post' name='disqus-comment'/>
................
................
</b:includable>

Dengan sobat menggunakan cara diatas sobat tidak usah lagi memasang count.js yang dari Disqus, dan info tambahan jika sobat mau menampilkan berapa banyak jumlah komentar disqus yang akan ditampilkan di halaman depan silahkan tambahkan kode berikut ini 

<a expr:href='data:post.url + &quot;#disqus_thread&quot;' title='Comments Count'/>

Selesai silahkan di save, selamat mencoba.

Artikel Terkait

Halo Sobat, sedikit cerita mengenai diri saya, saya adalah hanya seorang penulis amatiran yang mencoba berbagi pengetahuan dari apa yang saya dapat sehari-hari. Pengalaman ini saya tuangkan di tulisan dengan tujuan baik agar pengetahuan dan pengalaman saya ini dapat bisa di pergunakan dan bermanfaat khususnya untuk diri saya pribadi dan umumnya untuk orang lain, sehingga saya beri nama Web saya ini dibalikseo.com yang filosofinya adalah dibalik pengetahuan yang saya dapat.