10/05/2016

Chèn khung chát Facebook vào blogspot tuyệt đẹp

Nguyễn Nhật Thiên | 10/05/2016| |

Nhatthienkt.net - Facebook có sức phổ biến và tiện lợi nhất hiện nay, khi mới thức dậy nhiều người thực hiện kiểm tra thông tin trên facebook trước khi xuống giường cũng như trước khi đi ngủ vào buổi tối. Mọi người thường thích nhắn tin, comment với facebook hơn so với các ứng dụng khác. Là một người quản trị website bạn sẽ luôn quan tâm đến điều tốt nhất đối với khách hàng của mình về chính sách chăm sóc khách hàng cũng như tư vấn, giải đáp. Làm thế nào để khách hàng có thể tương tác với quản trị blog nhanh và đơn giản nhất, theo tôi nghĩ với một ứng dụng tiện ích miễn phí thì Facebook Live Chat là sự lựa chọn thông minh.
Chèn khung chát Facebook vào blogspot tuyệt đẹp

Facebook Live Chat được sử dụng rộng rãi trên các blog/website 

Facebook Live Chat

Ưu điểm:
  • Khách hàng dùng tài khoản Facebook để gửi tin và nhận phản hồi ngay cả khi đã thoát khỏi website.
  • Quản lý cũng như trả lời tin nhắn trực tiếp trên tài khoản Fanpage.
  • Facebook đang được sử dụng rộng rãi nên thích hợp với mọi khách hàng
Nhược điểm
  • Không thể trả lời tin nhắn thông qua hộp thoại nhắn tin trên website/blog
  • Khách hàng phải đăng nhập tài khoản facebook trên trình duyệt mới gửi tin nhắn thành công.
Chèn khung Facebook Live Chat vào blogspot
- Bước 1: Vào Mẫu --> Chỉnh sửa HTML
- Bước 2: Tìm đến thẻ 
</Body>
- Bước 3: Chèn đoạn code sau lên phía trên nó
Kiểu 1
Chèn khung chát Facebook vào blogspot tuyệt đẹp

<style type="text/css">

.liveChat-Box{
 position: fixed;
    width: 260px;
    right: 5px;
    bottom: -5px;
 padding: 5px;
    z-index: 100000000000}

.liveChat-bar{
    text-align: center;
    background-color: #5B74A8;
    /* border: solid 1px #c3c3c3; */
    border-radius: 4px 4px 0px 0px;
    height: 30px;
    line-height: 30px;
    color: #fff}

.liveChat-panel{
    height:300px;
    display: none;
 background:#fff}

</style>

<script type="text/javascript">
 $(document).ready(function(){
  $(".liveChat-bar").click(function(){
   $(".liveChat-panel").toggle();
  });
 });
</script>

<div class="liveChat-Box">
    <div class="liveChat-bar">Chat với chúng tôi</div>
    <div class="liveChat-panel">
        <div id="fb-root"></div>

        <script type="text/javascript">
            (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 = "//connect.facebook.net/vi_VN/sdk.js#xfbml=1&amp;version=v2.5";
                fjs.parentNode.insertBefore(js, fjs);
            }(document, 'script', 'facebook-jssdk'));
        </script>

        <div style="position:fixed; z-index:9999999; right:10px; bottom:0px;" class="fb-page" data-tabs="messages" data-href="https://www.facebook.com/nhatthienktblog" data-width="250" data-height="300" data-small-header="true" data-adapt-container-width="true" data-hide-cover="false" data-show-facepile="false" data-show-posts="false"></div>
       </div>
   </div>
	
Kiểu 2
Chèn khung chát Facebook vào blogspot tuyệt đẹp


<style type="text/css">
.hisella-messages { position: fixed; bottom: 0; right: 0; z-index: 999999; }
.hisella-messages-outer { position: relative; }
#hisella-minimize { background: #3b5998; font-size: 14px; color: #fff; padding: 3px 10px; position: absolute; top: -34px; left: -1px; border: 1px solid #E9EAED; cursor: pointer; }
@media screen and (max-width:768px){ #hisella-facebook { opacity:0; } .hisella-messages { bottom: -300px; right: -135px; } }
</style>
<div id='fb-root'></div>
<script>
(function($) { $(document).ready(function(){ $( '#hisella-minimize' ).click( function() { if( $( '#hisella-facebook' ).css( 'opacity' ) == 0 ) { $( '#hisella-facebook' ).css( 'opacity', 1 ); $( '.hisella-messages' ).animate( { right: '0' } ).animate( { bottom: '0' } ); } else { $( '.hisella-messages' ).animate( { bottom: '-300px' } ).animate( { right: '-135px' }, 400, function(){ $( '#hisella-facebook' ).css( 'opacity', 0 ) } ); } } ) }); })(jQuery);
(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 = "//connect.facebook.net/en_US/sdk.js#xfbml=1&version=v2.5";
fjs.parentNode.insertBefore(js, fjs);
}(document, 'script', 'facebook-jssdk'));
</script>
<div class="hisella-messages"><div class="hisella-messages-outer"><div id="hisella-minimize">Facebook chat</div><div id="hisella-facebook" class='fb-page' data-adapt-container-width='true' data-height='300' data-hide-cover='false' data-href='https://www.facebook.com/nhatthienktblog' data-show-facepile='true' data-show-posts='false' data-small-header='false' data-tabs='messages' data-width='250'></div></div></div>

Thay link: 
https://www.facebook.com/nhatthienktblog
thành link trang fanpage của bạn. Chúc các bạn thành công!