Saturday, August 22, 2015

Chèn nút Like và Share vào bài viết trong website

Bạn có một bài viết hay và muốn được mọi người chia sẻ bài viết đó lên Facebook hoặc chỉ đơn giản là ấn nút Like để động viên tinh thần. Có thể bạn đã tìm thấy vài bài hướng dẫn tích hợp bộ code chia sẻ mạng xã hội trong những bài viết khác. Tuy nhiên, thông thường những bộ code đó có chứa mã javascript từ các trang khác như là addthis.com, sharethis.com,... Cũng chẳng sao, nhưng một vài bạn không thích vì nó làm website của bạn chậm đi 1 chút.
Bài viết này mình sẽ chia sẻ bộ code mà mình đang dùng cho blog hiepb.com. Với 2 style khác nhau để các bạn chọn lựa. Hoặc thích thì dùng cả 2 cũng được.

Chèn nút like share Facebook dọc theo sidebar (sticky)

Chèn nút Like và Share vào bài viết trong website
Chèn nút Like và Share vào bài viết trong website
Với style này thì nút like share sẽ cố định dọc bên trái của website, ưu điểm là nó luôn nổi bật và thu hút được sự chú ý của khách truy cập
Bạn sử dụng code sau
<div style='padding:10px 8px; position: fixed; top: 50%; left: 50%; margin-top: -150px; margin-left: -520px;border-radius: 0;border: 0px solid #d9d9d9;'>
<div class="fb-like" data-href="" data-layout="box_count" data-action="like" data-show-faces="true" data-share="true"></div>
</div>

Chèn nút like share Facebook cuối bài viết trong website

Chèn nút Like và Share vào bài viết trong website
Chèn nút Like và Share vào bài viết trong website
Còn đối với style này thì có ưu điểm là đơn giản và nhẹ nhàng. Bạn có thể chèn nó ở bất cứ vị trí nào mà bạn muốn, tuy nhiên phù hợp nhất vẫn là phía dưới tiêu đề hoặc cuối bài viết
Bạn sử dụng code sau
<div class='fb-like' data-action='like' data-href='' data-layout='button_count' data-share='true' data-show-faces='false' data-width='520'/>
Kết luận: Chỉ với vài đoạn code đơn giản là bạn có thể tích hợp được nút like và share cho website của bạn rồi. Nếu thấy bài viết có ích thì hãy like và share để động viên mình nhé. Đừng để cái nút like nó vô dụng :v