Tạo widget Facebook Like Box sau mỗi bài viết cho Blogge

Facebook hiện đang là mạng xã hội phổ biến nhất hành tinh với hàng tỷ lượt truy cập hàng. Việc chén nút "Thích" vào các website hiện nay khá phổ biến trên các website, nó đang là một công cụ

SEO

khá hiệu quả. Tuy nhiên chèn vào là một chuyện, còn làm thế nào để làm nổi bật nút "Thích" lại là một chuyện khác.

Vậy làm thế nào để làm nổi bật nút "Thích"?

Cách thực hiện

1

Vào

Chủ đề >> Chỉnh sửa HTML

và dán đoạn CSS sau đây vào

trước

thẻ

]]></b:skin>

.fb_like_box{margin-top:30px;-moz-border-radius:10px 10px 10px 10px;border-radius:10px;background-color:#3B5999;border:3px solid #fff;padding:10px;}
.fb_like_top{overflow:visible;padding:0;margin:0 0 5px;width:95%;height:24px;background:url("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEir4hm71CqaH0TWrSmSqtkvulNese4diTd2SWrlm0QGaQAySc3e-NNdCnnKQxObkx6Lh87iNtwR55i9mzvwInP_eiBYIbDibckQezRh8wXYdFcZpbq_OQ6xKz1lwvKUczN5Mnm3qUrtPsnw/s1600/iris-tips-fblogo.jpg") no-repeat scroll left top transparent}
.fb_like_top a{height:24px;width:114px;background:url("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjAptqAfcEyjl0-ZuUU_LSIh16DIImjbsJs7ZboIUllZgr3_9Sm876LYAR29uqTN96D_ldM3oLe5TYc4T8c0xyddqPHwiYv8pj-90urYiwS-yNFZxW2_VBHv5_1-xypP-he22juso6ALJ24/s1600/iris-tips-beafan.jpg") no-repeat scroll left top transparent;display:block;float:right;text-indent:-5000px}
.fb_like_button_holder{-moz-border-radius:10px 10px 10px 10px;border-radius:10px;background:none repeat scroll 0 0 #fff;padding:12px 12px 0 12px;width:95%;height:42px}

2

Tìm đến thẻ

<data:post.body/>

và dán đoạn code dưới đây vào

sau

thẻ đó.

<b:if cond='data:blog.isMobileRequest == &quot;false&quot;'>
<div class='fb_like_box'>
<div class='fb_like_top'>
<a href='https://www.facebook.com/IrisTipsBlog' target='_blank' rel='nofollow'>Be a Fan</a>
</div>
<div class='fb_like_button_holder'>
<div class='fb-like' data-action='like' data-layout='button_count' data-share='true' data-show-faces='false' data-size='small'/> <div class='fb-save' data-size='small'/>
</div>
</div>
<div style='clear: both;'/>
</b:if> 

3

Để nút Like và Share hiển thị trên website bạn cần phải thêm SDK JavaScript của Facebook bằng cách dán đoạn code sau vào

trước

thẻ

</body>

<div id="fb-root"></div>
<script>(function(d, s, id) {
  var js, fjs = d.getElementsByTagName(s)[0];
  if (d.getElementById(id)) return;
  js = d.createElement(s); js.id = id;
  js.src = "
  fjs.parentNode.insertBefore(js, fjs);
}(document, 'script', 'facebook-jssdk'));</script>

Baì viết dược thực hiện bới IRIS_TIP