Tan Phat Media

OpenGraph Preview - Xem Trước OG Tags Online

Xem trước meta tags khi chia sẻ link lên mạng xã hội

OpenGraph Preview - Công Cụ Xem Trước Meta Tags Khi Chia Sẻ Link Lên Mạng Xã Hội

Công cụ xem trước OpenGraph meta tags của bất kỳ URL nào online miễn phí. Hiển thị preview chính xác như Facebook và Twitter sẽ hiển thị khi bạn chia sẻ link. Kiểm tra og:title, og:description, og:image, og:url, og:site_name, og:type. Phát hiện meta tags bị thiếu hoặc không tối ưu. Debug social sharing issues. Tối ưu CTR khi share link lên social media.

Tính năng nổi bật

Fetch và hiển thị tất cả OpenGraph meta tags từ URL
Preview chính xác như Facebook sẽ hiển thị
Preview chính xác như Twitter Cards sẽ hiển thị
Hiển thị og:title - tiêu đề khi share
Hiển thị og:description - mô tả khi share
Hiển thị og:image - hình ảnh preview
Hiển thị og:url, og:site_name, og:type
Cảnh báo nếu thiếu meta tags quan trọng
Fallback sang title và meta description nếu không có OG tags
Hiển thị domain từ URL
Xử lý qua proxy để bypass CORS
Không cần đăng nhập, hoàn toàn miễn phí

OpenGraph là gì và tại sao cần kiểm tra trước khi share?

OpenGraph (OG) là giao thức do Facebook tạo ra năm 2010, cho phép website kiểm soát cách hiển thị khi được chia sẻ lên mạng xã hội. Khi bạn share link lên Facebook, Twitter, LinkedIn, Slack, Discord... các nền tảng này sẽ đọc OpenGraph meta tags để tạo preview card với tiêu đề, mô tả và hình ảnh. Nếu meta tags không đúng hoặc thiếu, bài viết của bạn sẽ hiển thị xấu: không có hình ảnh, tiêu đề bị cắt, mô tả không hấp dẫn - dẫn đến ít người click. Công cụ OpenGraph Preview giúp bạn kiểm tra chính xác cách link sẽ hiển thị TRƯỚC khi share, để bạn có thể fix issues và tối ưu CTR.

Lợi ích khi sử dụng

  • Tăng CTR khi share link - preview đẹp = nhiều click hơn
  • Debug social sharing issues - tìm ra tại sao preview không đúng
  • Tối ưu og:image - đảm bảo hình ảnh hiển thị đúng
  • Kiểm tra trước khi launch - không bị embarrassing khi share
  • So sánh Facebook vs Twitter - xem preview trên cả 2 platforms
  • Tiết kiệm thời gian - không cần share thật để test

Cách sử dụng OpenGraph Preview

  1. 1Nhập URL trang web cần kiểm tra vào ô input
  2. 2Nhấn Enter hoặc click nút tìm kiếm
  3. 3Đợi tool fetch HTML của trang (có thể mất vài giây)
  4. 4Xem Meta Data panel: tất cả OG tags được extract
  5. 5Xem Facebook Preview: chính xác như Facebook sẽ hiển thị
  6. 6Xem Twitter Preview: chính xác như Twitter Cards sẽ hiển thị
  7. 7Kiểm tra các tags bị thiếu (hiển thị 'Không có')
  8. 8Nếu cần fix, update meta tags trên website và test lại

Câu hỏi thường gặp (FAQ)

OpenGraph là gì?

OpenGraph (OG) là giao thức metadata do Facebook tạo ra năm 2010. Nó cho phép website kiểm soát cách hiển thị khi được chia sẻ lên mạng xã hội. Các thẻ chính: og:title (tiêu đề), og:description (mô tả), og:image (hình ảnh), og:url (URL canonical), og:type (loại content), og:site_name (tên website).

Kích thước og:image tối ưu là bao nhiêu?

Facebook khuyến nghị 1200x630 pixels (tỷ lệ 1.91:1). Twitter Cards tối ưu ở 1200x600 pixels. Minimum size: 200x200 pixels. Maximum file size: 8MB. Format: JPG, PNG, GIF (không animated). Ảnh quá nhỏ sẽ không hiển thị hoặc bị crop xấu.

Tại sao Facebook không hiển thị đúng preview sau khi update?

Facebook cache OpenGraph data rất mạnh. Sau khi cập nhật meta tags, bạn PHẢI vào Facebook Sharing Debugger (developers.facebook.com/tools/debug) để: 1) Nhập URL, 2) Click 'Debug', 3) Click 'Scrape Again' để force Facebook fetch lại. Nếu không, Facebook sẽ dùng data cũ.

Twitter Cards khác OpenGraph thế nào?

Twitter có hệ thống meta tags riêng: twitter:card (loại card), twitter:title, twitter:description, twitter:image. Tuy nhiên, Twitter sẽ fallback sang OpenGraph nếu không có Twitter tags. Best practice: có cả OG tags và Twitter tags để tối ưu trên mọi platform.

og:type có những giá trị nào?

Các giá trị phổ biến: 'website' (default), 'article' (blog posts), 'product' (e-commerce), 'video.movie', 'music.song', 'book', 'profile'. og:type giúp platforms hiểu loại content và có thể hiển thị UI phù hợp.

Có cần og:url không?

Có. og:url nên là canonical URL của trang. Nó giúp Facebook consolidate likes/shares khi cùng content có nhiều URLs (http vs https, www vs non-www, có trailing slash vs không). og:url nên match với canonical tag.

Làm sao test preview cho trang chưa public?

Tool này cần fetch HTML từ URL public. Với trang chưa deploy, bạn có thể: 1) Deploy lên staging environment, 2) Dùng ngrok để expose localhost, 3) Manually review meta tags trong HTML source.

LinkedIn, Slack có dùng OpenGraph không?

Có. LinkedIn, Slack, Discord, Telegram, WhatsApp và hầu hết platforms đều đọc OpenGraph tags. Một số có thêm proprietary tags (LinkedIn: linkedin:owner) nhưng OG tags là foundation. Optimize OG tags = optimize cho tất cả platforms.

Từ khóa liên quan

opengraph previewog tags checkerfacebook previewtwitter card previewsocial media previewmeta tags checkerog:image testershare preview toolfacebook debugger alternativesocial sharing preview

Hợp tác ngay với Tấn Phát Digital

Chúng tôi không chỉ thiết kế website, mà còn giúp doanh nghiệp xây dựng thương hiệu số mạnh mẽ. Cung cấp dịch vụ thiết kế website trọn gói từ thiết kế đến tối ưu SEO. Hãy liên hệ ngay với Tấn Phát Digital để cùng tạo nên những giải pháp công nghệ đột phá, hiệu quả và bền vững cho doanh nghiệp của bạn tại Hồ Chí Minh.

Công cụ SEO Tools liên quan

Zalo
Facebook
Tấn Phát Digital
Zalo
Facebook