Việc chia sẻ link website, bài viết hoặc sản phẩm qua tin nhắn facebook, zalo hoặc chia sẻ lên tường bất cứ một mạng xã hội nào mà hiển thị được nội dung đầy đủ thì website đó nhìn chuyên nghiệp và tạo cảm giác dễ click cho người xem hơn. Show
Việc bạn copy và gửi qua tin nhắn hoặc chia sẻ lên một mạng xã hội thì nội dung hiển thị sẽ được tải lên bao gồm: Hình đại diện, Tiêu đề (Tên website), một đoạn mô tả ngắn. Tuy nhiên có một số trang khi chia sẻ không hiển thị. VD chia sẻ bài viết qua Zalo chia sẻ link website, bài viết qua Facebook (Hoặc chia sẻ lên tường) Đối với những trang không hiển thị thì Nguyên nhân là do đâu?Nguyên nhân thường do mã nguồn website không được lập trình cung cấp những dữ liệu này. Cũng có thể trong quá trình thu tập dữ liệu của các ứng dụng này bị lỗi. Vì vậy, trước tiên, để kiểm tra xem các trường dữ liệu cần thiết để cung cấp khi chia sẻ qua các ứng dụng nhắn tin hoặc chia sẻ lên mạng xã hội đã được website cung cấp chưa? Kiểm tra trên Tool của Zalo: "Kiểm tra các thuộc tính Open Graph của website trên Zalo" Hoặc kiểm tra Tool của Facebook sẽ hiển thị đầy đủ thuộc tính hơn, vào link "Kiểm tra các thuộc tính Open Graph của website trên Facebook" Khi vào link trên, nhập link website hoặc link bài viết, sản phẩm vào rồi nhấn Kiểm tra Kiểm tra và gỡ lỗi chia sẻ URL trên Zalo Sau đó, nhấn "Thu thập lại" để làm mới dữ liệu đã thu tập trước đó. Trường hợp dữ liệu đã có sẽ báo như sau: Đối với Zalo Đối với Facebook Trường hợp chưa có thẻ Open GraphZalo cảnh báo thiếu thẻ Meta Open Graph Facebook cảnh báo thiếu thẻ Meta Open Graph Trường hợp khiểm tra chưa có dữ liệu phải làm sao?Nếu bạn đang sử dụng một mã nguồn mở nào đó, thử tìm kiếm các module (hoặc plugin) liên quan xem. Ví dụ tìm với từ khóa "plugin open graph wordpress" cho mã nguồn mở wordpress. Sử dụng thẻ Open Graph trong SEO là một kỹ thuật nâng cao có thể giúp website gia tăng thứ hạng hiển thị cũng như thu hút traffic hiệu quả. Tuy nhiên, kỹ thuật này lại được ít SEOer biết đến. Vậy Open Graph là gì và cách cài đặt như thế nào? Hãy cùng Vietnix tìm hiểu chi tiết trong bài viết sau ngay nhé. Open Graph là gì?Open Graph hay Facebook Open Graph là một giao thức được sử dụng để làm cầu nối giao tiếp giữa website với mạng xã hội. Có thể hiểu, giao thức này giúp nền tảng mạng xã hội như Facebook hiểu, tóm tắt cũng như hiển thị được nội dung của trang web dựa trên đường link dẫn chia sẻ. Open Graph là gì?Đối với giao thức Open Graph, website đóng vai trò như một đối tượng chứa các thuộc tính cần thiết cho một mạng xã hội. Trong đó, người dùng có thể tùy chỉnh các thuộc tính này thông qua plugin hoặc code. Ví dụ: Bạn share một liên kết từ website bất kỳ lên dòng trạng thái trên Facebook. Lúc này, nếu trang web có sử dụng giao thức Open Graph thì đường link chia sẻ ở Facebook sẽ hiển thị đầy đủ ảnh thumbnail, phần mô tả,… Sử dụng Open Graph khi chia sẻ link sẽ hiển thị đầy đủ thumbnail, mô tả,…Các thuộc tính cơ bản của Open GraphĐối với mỗi website sử dùng Open Graph đều chứa các thuộc tính cơ bản, bao gồm:
Open Graph có cần thiết với website không?Đối với website, giao thức Open Graph là một yếu tố cần thiết. Bởi vì giao thức này chính là cầu nối giúp cho website hiển thị một phần trên mạng xã hội. Thông qua đó, người dùng có thể dễ dàng thực hiện các hoạt động quảng cáo web và nhận được nhiều sự tương tác hơn. Cách kiểm tra Facebook Open GraphĐể kiểm tra Facebook Open Graph nhanh chóng và đơn giản, bạn sử dụng công cụ Facebook Debugger với các bước hướng dẫn được chi tiết sau đây: Facebook Debugger là gì?Facebook Debugger là một công cụ nổi bật với khả năng phân tích và kiểm tra các lỗi xuất hiện ở website trong quá trình xử lý og tags. Ngoài ra, ở công cụ này còn có tính năng preview giúp bạn xem trước trạng thái hiển thị của đường link khi chia sẻ trên Facebook. Phân tích và kiểm tra lỗi với Facebook DebuggerCách để sử dụng công cụ Facebook Debugger cũng khá đơn giản, không cần bạn phải đăng ký tài khoản đặc biệt. Thay vào đó, bạn chỉ cần một tài khoản Facebook thông thường là đã có thể đăng nhập và tiến hành kiểm tra Facebook Open Graph. Các bước kiểm tra Open GraphChi tiết các bước kiểm tra Open Graph gồm:
Lưu ý: Facebook sẽ lấy hình ảnh từ trong bộ nhớ cache. Do đó, bạn có thể gặp tình trạng Facebook vẫn hiển thị ảnh cũ trong thẻ og:image dù đã thay ảnh mới. Lúc này, bạn cần xóa cache Facebook bằng công cụ Sharing Debugger. Đây là một công cụ cho phép bạn thu thập và làm mới lại bộ nhớ đệm. Điều này sẽ giúp cho các nội dung luôn cập nhật phiên bản mới nhất mỗi khi chia sẻ website lên Facebook. Ảnh hưởng của Open Graph đến SEOGiao thức Open Graph đóng vai trò quan trọng trong việc thúc đẩy hiệu quả hoạt động SEO web. Bằng cách dựa vào những thuộc tính cơ bản của giao thức này, bài viết cũng như trang web của người dùng được hỗ trợ tối ưu hóa trên công cụ tìm kiếm. Ngoài ra, trong quá trình SEO, Open Graph còn có thể giúp SEOer kiểm soát nội dung chia sẻ lên mạng xã hội, gia tăng tỷ lệ tương tác, nâng cao thứ hạng hiển thị cũng như tỷ lệ chuyển đổi (CTR). Thẻ meta trong Open Graph có nhiệm vụ gì?Thẻ meta Open Graph là một loại thẻ nằm ở phần <head> của trang, có khả năng cung cấp thông tin về trang (meta tag). Người dùng sử dụng thẻ meta Open Graph có thể giúp các mạng xã hội (Facebook, Zalo, Twitter,…) xác định được các thông tin về trang web đã chia sẻ. Không những vậy, thẻ còn cho phép hiển thị các thông tin này mỗi khi có người dùng chia sẻ về trang web trên mạng xã hội. Hiểu đơn giản, thẻ meta Open Graph chính là một loại structured data (dữ liệu có cấu trúc) mà mạng xã hội Facebook có thể hiểu. Thẻ meta Open Graph có nhiệm vụ cung cấp thông tin về trangMột số thẻ Open Graph nâng caoNếu bạn muốn sử dụng Open Graph ở mức độ chuyên sâu hơn thì cần nắm thêm một số thuộc tính nâng cao của giao thức này, bao gồm:
Hướng dẫn chi tiết cách chèn Open Graph vào websiteCó 2 cách để bạn chèn Open Graph vào website đơn giản và dễ dàng, đó là sử dụng plugin và thực hiện thủ công. Cụ thể: Các bước sử dụng plugin trong WordPressĐối với cách chèn này, plugin được sử dụng để cấu hình Open Graph sẽ là Yoast SEO. Chi tiết các thao tác thực hiện bạn có thể tham khảo qua hướng dẫn sau:
Các bước chèn thủ công Open GraphNếu không sử dụng plugin Yoast SEO, bạn cũng có thể thực hiện chèn Open Graph bằng cách thủ công với các bước thực hiện sau:
Các lỗi thường gặp trong Open Graph là gì?Khi thêm thẻ Open Graph vào website, bạn thường gặp phải một số lỗi phổ biến như sau: Người dùng Facebook khi nhấp vào những đường link được chia sẻ từ website thường gặp tình trạng không load được hình ảnh. Điều này được đánh giá là do người dùng chưa tích hợp Facebook Open Graph Meta Data hoặc do bot Facebook trong quá trình thu thập dữ liệu từ link đã xảy ra sự cố về cache, kết nối server,… Lỗi không hiển thị hình ảnh khi share link từ webLỗi Incorrect Open Graph TagsIncorrect Open Graph Tags là lỗi xảy ra do các thẻ og không được hệ thống ghi nhận hoặc thông tin không được hiển thị chính xác. Hướng dẫn tạo thẻ Open Graph nhanh nhấtĐể khởi tạo nhanh chóng thẻ Open Graph, bạn thực hiện theo hướng dẫn sau: Bước 1: Lựa chọn sử dụng một trong số các công cụ hỗ trợ tạo thẻ Open Graph sau:
Bước 2: Điền các thông tin được yêu cầu vào ô trống tương ứng. Sau đó, nhấn Enter để nhận về các đoạn mã cần thiết. Bước 3: Sao chép và dán đoạn code đó vào mã nguồn. Tạo thẻ meta Open Graph với ZaloCác bước khởi tạo thẻ meta Open Graph trên Zalo cũng được thực hiện tương tự như trên Facebook. Ví dụ:
Câu hỏi thường gặpCác thuộc tính của Open Graph là gì?Các thẻ metadata nằm trong phần <head> của website chính là các thuộc tính của Open Graph, bao gồm: Các thuộc tính cơ bản như: – Og:title – Og:type – Og: description – Og:image – Og:url – Og:site_name – fb:admins Các thuộc tính nâng cao như: – og:audio – og:description – og:determiner – og:site_name – og:video Open Graph là gì?Open Graph là giao thức có thể giúp các nền mạng xã hội hiểu, tóm tắt và hiển thị được các nội dung của website dựa trên đường link được chia sẻ lên mạng hội đó. Lời kếtTrên đây là bài viết chia sẻ các thông tin về Open Graph là gì cũng như hướng dẫn cách cài đặt Open Graph nhanh chóng, dễ dàng cho website. Hy vọng bài viết sẽ giúp bạn hiểu và áp dụng thành công giao thức này cho website của mình. Trong quá trình cài đặt, nếu còn chỗ nào vướng mắc, bạn hãy để lại bình luận bên dưới cho mọi người cùng tham khảo và hỗ trợ giải đáp nhé. |