Hướng dẫn sửa lỗi hình ảnh bài viết không xuất hiện trên Facebook cho Blogspot

Hướng dẫn sửa lỗi hình ảnh bài viết không xuất hiện trên Facebook cho Blogspot hay chính xác hơn là chúng ta sẽ phỉa đối phó với việc hình ảnh bài viết không xuất hiện khi chúng ta chia sẻ một bà viết bất kỳ lên mạng xã hội số một thế giới là Facebook

Điều này xảy ra khi các công cụ tìm kiếm của Facebook không đưa các dữ liệu từ các bài viết xử lý cho Facebook và điều này là khá lo ngại bởi vì ngay cả khi kích thước của hình ảnh hiển thị chỉ xuất hiện rất nhỏ chỉ là 90x90 pixel.

Và bây giờ mình sẽ cung cấp một giải pháp đó là bằng cách thêm một Facebook Graph mở thẻ thêm một thẻ meta trên blog của bạn.

Để bắt đầu, hãy làm theo các bước dưới đây:
Lưu ý hãy backup teamplate của bạn trước khi chúng ta bắt tay vào chỉnh sửa bất cứ đoạn code nào dù chỉ là nhỏ nhất.

Đi tới Blogger Dashboard rồi Click Template chọn Edit HTML
1. Tìm thẻ <head> trong template và dưới đây áp dụng thẻ meta bên dưới:

HTML<!-- [ Social Media meta tag ] -->
<b:if cond='data:blog.url == data:blog.homepageUrl'> 
<b:if cond='data:blog.pageType == &quot;item&quot;'> 
<b:if cond='data:blog.pageType == &quot;static_page&quot;'>  
<b:if cond='data:blog.url'>
<meta expr:content='data:blog.url' property='og:url'/>
</b:if>
<meta expr:content='data:blog.title' property='og:site_name'/>
<b:if cond='data:blog.pageName'>
<meta expr:content='data:blog.pageName' property='og:title'/>
</b:if></b:if></b:if></b:if>
<meta expr:content='data:blog.pageTitle' property='og:title'/>
<b:if cond='data:blog.pageType == &quot;item&quot;'>
<meta content='article' property='og:type'/>
<b:else/>
<meta content='website' property='og:type'/>
</b:if>
<meta expr:content='data:blog.canonicalUrl' property='og:url'/>
<b:if cond='data:blog.postImageUrl'>
<meta expr:content='data:blog.postImageUrl' property='og:image'/>
<b:else/>
<b:if cond='data:blog.postImageThumbnailUrl'>
<meta expr:content='data:blog.postThumbnailUrl' property='og:image'/>
<b:else/>
<meta expr:content='data:blog.blogspotFaviconUrl' property='og:image'/>
</b:if></b:if>
<b:if cond='data:blog.metaDescription'>
<meta expr:content='data:blog.metaDescription' property='og:description'/>
<b:else/>
<meta content='DESCRIPTION OF ALTERNATIVE CONTENT HERE' property='og:description'/>
</b:if>
<meta expr:content='data:blog.title' property='og:site_name'/>
<meta content='CODE-APPLICATION' property='fb:app_id'/>
<meta content='CODE-ADMIN' property='fb:admins'/>
<meta content='en_US' property='og:locale'/>
<meta content='en_GB' property='og:locale:alternate'/>
<meta content='id_ID' property='og:locale:alternate'/>

2. Bước tiếp theo, tìm thẻ <body> và dưới áp dụng các tập lệnh dưới đây:

JS<div id='fb-root'/>
<script>
window.fbAsyncInit = function() {
FB.init({
appId : 'CODE-APPLICATION',
status : true, // check login status
cookie : true, // enable cookies to allow the server to access the session
xfbml : true // parse XFBML
});
};
(function() {
var e = document.createElement('script');
e.src = document.location.protocol + '//connect.facebook.net/en_US/all.js';
e.async = true;
document.getElementById('fb-root').appendChild(e);
}());
</script>

2. Lưu mẫu của bạn lại.

Thông số kỹ thuật:

DESCRIPTION OF ALTERNATIVE CONTENT HERE: Mô tả thay thế sẽ xuất hiện nếu các bài không được đưa ra một mô tả.
CODE-APPLICATION: Điền vào trong người bạn facebook mã ứng dụng
CODE-ADMIN: Điền các hồ sơ hay các trang fan hâm mộ đang facebook.

Hãy chắc chắn rằng các hình ảnh tải lên có kích thước không nhỏ hơn 600 × 315 điểm ảnh, và nếu ít thì Facebook sẽ thay đổi kích thước hình ảnh để 90x90 pixel. Nó là tốt hơn để sử dụng một hình ảnh với kích thước 1200 × 630 pixel, 800 × 420 pixel và 600 × 315 điểm ảnh.

Sau khi tất cả được áp dụng, xin vui lòng chọn một trong các url của bài viết blog của bạn ở đây: