code chia sẻ bài viết trong blogspot trên mobile cũng click được

Code code chia sẻ bài viết

Sau đây mình chia sẻ cách tạo nút share bài viết của blogspot lên các mạng xã hội mà trên moblie cũng có thể click được.

<a onclick='if(document.getElementById(&apos;spoiler&apos;) .style.display==&apos;none&apos;) {document.getElementById(&apos;spoiler&apos;) .style.display=&apos;&apos;}else{document.getElementById(&apos;spoiler&apos;) .style.display=&apos;none&apos;}' title='Chia sẻ' type='button'><i class='fa fa-share'/> Chia sẻ</a>
<div id='spoiler' style='display: none;padding-bottom:15px;padding-top:15px;'>

<a expr:href='data:post.sharePostUrl + &quot;&amp;target=facebook&quot;' expr:onclick='&quot;window.open(this.href, \&quot;_blank\&quot;, \&quot;height=430,width=640\&quot;); return false;&quot;' expr:title='data:top.shareToFacebookMsg' target='_blank'><i class='fa fa-facebook' style='color:#fff; display: block; float: left; font-size: 18px; height: 30px; line-height: 30px; text-align: center; width: 30px; background:#5a7abf;margin-right: 3px;'/></a>

<a expr:href='data:post.sharePostUrl + &quot;&amp;target=twitter&quot;' expr:onclick='&quot;window.open(this.href, \&quot;_blank\&quot;, \&quot;height=430,width=640\&quot;); return false;&quot;' expr:title='data:top.shareToTwitterMsg' target='_blank'><i class='fa fa-twitter' style='color:#fff; display: block; float: left; font-size: 18px; height: 30px; line-height: 30px; text-align: center; width: 30px; background:#19BFE5;margin-right: 3px;'/></a>

<a expr:href='data:post.sharePostUrl + &quot;&amp;target=googleplus&quot;' expr:onclick='&quot;window.open(this.href, \&quot;_blank\&quot;, \&quot;height=430,width=640\&quot;); return false;&quot;' target='_blank' title='Chia sẻ lên Google+'><i class='fa fa-google-plus' style='color:#fff; display: block; float: left; font-size: 18px; height: 30px; line-height: 30px; text-align: center; width: 30px; background:#D64136;margin-right: 3px;'/></a>

<a class='e' expr:href='data:post.sharePostUrl + &quot;&amp;target=email&quot;' expr:onclick='&quot;window.open(this.href, \&quot;_blank\&quot;, \&quot;height=430,width=640\&quot;); return false;&quot;' target='_blank' title='Gửi Email'><i class='fa fa-envelope' style='color:#fff; display: block; float: left; font-size: 18px; height: 30px; line-height: 30px; text-align: center; width: 30px; background:#23A215;margin-right: 3px;'/></a>
</div>

Demo 

Ưu điểm

Đầu tiên là trên mobile cũng click được. Rất ok !

Button này giống như youtube, thân thiện và dễ sử dụng.
Khi click chuột nó mới hiện
với lại nó không bị plugin quảng cáo chặn

Xem thêm:

Hướng dẫn tạo khung chứa code với nút Copy to Clipboard trong blogspot

Sửa lỗi Blogspot không hiển thị hình ảnh

HƯỚNG DẪN TẠO BLOGSPOT TỪ CĂN BẢN ĐẾN NÂNG CAO

Loạt bài tối ưu seo cho Blogspot

Chèn comment facebook vào blogspot

Cài google analytics cho blogspot

Chia sẻ