Cara Pasang Komentar Disqus Valid HTML5 Di Blogger

Cara Pasang Komentar Disqus Valid HTML5 Di Blogger

Bola Hero Gawai

Cara Pasang Komentar Disqus Valid HTML5 Di Blogger

Cara Pasang Komentar Disqus Valid HTML5 Di Blogger
Jika Anda searching di Google dengan keyword cara pasang komentar disqus di blogger, tentunya sudah banyak bertebaran tutorial-tutorialnya. Namun jika sekarang kita menggunakan tutorial-tutorial tersebut maka akan terdapat error validasi HTML5 karena mengandung css style di dalam widgetnya.

Untuk itu kini saya akan share cara pasang komentar Disqus valid HTML5 di Blogger. Sebenarnya ini juga adalah untuk memperbaiki pemasangan Disqus di Blogger dengan trik yang sebelumnya saya share dengan penundaan pemuatan komentar Disqus dengan menggunakan kode Disqus untuk website (bukan untuk Blogger)

Dengan trik tersebut memang loading blog menjadi lebih ringan, namun ternyata komentar-komentar yang sudah ada dan tampil di desktop ternyata tidak tampil di mobile kecuali komentar tersebut memang ditambahkan atau ditulis dengan perangkat mobile (tetapi trik ini berjalan di wordpress).

Ternyata memang agar komentar Disqus juga tampil di perangkat mobile maka untuk Blogger harus menggunakan script Disqus yang memang untuk Blogger. Namun seperti yang saya katakan tadi di atas, jika kita mengikuti langkah-langkah penambahan komentar Disqus seperti yang ada di Disqus dengan menambahkan widget di sidebar Blogger, maka kita akan mendapatkan error validasi HTML5 dan lumayan menyumbang loding blog karena penyimpanan javascript dan css di widget sidebar yang seharusnya dipasang di Edit HTML.

Jika Anda ingin mencoba trik saya ini, silahkan ikuti langkah-langkahnya di bawah ini.

Saya anggap Anda sudah membuat akun Disqus, jika belum silahkan buat di sini https://disqus.com/websites/

Setelah berhasil daftar dan login di Disqus, silahkan klik ikon gear (setting) di pojok kanan atas kemudian klik Add Disqus to Site dan silahkan isi datanya sesuai blog Anda. Setelah selesai akan muncul tampilan baru dan klik Universal Code kemudian copy kode seperti ini var disqus_shortname = 'blahblahblah'; yang kita perlukan adalah username Disqus-nya (blahblahblah

Kemudian silahkan masuk ke Blogger dan Edit HTML. Copy kode di bawah ini


             <script type='text/javascript'>
                var disqus_shortname = &quot;kompiajaib&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>

Ganti kode kompiajaib dengan username Disqus blog Anda yang tadi Anda copy sebelumnya (blahblahblah).

Kemudian silahkan paste kode di atas tepat di bawah kode berikut:


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

Setelah itu tambahkan kode css di bawah ini di atas kode ]]></b:skin> atau </style>


#comments {display:none;}
.post-comment-link { visibility: hidden; }

Kemudian masuk ke Dashboard Blogger lalu Setting. Pada bagian Comments rubah Who can comments? menjadi Anyone.

Selesai...silahkan simpan template Anda dan coba buka salah satu halaman postingannya.

Atau Anda bisa mencoba memasang komentar Disqus ini dengan alternatif lain pemasangan komentar Disqus DI SINI.

Share this:

Share this with short URL: Get Short URL loading short url

You Might Also Like:

Disqus
Blogger
Pilih Sistem Komentar Yang Disukai

0 Comment

Add Comment

Komentar dengan link promo akan masuk spam.

Gunakan konversi tool jika ingin menyertakan kode atau gambar.


image
How to style text in Disqus comments Top Disqus Commentators
  • To write a bold letter please use <strong></strong> or <b></b>.
  • To write a italic letter please use <em></em> or <i></i>.
  • To write a underline letter please use <u></u>.
  • To write a strikethrought letter please use <strike></strike>.
  • To write HTML code, please use <code></code> or <pre></pre> or <pre><code></code></pre>.
    And use parse tool below to easy get the style.
Show Parser Box

How to get ID DISQUS - http://disq.us/p/[ID DISQUS] - lihat di sini

strong em u strike
pre code pre code spoiler
embed

Like Kompi Ajaib? Keep us running by whitelisting Kompi Ajaib in your ad blocker.

This is how to whitelisting Kompi Ajaib in your ad blocker.

Thank you!

×
×
×