Những bạn đã biết sơ về blogspot: chỉ cần lưu ý khi lưu mẫu, blogspot báo lỗi XML thì thêm amp; vào sau dấu nháy ngay chỗ mà blogspot báo lỗi. Xem hình để thấy rõ nhé các bạn.
Những bạn mới tìm hiểu về blogspot: làm theo từng bước hướng dẫn như những hình sau đây nhé.
B1: truy cập link sau, thay đường link của fanpage các bạn vào và thiết lập như hình
Mã:
https://developers.facebook.com/docs/plugins/page-plugin
B2: nhấn get code sau, copy đoạn code số 1 như hình chèn vào sau thẻ <body>
Ở bước này nhấn lưu mẫu sẽ bị báo lỗi như mình nói ở đầu bài, các bạn cũng thay amp; vào sau dấu &.
B3: vào trang tổng quan của blogpsot, chọn Bố cục -> Thêm tiện ích -> Chọn tiện ích HTML/Javascript. Chèn đoạn code số 2 (ở B2) vào khung nội dung của tiện ích mới thêm.
Cách 2:
Để chèn code Facebook live chat vào blogspot không báo lỗi, mình xin hướng dẫn các bạn làm theo các bước sau:
Với đoạn code 1:
<div id="fb-root"></div><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 = "//connect.facebook.net/vi_VN/sdk.js#xfbml=1&version=v2.5";fjs.parentNode.insertBefore(js, fjs);}(document, 'script', 'facebook-jssdk'));</script>
<div style="position:fixed; z-index:9999999; right:10px; bottom:10px;" class="fb-page" data-tabs="messages" data-href="https://www.facebook.com/shopgodotvn" data-width="250" data-height="300" data-small-header="false" data-adapt-container-width="true" data-hide-cover="false" data-show-facepile="true" data-show-posts="false"></div>
Khi bạn chèn vào blogspot và lưu mẫu thì báo lỗi thế này: "The reference to entity "version" must end with the ';' delimiter"
Để khắc phục, trong đoạn code 1 trên bạn tìm đến đoạn code:
Coppy toàn bộ đoạn code này và vào trang goo.gl hoặc bit.ly để rút gọn link, sau đó lấy link đã rút gọn về thay vào đoạn trên.
Sau khi làm xong, đoạn code cần chèn vào blogspot sẽ có dạng:
<div id='fb-root'/>
<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 = "http://goo.gl/xQZZaR";
fjs.parentNode.insertBefore(js, fjs);
}(document, 'script', 'facebook-jssdk'));</script>
<div class='fb-page' data-adapt-container-width='true' data-height='300' data-hide-cover='true' data-href='https://www.facebook.com/shopgodotvn/' data-show-facepile='true' data-show-posts='false' data-small-header='false' data-tabs='messages' data-width='250' style='position:fixed; z-index:9999999; right:10px; bottom:10px;'/>
Đến đây các bạn sẽ gặp vấn đề nho nhỏ là khi khách xem blog bằng điện thoại thì sẽ chiếm gần hết màn hình, do vậy bạn thêm đoạn code không cho hiển thị trong bobiloe như sau:
<b:if cond='data:blog.isMobile'>
<!--code hiển thị khi xem mobile-->
<b:else/>
<!--code hiển thị khi xem bằng máy tính-->
</b:if>
Sau khi làm xong đoạn code bạn cần chèn là, chỉ cần thay link https://www.facebook.com/shopgodotvn/ thành link fanpage của bạn:
<div id='fb-root'/>
<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 = "http://goo.gl/xQZZaR";
fjs.parentNode.insertBefore(js, fjs);
}(document, 'script', 'facebook-jssdk'));</script>
<b:if cond='data:blog.isMobile'>
<b:else/>
<div class='fb-page' data-adapt-container-width='true' data-height='300' data-hide-cover='true' data-href='https://www.facebook.com/shopgodotvn/' data-show-facepile='true' data-show-posts='false' data-small-header='false' data-tabs='messages' data-width='250' style='position:fixed; z-index:9999999; right:10px; bottom:10px;'/>
</b:if>
Cuối cùng nhấn Lưu là thành công rồi đấy. Nếu bạn cần trao đổi có thể email cho tôi: dinhanhtuan68@gmail.com