Hướng dẫn thêm Facebook Livechat cho Blogger ( Blogspot )

BloggerGuide

Sunday, November 8, 2015

0 comments

Hướng dẫn thêm Facebook Livechat cho Blogger ( Blogspot ) giúp bạn liên kết Facebook Fanpage và Blog lại với nhau nhằm nâng cao tương tác người dùng, khách hàng

Lợi ích:

• 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ý tin nhắn của khách hàng thông qua hộp thư của fanpage, không cần cài đặt ứng dụng riêng.
• Thích hợp với các shop bán hàng cả trên kênh fanpage, muốn thống nhất 1 kênh chăm sóc khách hàng.

Hướng dẫn cách cài đặt Facebook livechat cho Blogger

Bước 1: Truy cập vào Blogger DashBoard chèn đoạn code dưới đây vào thẻ đóng </body>

<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/your_fanpage" 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>

Thay đoạn link: https://www.facebook.com/your_fanpage bằng link Fanpage của bạn

Bước 2: Kiểm tra khung Chat xem hiển thị hay không thì bạn phải Đăng nhập Facebook trên cùng trình duyệt mở Blog. Khung chat hiển thị ở góc phải màn hình, chạy theo cuộn chuột. Các bạn có thể chỉnh sửa trực tiếp đoạn code trên để tùy biến khung chat phù hợp.

Tag : Blog Tips