Thêm comments G+ song song với comments Blogger dạng toggle

LIVE DEMO

Hôm nay mình sẽ chia sẻ một thủ thuật hay dành cho Blogger, đó là thêm comments của Google+ hiển thị song song với comments Blogger dưới dạng ẩn/hiện (toggle). Sau đây là các bước thực hiện:

Bước 1: Tại trang quản trị blog, các bạn vào Mẫu > Chỉnh sửa HTML và tìm đoạn code sau:  

1<b:include data='post' name='post'/>

Bước 2: Chèn đoạn code sau vào bên dưới code vừa tìm được:

1<b:if cond='data:blog.pageType == &quot;item&quot;'>
<style>#comments, #gplus-comments-visibility {display:none;}  .comments-icons {background:  url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhbUExWCyDY3tzVwRG38uPqME4KjgzE1ZRHQu2H-4_v6yd1NYKjvVMQND_vpGECZee5OzYnWfLjLgt6sn92hL4oFDiAeC3XI7IbXJfxZgeGaJ5Sx0T0C1JnKNNf79bn0aR3a0uzESaQPLw/s1600/speech-bubble.png)  no-repeat; font-size: 20px; font-family: &quot;Arial  Narrow&quot;,Arial,sans-serif; color: #555; font-weight: bold;  padding: 18px 15px 0; height: 70px; } .comments-icons a img  {vertical-align: middle;}</style>
<div class='comments-icons'>
Show Comments: <a class='show-hide-comments'  href='javascript:void();'  onclick='$(&quot;#gplus-comments-visibility&quot;).slideToggle();$(&quot;#comments&quot;).hide();'><img  class='gplus-icon' height='35'  src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgl15rASbDSpnl5w88MollmlF0zI9Qbad0-KfKs20GsCbAduIUDYUmXisFD2O14Lw2C6BSnQTpPQh1IKsMhouLF66-T9DMoGY1RuWzTyjwJEu3ofAhNAjmZst0eh8baaHfjgYWIQ2WVUxM/s1600/google-plus-logo.png'  width='35'/></a> OR <a class='show-hide-comments'  href='javascript:void();'  onclick='$(&quot;#comments&quot;).slideToggle();$(&quot;#gplus-comments-visibility&quot;).hide();'><img  class='blogger-icon' height='35'  src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjYSWQC7YQVrl7hbg-PYJTfBdetmNef0ODqCzpDO49KqA7kaWKyuCdETgiUtSyvZZqlGBFq8tOmA1u7gQCpuyD0EQjfF8KIHW-VWeRQ3U0gM3YgTabo_b6iVtM675jPvBSIVSaVMxpEia4/s1600/blogger-logo.png'  width='35'/></a>
</div>
<div id='gplus-comments-visibility'>
<div class='g-comments' data-first_party_property='BLOGGER' data-view_type='FILTERED_POSTMOD' data-width='550' expr:data-href='data:post.url'/>
</div>       
</b:if>

Trong đó 550 là độ rộng phần comments G+.

Chúc các bạn thành công !