iBegins
 

Code Chat Live Fanpages Facebook

1. Gán Css

#cfacebook{position:fixed;bottom:0px;right:20px;z-index:999999999999999;width:250px;height:auto;box-shadow:6px 6px 6px 4px rgba(0,0,0,0.2);border-top-left-radius:5px;border-top-right-radius:5px;overflow:hidden;}#cfacebook .fchat{float:left;width:100%;height:270px;overflow:hidden;display:none;background-color:#fff;}#cfacebook .fchat .fb-page{margin-top:-130px;float:left;}#cfacebook a.chat_fb{float:left;padding:0 25px;width:250px;color:#fff;text-decoration:none;height:40px;line-height:40px;text-shadow:0 1px 0 rgba(0,0,0,0.1);background-image:url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAAqCAMAAABFoMFOAAAAWlBMV…8/UxBxQDQuFwlpqgBZBq6+P+unVY1GnDgwqbD2zGz5e1lBdwvGGPE6OgAAAABJRU5ErkJggg==);background-repeat:repeat-x;background-size:auto;background-position:0 0;background-color:#3a5795;border:0;border-bottom:1px solid #ffffff;z-index:9999999;margin-right:11px;font-size:13px;}#cfacebook a.chat_fb:hover{color:white;text-decoration:none;}

2. Gán code sau vào trước thẻ </body>

<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 = 'https://connect.facebook.net/vi_VN/sdk.js#xfbml=1&version=v2.12';
 fjs.parentNode.insertBefore(js, fjs);
}(document, 'script', 'facebook-jssdk'));</script>
<div id="cfacebook">
 <a href="javascript:;" class="chat_fb" onclick="return:false;"><i class="fa fa-facebook-square"></i> Chat Facebook với chúng tôi </a>
 <div class="fchat">
 <div class="fb-page" data-tabs="messages" data-href="https://www.facebook.com/ibegins.net/" data-width="250" data-height="400" data-small-header="false" data-adapt-container-width="true" data-hide-cover="false" data-show-facepile="true" data-show-posts="false"></div>
 </div>
</div>

3. Gán code sau trước thẻ </head> 

<script>
$(document).ready(function(){
 $(".chat_fb").click(function(){
 $(".fchat").toggle('slow');
 });
});
</script>

Demo Ảnh :

 

Chú ý : các bạn thay dòng link sau là pages của bạn  https://www.facebook.com/ibegins.net/

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

Ngày 2 Tháng Ba, 2018 ( 445 )

Tagged with: , ,

Bình luận bài viết

Đăng nhập để bình luận và xem các bình luận khác.