Bagi yang sudah melaksanakan tips cara Memuat Komentar Disqus dengan Onclick Event pada postingan yang kemudian dan tips tersebut tidak bekerja pada template blog sobat, Di sini aku akan menawarkan perbaikan atau pembaruan biar tips ini sanggup berfungsi dengan baik.
Untuk klarifikasi wacana cara kerja tombol Komentar Disqus dengan Onclick Event sanggup teman cek pada link ini. Nah, berikut langkah-langkahnya.
Buka Blogger > Klik hidangan Tema > Kemudian klik tombol Edit HTML dan tambahkan isyarat ini sempurna di bawah isyarat HTML <b:includable id='comments' var='post'>...</b:includable>
Setelah itu tambahkan isyarat ini di sempurna bawah isyarat <b:includable id='comments' var='post'>
Maka alhasil akan menjadi menyerupai ini
Selanjutnya tambahkan isyarat CSS ini sebelum </head>
Kemudian tambahkan isyarat di bawah ini sebelum </body> atau <!--</body>--></body> dan ganti isyarat yang ditandai arlinadesign dengan username disqus blog sobat.
Selesai dan lihat alhasil di blog sobat.
Bagi yang mengaktifkan sistem komentar Google+ di blognya, silakan nonaktifkan terlebih dahulu biar isyarat di atas sanggup bekerja dengan baik dan atur setelan komentar blog di Setelan > Postingan, komentar, dan berbagi > Komentar > Kemudian sesuaikan menjadi menyerupai gambar di bawah ini
Bonus
Bagi yang kemarin req cara menambahkan warna gradient menyerupai di hidangan atas blog ini silakan tambahkan CSS ini dan ganti .class-pilihan dengan class atau ID CSS blog teman sesuai keinginan. Intinya pada isyarat yang ditandai sanggup teman tambahkan di class atau ID apapun di dalam template.
Itulah Pembaruan Komentar Disqus dengan Onclick Event, semoga bermanfaat dan wassalam. Sumber http://arlinadesign.blogspot.com
Untuk klarifikasi wacana cara kerja tombol Komentar Disqus dengan Onclick Event sanggup teman cek pada link ini. Nah, berikut langkah-langkahnya.
Pembaruan Komentar Disqus dengan Onclick Event
Buka Blogger > Klik hidangan Tema > Kemudian klik tombol Edit HTML dan tambahkan isyarat ini sempurna di bawah isyarat HTML <b:includable id='comments' var='post'>...</b:includable>
<b:includable id='disqus-comment' var='post'> <script type='text/javascript'> var disqus_blogger_current_url = "<data:blog.canonicalUrl/>"; if (!disqus_blogger_current_url.length) { disqus_blogger_current_url = "<data:blog.url/>"; } var disqus_blogger_homepage_url = "<data:blog.homepageUrl/>"; var disqus_blogger_canonical_homepage_url = "<data:blog.canonicalHomepageUrl/>"; </script> </b:includable>Setelah itu tambahkan isyarat ini di sempurna bawah isyarat <b:includable id='comments' var='post'>
<div id='disqusshow' onclick='load_Comments()'><i class='fa fa-comments'/> Load comments</div> <div id='disqus_thread'/>Maka alhasil akan menjadi menyerupai ini
<b:includable id='comments' var='post'> <div id='disqusshow' onclick='load_Comments()'><i class='fa fa-comments'/> Load comments</div> <div id='disqus_thread'/>Selanjutnya tambahkan isyarat CSS ini sebelum </head>
<b:if cond='data:blog.pageType != "index"'> <style type='text/css'> /* Onclick Disqus Comment */ #comments{display:none} .post-comment-link{visibility:hidden} #disqus_thread{background:#fff;margin:10px 0 0 0;padding:0} #disqusshow{position:relative;overflow:hidden;display:block;text-align:left;font-weight:700;font-size:18px;cursor:pointer;letter-spacing:0;line-height:20px;margin:10px auto;padding:10px;background:#00b894;color:#fff;transition:all .3s} #disqusshow:hover,#disqusshow:active{color:#fff} </style> </b:if>Atur CSS sesuaikan dengan impian sobat
Kemudian tambahkan isyarat di bawah ini sebelum </body> atau <!--</body>--></body> dan ganti isyarat yang ditandai arlinadesign dengan username disqus blog sobat.
<b:if cond='data:blog.pageType != "index"'> <script type='text/javascript'> var disqus_shortname = "arlinadesign"; !function(){var e=document.createElement("script");e.type="text/javascript",e.async=!0,e.src="//"+disqus_shortname+".disqus.com/blogger_index.js",(document.getElementsByTagName("head")[0]||document.getElementsByTagName("body")[0]).appendChild(e)}(); </script> <script type='text/javascript'> !function(){var e=document.createElement("script");e.type="text/javascript",e.async=!0,e.src="//"+disqus_shortname+".disqus.com/blogger_item.js",(document.getElementsByTagName("head")[0]||document.getElementsByTagName("body")[0]).appendChild(e)}(); //<![CDATA[ function load_Comments(){var e=document.getElementById("disqusshow");e.style.display="none";var t="arlinadesign";!function(){var e=document.createElement("script");e.type="text/javascript",e.async=!0,e.src="https://"+t+".disqus.com/embed.js",(document.getElementsByTagName("head")[0]||document.getElementsByTagName("body")[0]).appendChild(e)}()} //]]> </script> </b:if>Selesai dan lihat alhasil di blog sobat.
Tambahan
Bagi yang mengaktifkan sistem komentar Google+ di blognya, silakan nonaktifkan terlebih dahulu biar isyarat di atas sanggup bekerja dengan baik dan atur setelan komentar blog di Setelan > Postingan, komentar, dan berbagi > Komentar > Kemudian sesuaikan menjadi menyerupai gambar di bawah ini
Bonus
Bagi yang kemarin req cara menambahkan warna gradient menyerupai di hidangan atas blog ini silakan tambahkan CSS ini dan ganti .class-pilihan dengan class atau ID CSS blog teman sesuai keinginan. Intinya pada isyarat yang ditandai sanggup teman tambahkan di class atau ID apapun di dalam template.
@keyframes Gradient{0%{background-position:0 50%}50%{background-position:100% 50%}100%{background-position:0 50%}} .class-pilihan{background:#f24a4a;background:linear-gradient(-50deg,#ee5952,#ea3a7e,#20aadb,#23e0b3);background-size:320% 200%;animation:Gradient 15s ease infinite}Itulah Pembaruan Komentar Disqus dengan Onclick Event, semoga bermanfaat dan wassalam. Sumber http://arlinadesign.blogspot.com
Pembaruan Komentar Disqus Dengan Onclick Event
4/
5
Oleh
Admin
