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, Rank Math 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.
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 theo dõi 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 nhé. Cảm ơn rất nhiều. :)
Anh ơi, bề phần upload hình ảnh ở Social của Yoast SEO là nó sẽ hiện hình đó, tittle đó luôn cho những bài khác hả anh? Hay mỗi lần viết bài là mình lại phải chỉnh thủ công ạ?
Bài nào không thiết lập thì nó sẽ hiện hình mặc định bạn nhé. Còn bài nào bạn thiết lập thì nó hiển thị ảnh riêng theo ý của bạn.
Anh ơi em nghĩ là em tìm ra lỗi og:image của mình rồi nhưng em không biết sửa làm sao hết anh giúp em với! Khi làm theo lời anh Yoast SEO/Social/Facebook/Default Image thì sau khi tải hình bên khung Image URL nó không có hiện lên https//tênweb.com/wp-content/… như anh.
Mà của em chỉ hiện lên /wp-content/… thôi ạ! Em nghĩ đây là nguyên nhân nhưng em không biết sửa ở chỗ nào T^T
Vậy giờ mình làm sao Hiếu bạn
Tất nhiên là phải xóa bớt những thẻ không cần thiết đi rồi. Còn làm sao để xóa thì chỉ có bạn biết vì bạn là người tạo ra chúng mà. :P
ôi, cám ơn bạn Hiếu nhiều nhé, mình làm được rồi.
Thank thank thank nhiều nha
Chúc mừng bạn. :)
Hiếu ơi, giờ mình share lên face book lại mà nó mất phần mô tả chỉ có phần tiêu đề thì bị gì nhỉ
https://lambanghieuuytin.com/2020/04/20/lam-bang-hieu-cong-ty-tphcm/
Dùng Debugger Tools của Facebook mà đọc các cảnh báo của nó đi bạn.
Sao mình làm mãi mà nó vẫn không hiển thị được phần mô tả và tiêu đề nhỉ
Chỉ ra được hình ảnh và chữ L dưới phần mô tả. Nhờ bạn xem giúp mình với nhé.
Thank bạn nha
Site của bạn sao sử dụng lắm thẻ meta vậy? Đã có thẻ của Yoast SEO Premium lại còn thẻ chèn thủ công bằng tay? Trùng lặp tùm lum.
P/s: Riêng thẻ “og:description” đã có tới 3 cái. Facebook nó nhận cái cuối cùng nên phần mô tả chỉ có mỗi chữ “l”.
@Trung Hiếu
Bạn có thể xem cho Mình được không? page của mình không hiện description khi share lên fb: https://thucduonggauxanh.vn/gioi-thieu/
Đã dùng debug các thông số đều ổn. không có lỗi. Response Code 206
Đã bỏ wp rocket nhưng vẫn không lên được description
Bạn thử giảm độ dài của thẻ description xuống cho phù hợp với tiêu chuẩn xem có hiện không? Mình thấy bạn để thẻ description dài cả mét thế kia. Người ta có quy định số chữ tối thiểu và tối đa trong thẻ mà.
Mình thử cắt rồi nhưng cũng ko được Bạn ạ. Do mình tinh chỉnh từ yoast seo cho fb viết theo độ dài của nó cho phép. Bạn có nắm dc desc tối đa fb cho phép là bn ký tự ko Ban?
Cái này mình chịu. Mình cũng toàn viết description dựa theo khuyến cáo của Yoast SEO dành cho Google Search thôi.
Mình đã làm theo hướng dẫn nhưng vẫn ko thể hiển thị ảnh lên facebook và zalo được , bạn xem giúp mình lỗi gì với
https://blogkinhdoanh.net/8-viec-ban-nen-biet-neu-khong-muon-song-mai-canh-ngheo-hen.html
Thanks Bạn
Ngoài Yoast SEO ra, bạn còn dùng plugin hay tính năng gì để chèn thêm 1 phần meta nữa vào bên trên meta của Yoast SEO vậy?
Mình Làm Được Rồi , Trong Phần Social Của Yoast SEO mình Chưa Nhập Mục App Id, Thanks Bạn
Ủa. Cái App ID đâu có bắt buộc ta? :O
Em chào bac ! Sao em làm theo hướng dẫn rồi mà share nó vẫn không nhận là sao bác . Xem giúp em với
https://www.phunukieuviet.vn/lam-dep/toc-dep/xu-huong-toc-han-quoc-nam-2020.html
Vẫn lỗi cấu trúc kìa bạn:
Em đã làm và vẫn không được ạ
không biết ai có thể hộ trợ em với ạ
Em chào anh ạ. Em đã làm theo hướng dẫn nhưng vẫn không thấy hiện hình ảnh. Anh xem giúp em với ạ https://duhocvietnhat.edu.vn/hoc-bong-toan-phan-nam-2019-cua-tinh-toyama/
Em cảm ơn anh nhiều ạ.
Mình share thử thấy hiện bình thường mà bạn. =.=!
Lúc chiều em debug lại thì lại được r ạ 😄
Bạn ơi, mình share bài viết của website mình lên FB mà sao không thấy hiện ảnh đại diện, chỉ thấy hiện title với mô tả thôi. Bạn kiểm tra hộ mình với, website mình là https://xuatkhaunhatban.vn
Phản hồi sớm hộ mình nhé!
Hiện rồi đó bạn. Trang nào bị lỗi thì dùng Sharing Debugger của Facebook để “Scrape Again” nhé. Chịu khó đọc bài viết kỹ một chút đi.
Xin chào bạn Trung Hiếu.
Mình có gặp một lỗi mà không biết sửa bằng cách nào, nhờ Hiếu xem giúp.
Trang web mình không thể hiển thị hình ảnh trong bài viết, lúc chỉnh sửa thì xem bình thường như xem preview,… thì không thấy hình ảnh đâu cả.
Xin cảm ơn.
Bạn có cài plugin Jetpack không?
Chào Hiếu
Mình không cài plugin đó, tự nhiên sáng nay kiểm tra thì thấy lỗi cả tất cả các bài viết. Bên Host họ cũng không sửa được luôn.
Site của bạn đang bật tính năng lazyload hình ảnh bằng WP Rocket? Kiểm tra xem theme hoặc ngoài WP Rocket có plugin nào khác đang bật tính năng tương tự không?
Mình cảm ơn Hiếu. Mình sẽ thử.