Cara Memasang Kolom Komentar Disqus Di Blogspot

Menyesuaikan bentuk kotak/kolom komentar di blog adalah salah satu optimasi untuk blog dalam kategori desain. Salah satu tools untuk media sosial yang cukup populer adalah disqus, dengan memasang kotak komentar di blog mempermudah orang/pengunjung blog untuk berkomentar di blog kita. Dengan disqus pengunjung blog dengan mudah dapat berkomentar menggunakan akun facebook, twitter, google maupun akun disqus mereka.

Pada kesempatan kali ini saya akan share cara memasang atau menambahkan kolom komentar disqus di blogspot (blogger.com). Pada artikel ini saya akan membagikan cara yang otomatis dan manual. Jika anda menggunakan cara otomatis, anda tidak perlu otak-atik html, namun dengan cara manual anda perlu menambahkan kode script disqus ke html template anda.

Sebelum anda memasang kolom komentar disqus di blog anda, anda harus mendaftar di situs disqus terlebih dahulu. Cara mendaftar akun diskus dapat anda baca pada artikel di bawah ini.

Baca juga: Cara Membuat/Mendaftar Akun Disqus.

Cara 1: Memasang kolom komentar Disqus secara otomatis

Jika anda sudah selesai membuat akun disqus, silahkan login ke akun disqus anda di situs resmi disqus http://www.disqus.com, masukkan username dan password lalu login. Setelah anda berhasil login, anda harus mendaftarkan situs anda terlebih dahulu di disqus agar bisa memasang kotak komentarnya nanti. Pada halaman utama disqus silahkan klik admin, lihat kolom merah pada gambar di bawah:

Kemudian pilih new untuk menambahkan situs baru, jika anda sudah menambahkan situs sebelumnya anda tidak perlu menambahkan situs baru.

Jika anda sudah selesai menambahkan situs, silahkan masuk ke menu setting pada disqus anda lalu masuk ke menu instalation, kemudian pilih blogger, lihat pada gambar di bawah:

Setelah itu klik add to my blogger site:

Lalu anda akan diarahkan ke situs blogger anda, silahkan tambahkan widget disqus pada blogger anda dan tempatkan dibawah posting atau dimana saja. lihat gambar di bawah:

Setelah anda menambahkan widget di atas silahkan lihat halaman artikel anda apakah sudah terdapat kolom komentar disqus atau tidak, jika kolom komentar belum muncul coba pindahkan widget disqus ke bawah post pada settingan tata letak di blogger.

Cara 2: Memasang kolom komentar Disqus secara manual

Cara kedua ini mengharusnya anda untuk mengutak-atik html template agar kolom/kotak komentar disqus dapat terpasang, namun sebelum memasang kolom komentar disqus secara manual pastikan anda sudah menyembunyikan template standart blogger anda agar tidak tejadi kesalahan saat menambahkan css untuk komentar disqus nantinya.

Silahkan copy kode di bawah ini dan ganti yang berwarna merah dengan id disqus situs anda:

<script type='text/javascript'>
                var disqus_shortname = &quot;erislabs&quot;;
                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;;
             (function() {
                        var bloggerjs = document.createElement(&quot;script&quot;);bloggerjs.type = &quot;text/javascript&quot;;
                        bloggerjs.async = true;
                        bloggerjs.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(bloggerjs);
                    })();
                (function() {
                    var bloggerjs = document.createElement(&quot;script&quot;);
                    bloggerjs.type = &quot;text/javascript&quot;;
                    bloggerjs.async = true;
                    bloggerjs.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(bloggerjs);
                })();
                </script>

Setelah itu login ke akun blogger anda, lalu masuk ke beranda blog dan buka halaman edit html, setelah itu copy kode di atas dan letakkan di tepat di bawah kode seperti berikut:

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

Setelah itu tambahkan kode css berikut tepat di atas ]]></b:skin> atau </style>  namun sebelumnya anda harus menghapus css #comments beserta embel-embelnya.

#comments {display:none;margin-right:10px 0 15px 0;}
.post-comment-link { visibility: hidden; }

Jika sudah selesai, silahkan save template anda dan lihatlah hasilnya. Itulah tutorial tentang "Cara Memasang Kolom Komentar Disqus Di Blogspot" kelebihan cara yang kedua dibandingkan dengan cara pertama adalah dengan cara kedua anda bisa mengatur margin untuk komentar disqus anda. Sekian artikel ini saya buat, silahkan berkomentar pada halaman ini jika ada pertanyaan, terima kasih.

Subscribe to receive free email updates: