công ty thiết kế website tốt nhất

Facebook live chat luôn hiển thị trên mobile
 

Để khắc phục vấn đề trên hôm nay iTOOL sẽ hướng dẫn các bạn cập nhật lại version mới facebook live chat sẽ hiển thị responsive trên các thiết bị di động và tất nhiên là sẽ không còn gây phiền phức khó chịu cho khác hàng nữa. Thật là tuyệt phải không nào!

Bắt đầu làm thôi, các bước cài đặt các bạn có thể xem lại ở bài "Hướng dẫn cài đặt facebook live chat cho website" nhé. ở bước 2 bạn chỉ cần cập nhật lại đoạn code sau:

<style type="text/css">
.itool-messages { position: fixed; bottom: 0; right: 0; z-index: 999999; }
.itool-messages-outer { position: relative; }
#itool-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){ #itool-facebook { opacity:0; } .itool-messages { bottom: -300px; right: -135px; } }
</style>

<script>
    (function ($) { $(document).ready(function () { $('#itool-minimize').click(function () { if ($('#itool-facebook').css('opacity') == 0) { $('#itool-facebook').css('opacity', 1); $('.itool-messages').animate({ right: '0' }).animate({ bottom: '0' }); } else { $('.itool-messages').animate({ bottom: '-300px' }).animate({ right: '-135px' }, 400, function () { $('#itool-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&appId=260033340819904";
        fjs.parentNode.insertBefore(js, fjs);
    }(document, 'script', 'facebook-jssdk'));
</script>
    <div class="itool-messages">
        <div class="itool-messages-outer">
            <div id="itool-minimize">Facebook chat</div>
            <div id="itool-facebook" class='fb-page' data-adapt-container-width='true' data-height='300' data-hide-cover='false' data-href='https://www.facebook.com/itool.vn' data-show-facepile='true' data-show-posts='false' data-small-header='false' data-tabs='messages' data-width='250'></div>
        </div>
    </div>