粘贴 HTML 即可预览 Facebook、Twitter、LinkedIn、Slack 上的分享卡片效果。
HTML 在浏览器内解析,不会上传到服务器,也不会抓取远程 URL。
How to brew the perfect cup of green tea
A complete guide to brewing Japanese green tea, covering water temperature, steep time, and tea-to-water ratios.
| htmlTitle | How to brew the perfect cup of green tea |
| metaDescription | A complete guide to brewing Japanese green tea, covering water temperature, steep time, and tea-to-water ratios. |
| title | How to brew the perfect cup of green tea |
| description | A complete guide to brewing Japanese green tea, covering water temperature, steep time, and tea-to-water ratios. |
| image | https://example.com/og/green-tea.jpg |
| url | https://example.com/blog/green-tea-guide |
| type | article |
| siteName | Tea Journal |
| twitterCard | summary_large_image |
| twitterSite | @teajournal |
| canonical | https://example.com/blog/green-tea-guide |
为 Article、Product、FAQ、LocalBusiness、Person、Event、Breadcrumbs 生成 schema.org JSON-LD 标记。表单驱动，复制即用。
构建带有 utm_source / utm_medium / utm_campaign 参数的可追踪 URL。自动生成 QR 码。兼容 GA4 / Universal Analytics。
在浏览器中验证 sitemap.xml 的结构、lastmod 格式、hreflang 备用项以及 URL 数量上限。
模拟 Googlebot 等爬虫将 robots.txt 的 Allow/Disallow 规则应用到具体 URL 的行为。
当您在 Facebook、LinkedIn、Slack、Discord 上分享 URL,或在 Twitter/X 发布链接时,平台会读取您 HTML <head> 中的 Open Graph(og:*)与 Twitter Card(twitter:*)meta 标签,渲染出带有标题、描述和图片的预览卡片。缺少 og:image 可能令点击率下降 5–10 倍,超过 70 个字符的标题会被明显截断。Open Graph 预览工具允许您粘贴任意 HTML,直观查看四大平台将如何渲染分享卡片 — 不会上传到任何服务器,也不会远程抓取 URL。验证器还会标记缺失的必备标签、过长的标题/描述、使用相对路径的 og:image,以及未设置的 Twitter Card 类型。可在开发阶段提交 meta 变更前使用,或在部署后用于验证 CMS、无头框架、静态站点生成器输出的元数据是否符合预期。
Facebook、LinkedIn、Slack 三者所需的基础属性相同: og:title(50–60 字符)、og:description(150–200 字符)、og:image(绝对 https URL,建议 1200×630)以及 og:url(canonical)。对于 Twitter/X,如果希望显示大图预览而非小缩略图,还需额外将 twitter:card 设置为 "summary_large_image"。og:site_name、og:type、twitter:site/twitter:creator 为推荐项但非必需。