Hướng dẫn tạo nút like face book đơn giản đẹp cho blogspot

Hướng dẫn các bạn tạo vào nút like fan page facebook cho template blogspot của mình một cách đơn gian và chuyên nghiệp.
nut link fan page dep va don gia cho blogspot

Nút like fan page facebook cho blogpsot đẹp và đơn giản

Rất đơn giản, bạn chỉ việc thêm đoạn code sau trên thẻ </body> là được.
<style>
#open-fb{background-color: #FFFFFF; border: 4px solid rgb(210, 210, 210); bottom: 0; border-bottom: 0; float:left; height: auto; margin-bottom: 0; margin-right: 5px; position: fixed; right: 0; width: auto; z-index: 10;}
.close-fb{color: #333!important; position: absolute; top: 1px; right: 1px; width: 20px; height: 20px; line-height: 20px; text-align: center; font-size: 11px;}
.slideUp{
 animation-name: slideUp;
 -webkit-animation-name: slideUp; 
 animation-duration: 1s; 
 -webkit-animation-duration: 1s;
 animation-timing-function: ease; 
 -webkit-animation-timing-function: ease;
 visibility: visible !important;   
}
@keyframes slideUp {
 0% {
  transform: translateY(100%);
 }
 50%{
  transform: translateY(-8%);
 }
 65%{
  transform: translateY(4%);
 }
 80%{
  transform: translateY(-4%);
 }
 95%{
  transform: translateY(2%);
 }   
 100% {
  transform: translateY(0%);
 } 
}
@-webkit-keyframes slideUp {
 0% {
  -webkit-transform: translateY(100%);
 }
 50%{
  -webkit-transform: translateY(-8%);
 }
 65%{
  -webkit-transform: translateY(4%);
 }
 80%{
  -webkit-transform: translateY(-4%);
 }
 95%{
  -webkit-transform: translateY(2%);
 }   
 100% {
  -webkit-transform: translateY(0%);
 } 
}
</style>

<div class='slideUp' id='open-fb'>

<a class='close-fb' href='#close-fb-like-box' onclick='hide(&apos;open-fb&apos;)' title='Close'><i class='fa fa-times'/></a>
<div class='fb-like-box ' data-header='false' data-height='62' data-href='https://www.facebook.com/kenhtemplate' data-show-faces='true' data-stream='false' data-width='187'><span style='height: 62px; width: 187px; '><iframe allowTransparency='true' frameborder='0' scrolling='no' src='//www.facebook.com/plugins/likebox.php?href=https://www.facebook.com/kenhtemplate&amp;width=187&amp;height=62&amp;show_faces=false&amp;colorscheme=light&amp;stream=false&amp;border_color&amp;header=true' style='border:none; overflow:hidden; width:187px; height:62px;'/>
</span></div></div>
<script type='text/javascript'>
function show(target) {
    document.getElementById(target).style.display = &#39;block&#39;;
}
function hide(target) {
    document.getElementById(target).style.display = &#39;none&#39;;
}
</script>
Sau khi thêm vào bạn nhớ thay 2 link đỏ : https://www.facebook.com/kenhtemplate thành link fan page của các bạn nha. ok các bạn lưu lại là xong.
Mình vứa hướng dẫn các bạn cách tích hợp nút like fan page đẹp và đơn giản vào Template blogger. Bạn nào không làm được để lại comment bên phía dưới bài viết này mình hỗ trợ nha.
Chúc các bạn có nhưng blog đẹp và ưng ý!

1 nhận xét trong bài "Hướng dẫn tạo nút like face book đơn giản đẹp cho blogspot"

  1. BẠn ơi, mình đang dùng mẫu 00105, mình chèn mà không thấy thẻ "body" ở đâu hết, bạn giúp mình nhé

    ReplyDelete