Header ads

Header ads
» » » Cách chèn fanpage facebook vào blogspot mới

Dạo quanh nhiều bài viết hướng dẫn chèn fanpage facebook vào blogspot, thấy có nhiều bạn bị vướng ở bước Get Code để chèn vào blog, lỗi phân tích cú pháp XML (The reference to entity "version" must end with the ';' delimiter). Nên mình viết bài này mong là sẽ giúp được bạn nào đang bị mắc phải lỗi này khi chèn fanpage facebook vào blogspot.



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.

chen-fanpage-vao-blog-b4.jpg 
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
chen-fanpage-facebook-vao-blogspot.JPG 
B2: nhấn get code sau, copy đoạn code số 1 như hình chèn vào sau thẻ <body>

code-chen-fanpage-facebook-vao-blogspot.JPG 

chen-fanpage-vao-blog-b3.jpg 

Ở 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.

chen-fanpage-vao-blog-b7.jpg 

chen-fanpage-vao-blog-b8.jpg
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:

//connect.facebook.net/vi_VN/sdk.js#xfbml=1&version=v2.5

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 = &quot;http://goo.gl/xQZZaR&quot;;
fjs.parentNode.insertBefore(js, fjs);
}(document, &#39;script&#39;, &#39;facebook-jssdk&#39;));</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 = &quot;http://goo.gl/xQZZaR&quot;;
fjs.parentNode.insertBefore(js, fjs);
}(document, &#39;script&#39;, &#39;facebook-jssdk&#39;));</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

About Học viện đào tạo trực tuyến

Xinh chào bạn. Tôi là Đinh Anh Tuấn - Thạc sĩ CNTT. Email: dinhanhtuan68@gmail.com .
- Nhận đào tạo trực tuyến lập trình dành cho nhà quản lý, kế toán bằng Foxpro, Access 2010, Excel, Macro Excel, Macro Word, chứng chỉ MOS cao cấp, IC3, tiếng anh, phần mềm, phần cứng .
- Nhận thiết kế phần mềm quản lý, Web, Web ứng dụng, quản lý, bán hàng,... Nhận Thiết kế bài giảng điện tử, số hóa tài liệu...
HỌC VIỆN ĐÀO TẠO TRỰC TUYẾN:TẬN TÂM-CHẤT LƯỢNG.
«
Next
Bài đăng Mới hơn
»
Previous
Bài đăng Cũ hơn