Tổng quan
Công cụ dành cho nhà phát triển để mô phỏng kết quả hiển thị OGP. Kết quả localhost cũng có thể được xem trước dễ dàng.
OGP Dev Tool gives web developers an instant preview of how a page's Open Graph Protocol (OGP) metadata will appear on social networks and popular UI component libraries — all without leaving Chrome. Open the DevTools panel (F12 → OGP tab), navigate to any page, and see a full breakdown of every OGP tag alongside live-rendered previews. ────────────────────────── 🔍 What you can inspect ────────────────────────── OGP Dev Tool reads and displays all major OGP-related meta tags including: • og:title, og:description, og:image, og:url, og:type, og:locale • og:image:width / og:image:height / og:image:type • og:site_name, og:video, og:audio • twitter:card, twitter:title, twitter:description, twitter:image, twitter:creator • fb:app_id, article:author, article:published_time, and more ────────────────────────── 📱 Live social & UI previews ────────────────────────── See exactly how your metadata renders in five preview styles: • X (Twitter) — card preview with image, title, and description • Facebook — link preview card • shadcn/ui — clean card component • Ant Design — card component • Material UI — card component ────────────────────────── ⭐ Key benefits ────────────────────────── ✅ Works on localhost — test OGP before deploying; no tunnels or staging servers required ✅ No page reload needed — hit the Reload button in the panel to re-read metadata instantly ✅ Copy any value to clipboard with one click ✅ Dark mode support — follows your DevTools preference ✅ Three UI languages — English, 日本語, 中文 ✅ Completely local — no data is ever sent to external servers; all inspection happens in your browser ────────────────────────── 👨💻 Who is this for? ────────────────────────── Front-end developers, SEO engineers, and content teams who need a fast feedback loop when writing or debugging OGP tags. Instead of sharing a URL with a social debugger tool and waiting for a re-scrape, you get instant visual feedback right inside DevTools on any page — including localhost. ────────────────────────── 🔒 Permissions ────────────────────────── • storage — saves your language and theme preferences locally • Access to all URLs — required to inspect OGP metadata on any page you visit Source code: https://github.com/Uno-Takashi/OGP-Dev-Tool
Chi tiết
- Phiên bản2.2.0
- Đã cập nhật25 tháng 5, 2026
- Nhà cung cấpU-NOT
- Kích thước813KiB
- Ngôn ngữ15 ngôn ngữ
- Nhà phát triển
Email
euno.eng@gmail.com - Người bán phi thương mạiNhà phát triển này không tự nhận mình là người bán. Đối với người tiêu dùng ở Liên minh Châu Âu, xin lưu ý rằng các quyền của người tiêu dùng không được áp dụng trong hợp đồng giữa bạn và nhà phát triển này.
Quyền riêng tư
Nhà phát triển này tuyên bố rằng dữ liệu của bạn
- Không được bán cho bên thứ ba, ngoài những trường hợp sử dụng đã được phê duyệt
- Không được sử dụng hoặc chuyển nhượng cho các mục đích không liên quan đến chức năng chính của mặt hàng
- Không được sử dụng hoặc chuyển nhượng để xác định khả năng thanh toán nợ hoặc phục vụ mục đích cho vay
