Hướng dẫn cách sửa lỗi không hiện hình ảnh và mô tả khi share link lên Facebook.
Bạn đã bao giờ gặp phải tình trạng share link từ website của mình lên Facebook nhưng chúng không hiển thị đầy đủ tiêu đề, phần mô tả và hình ảnh đại diện (thumbnail) chưa? Nguyên nhân của vấn đề này có thể là do website của bạn chưa được tích hợp Facebook Open Graph Meta Data hoặc bots Facebook gặp lỗi trong quá trình thu thập dữ liệu từ liên kết mà bạn muốn chia sẻ (lỗi cache, lỗi kết nối với server…). Bạn hoàn toàn có thể khắc phục được nó và bài viết ngay sau đây là dành cho bạn.
Tham khảo thêm:
- Hướng dẫn tích hợp Facebook Chat vào website WordPress
- Tích hợp Facebook Like Reactions vào WordPress
Facebook Open Graph là gì?
Facebook Open Graph (hay Facebook Open Graph Protocol) là 1 giao thức dùng để giao tiếp giữa website của bạn với mạng xã hội Facebook. Hay nói cách khác Open Graph chính là cầu nối giúp website của bạn trở thành một phần của mạng xã hội Facebook, giúp quảng bá website trên Facebook và tương tác mạng xã hội được dễ dàng hơn.
Facebook Open Graph bao gồm một tập hợp các meta tags, giúp bạn định nghĩa nội dung trên website thành dữ liệu có cấu trúc mà bots của Facebook có thể hiểu được. Khi bạn chia sẻ 1 link trên status hoặc Facebook Messenger, nếu website không sử dụng Open Graph thì Facebook chỉ hiển thị duy nhất link bài viết mà thôi.
Khi chèn Open Graph vào website, nó sẽ làm cho trang mà bạn chia sẻ trở thành đối tượng có các thuộc tính mà mạng xã hội yêu cầu như: title (tiêu đề), description (mô tả), ảnh thumbnail… Vì thế link chia sẻ sẽ có đầy đủ ảnh thumbnail, tiêu đề, mô tả… do bạn chỉ định để lôi cuốn người đọc click vào link.
Sử dụng Facebook Open Graph trong WordPress
Trong WordPress, các bạn cso thể tích hợp Facebook Open Graph vào website một cách dễ dàng nhờ các plugin như Yoast SEO hay Open Graph and Twitter Card Tags.
Nếu đang sử dụng Yoast SEO, các bạn truy cập vào SEO => Social => Chọn tab Facebook và thiết lập tương tự như hình bên dưới.
Trong đó, vấn đề quan trọng nhất là nhớ Enabled trong mục Add Open Graph meta data để tích hợp Facebook Open Graph vào website của bạn.
Ngoài ra:
- Frontpage settings: cho phép bạn thiết lập ảnh thumbnail, tiêu đề và phần mô tả cho trang chủ của website.
- Default settings: cho phép bạn thiết lập ảnh thumbnail mặc định cho, áp dụng cho các link chia sẻ không có sẵn ảnh thumbnail.
Sau khi thiết lập xong, click vào nút Save Changes để lưu lại.
Các bạn cũng có thể tùy biến cách hiển thị của từng bài viết/ trang trên Facebook thông qua tab Social của Yoast SEO trên trình soạn thảo. Nếu không, các giá trị như tiêu đề, ảnh thumbnail và mô tả sẽ mặc định được lấy từ phần thiết lập SEO.
Khắc phục lỗi không hiện hình ảnh và mô tả khi share link lên Facebook
Ngay cả khi đã tích hợp Open Graph, website của bạn vẫn có thể gặp lỗi không hiện hình ảnh, mô tả, tiêu đề… khi share link lên Facebook. Nguyên nhân của việc này là do bots Facebook không thể kết nối với website của bạn tại thời điểm mà nó thu thập dữ liệu. Và điều đáng buồn hơn là Facebook sẽ lưu lại kết quả này gần như vô thời hạn.
Vậy làm thế nào để xóa kết quả index cũ và tạo index mới cho những trang từng bị lỗi không hiện hình ảnh, tiêu đề, mô tả… trước đó?
1. Đầu tiên, các bạn cần làm là truy cập vào trang Sharing Debugger của Facebook. Paste link cần sửa lỗi vào mục Sharing Debugger và click vào nút Debug.
2. Đợi cho quá trình debug hoàn tất, click tiếp vào nút Scrape Again.
Chờ trong giây lát để bots của Facebook tiến hành thu thập lại dữ liệu. Nếu site đã tích hợp Facebook Open Graph, lỗi của bạn sẽ được khắc phục hoàn toàn. Thật đơn giản phải không nào? Chúc các bạn thành công!
Nếu bạn thích bài viết này, hãy subscribe blog của tôi để thường xuyên cập nhật những bài viết hay nhất, mới nhất qua email nhé. Cảm ơn rất nhiều. :)
mình muốn canh giữa hình ảnh banner phải làm sao Hiếu?
Bạn dùng thẻ
div style="text-align:center;"nhé. Download file hướng dẫn cài đặt theme Paradise về để xem kỹ hơn. Mình mới cập nhật file hướng dẫn mới đấy. :PChèn vào css của ảnh à
Bạn gửi mình link tải nhé
Download trên VIP CLUB chứ đâu nữa bạn? :P
Cái này là HTML mà bạn. :P
Trước đây share lên fb thì nó còn hiện “by + tên tác giả”, mà bây giờ không thấy nữa. Có khắc phục được lỗi này không Hiếu?
Bạn vào Users => Your Profile => Paste link Facebook của bạn vào mục “Facebook profile URL” xem sao. :P
Cảm ơn Hiếu!
Hỗm rày thử mà vẫn chưa được, thôi kệ vậy.
Em chào anh ạ,
Em có một vấn đề này không liên quan tới bài này mong được anh giúp đỡ ạ. Em có dùng Subscriber Form thì subscriber của em không nhận được thông báo bài viết mới anh ạ. Tuy nhiên có 1 email follower từ bên WordPress (em có kết nối WordPress vs Dashboard Godday) thì email này lại nhận được new post, trong khi các sub mà sub trực tiếp từ trang web rồi xuất hiện trong subscriber form thì không nhận được anh ạ.
Anh có thể giúp em vấn đề này được không ạ? Em cảm ơn nhiều.
Bạn phải kiểm tra lại xem cái dịch vụ mà bạn đang sử dụng có tính năng gửi email thông báo tự động mỗi khi có bài viết mới hay không? Hay nó bắt bạn phải gửi thủ công?
Cho mình hỏi cách fix lỗi này với =(((
https://prnt.sc/gh96ra
Lỗi này xảy ra khi bạn đang edit một bài viết có sẵn hay là tạo bài viết mới vậy? Cái dòng thông báo kia có nghĩa là bạn đang chỉnh sửa một trang template (dùng để hiển thị danh sách các bài viết mới nhất) chứ không phải là một bài viết đơn thuần?
Web sakurafashion.vn của e, khi gửi link web trả lời comment của khách trên facebook, những sản phẩm đăng đã lâu thì hiện ảnh thumbnail bình thường, nhưng sản phẩm mới đăng vài ngày gần đây thì không hiện ảnh thumbnail.
Ví dụ SP đăng đã lâu và mới đăng thì cái hiện cái không: https://i.imgur.com/XP6ERcr.jpg
Gần đây em có xóa jquery Highslide mà không rành về code lắm nên không biết do mình gây ra lỗi không? Anh có thể kiểm tra web em xem không hiện thubnail là do lỗi gì với ạ? Em cám ơn anh nhiều.
Hiện tại mình không thể truy cập được vào site của bạn. Bạn kiểm tra lại đi nhé. :P
Anh xem lại giùm em với ạ http://sakurafashion.vn/ . Cám ơn anh.
Mình test thử một số link thấy vẫn hiện ảnh bình thường mà. Site của bạn cũng đã được tích hợp Facebook Open Graph rồi. Link nào không hiện chắc là do kết nối bị lỗi khi bot Facebook thu thập dữ liệu thôi. :P
Cám ơn anh đã nhiệt tình giải đáp. Với link mới đăng nếu link là tin tức (VD http://sakurafashion.vn/top-8-shop-thoi-trang-nu-dep-nhat-ca-mau-4867.html ) thì hiện ảnh thumbnail, còn link sản phẩm mới đăng gần đây (VD http://sakurafashion.vn/ao-and-live-forever-4916.html ) thì ko hiện thumbnail là vì sao anh nhỉ?
Lỗi trong quá trình Facebook Bots thu thập dữ liệu thôi. Mình vừa debug thử link đó cho bạn và hình ảnh đã hiện rồi đó. :P
Vậy trong source code của web em không bị lỗi phải không ạ?
Source web không bị lỗi đâu bạn nhé. :)
Anh có kinh nghiệm về việc share link lên google plus không, đầy đủ các thẻ meta trên web nhưng nó chỉ hiện có mỗi hình ảnh anh ạ.
site em đang soạn bài đăng ảnh bình thường. tự nhiên hôm nay khi soạn tải ảnh lên giữa bài viết thì vẫn hiện, nhưng đặt ảnh đại diện của bài viết thì nó không hiện
và khi xuất bản bài viết đó thì không hiển thị cả hình ảnh đại diện và hình ảnh chèn giữa bài viết.
anh chỉ em cách khắc phục lỗi này với ạ
em cảm ơn!
Bạn phải đưa link thì mình mới kiểm tra được chứ? :O Nói không như vậy thì bó tay.
Làm đủ cách rồi nhưng vẫn không được,share trang chủ thì nó hiển thị đầy đủ ok nhưng share bài viết thì nó chỉ hiển thị mỗi tên miền của trang chủ chứ không hiển thị tiêu đề,mô tả hay hình ảnh của bài viết gì cả mặc dù trong file Header có đầy đủ những thẻ thuộc tính đó rồi.Help tui với ông.
Rõ ràng là cấu trúc Open Graph vẫn chưa chuẩn mà, còn lỗi nè:
The 'og:image' property should be explicitly provided, even if a value can be inferred from other tags.The following required properties are missing: og:url, og:type, og:title, og:image, og:description, fb:app_id
ủa mấy cái thẻ thuộc tính đó có hết trong header rồi mà ta?code thẻ thuộc tính đó mình lấy chuẩn của thằng FB đưa vào header.Share link trang chủ thì ok nó vẫn hiển thị bình thường nhưng khi share link bài viết thì không được.
Check bằng tool debug của Facebook nó bảo không có kìa bạn. Mà nó bảo không có thì nó không hiện thôi.
Mình cũng biết là vậy nhưng trong header.php đã thêm đầy đủ thẻ thuộc tính cho nó rồi mà giờ check link bài viết nó báo vậy mình cũng không biết cách nào để khắc phục cả.Nãn
Tại sao không dùng 1 plugin như Yoast SEO để chèn mà lại phải chèn trực tiếp trong file header.php làm gì? Thích phức tạp hóa vấn đề?
Lúc trước trong Yoast SEO đã bật về vấn đề này rồi,trong plugin đó ở chổ FB nó chỉ cho điền id app và link hình ảnh và mình cũng đã làm nhưng vẫn không được nên mới chèn thử thẻ thuộc tính theo hướng dẫn của FB.Cái plugin này mình xài từ lúc lập web đến giờ cũng đc 3 năm rồi nên mình cũng hiểu rất rõ tính năng của nó mà.
Mình dùng vẫn bình thường mà. Bạn kích hoạt tính năng của Yoast SEO, gỡ cái code trong header.php kia và test lại với công cụ Sharing Debugger xem sao. Coi nó báo lỗi gì? Còn đối với tình trạng hiện tại thì mình kiểm tra thấy nó báo lỗi như vậy. Nhớ xóa cache web trước khi kiểm tra.
Vẫn không được,nó vẫn báo thiếu mấy thẻ như lúc đầu à
Bài mới là hay bị, không lẽ cứ làm hoài vậy ad, mình đã cài đặt trong yoast seo rồi mà kì vậy ta?
Nếu vậy thì nhiều khả năng host của bạn gặp vấn đề khi kết nối với Facebook rồi. Kiểm tra xem “Response Code” là bao nhiêu? Có phải “200” không? Hay 500, 503…
Hai site trên cùng 1 host, mấy năm nay bình thường, nó mới gặp vấn đề này máy ngày nay thôi bác.
http://prntscr.com/je2xqu 200 bac ạ.
Ý mình là cái “Response Code” trên trang debug lỗi của Facebook ấy.
Mình đã làm hết cách trên mà vẫn ko được
ad oi giup minh voi di
Lúc debug bạn có thấy Facebook nó báo lỗi thiếu thông tin gì không?
Lỗi này ad! website cũng đã cài yoatseo và có những thông tin thẻ meta og rồi nhưng nó vẫn báo lỗi
Thuộc tính được suy ra
Thuộc tính ‘og:image’ phải được cung cấp rõ ràng, ngay cả khi có thể suy ra giá trị từ các thẻ khác.
Thiếu tài sản
Các tài sản cần thiết sau bị thiếu: og:url, og:type, og:title, og:image, og:description, fb:app_id
SSL Error
Can’t validate SSL Certificate. Either it is self-signed (which will cause browser warnings) or it is invalid.
Lỗi Curl
Lỗi Curl: 60 (SSL_CACERT)
Mình sửa được rồi ad nhưng sao trên trình debug facebook nó hiển thị hình ảnh mà lúc share bài thì nó không hiển thị ạ
Mình kiểm tra thử mấy link thấy hiện bình thường mà?
Bạn ơi mình cũng bị lỗi như bạn
Lỗi Curl: 60 (SSL_CACERT)
…
Vậy fix như thế nào thế bạn?..Xin cách với
Trang của bạn bị lỗi SSL rồi:
https://www.sslshopper.com/ssl-checker.html#hostname=https://ups-gtec.com/. Bạn đang dùng Fail-over Hosting của TenTen à? :DDạ đúng rùi anh…dùng host của tenten…ko bik sao lỗi vậy hjz hjz…a có cách nào fix ko anh..e bảo tenten thì bên đó bảo là SSL ng bán lỗi…nên chưa chịu fix
Bạn có thể dùng SSL miễn phí mà. Đâu nhất thiết phải mua. Let’s Encrypt cũng rất tốt. Nếu bên TenTen không hỗ trợ thì bơi qua bên mình đi. :v
Em mới mua cái host 1 năm rồi anh…@@…sao bơi qua bên anh dc…^^..để hết năm thì mới đổi dc chứ a…mà SSL mà dùng bản miễn phí thì có bị sao ko anh…
Không tương thích với trình duyệt web và hệ điều hành phiên bản quá cũ. Tuy nhiên, còn hơn cái tình trạng hiện tại của bạn nhiều. :))
Thanks a…haiz…đúng là mệt vờ lờ mà…