# SEO 页面：Twitter 卡指导 X (Twitter) 链接预览的 Twitter 卡元标记的实现。如果 Twitter 特定标签丢失，Twitter 会退回到开放图谱；添加两者以获得最佳效果。 **调用时**：**首次使用**时，如果有帮助，请用 1-2 句话开头说明该技能涵盖的内容及其重要性，然后提供主要输出。在 **后续使用** 或当用户要求跳过时，直接转到主输出。 ## 范围（社交共享） * **Twitter Cards** ：X 特定的元标记；控制在 X/Twitter 上共享时链接的显示方式 ## 卡牌类型类型 |使用案例 ---|--- **总结** |带缩略图的小卡片 **摘要大图像** |大的突出图像（推荐；1200×675px） **应用程序** |移动应用推广 **玩家** |视频/音频内容 ## 推荐标签（summary_large_image）标签 |指南 ---|--- **推特：卡** |必需的;大多数页面的“summary_large_image” **推特：标题** |最多 70 个字符；简洁的标题 **推特：描述** |最多 200 个字符；总结 **推特：图片** |绝对网址；每页唯一 **推特：网站** | @网站用户名 **推特：创建者** | @内容创建者的用户名 **推特：图像：替代** |替代文本；最多 420 个字符；可达性 ## 图片要求项目 |指南 ---|--- **纵横比** | 2:1 **最低** | 300×157像素 **推荐** | 1200×675像素 **最大** | 4096×4096像素 **文件大小** | 5MB以下 **格式** | JPG、PNG、WebP、GIF（仅限第一帧）；不支持 SVG ## 常见错误 * 缺少 Twitter 卡标签（没有它们，Twitter 将无法正确显示图像） * 使用相对图像 URL 而不是绝对 https:// * 图片太小或宽高比错误 * 标题/描述太长（被截断） ## 实施 ### Next.js（应用程序路由器）导出常量元数据 = { 推特：{ 卡：'summary_large_image'，标题： '...', 描述：'...', 图片：['https://example.com/twitter.jpg']，网站：'@您的用户名'，创建者：'@authorusername'， }, }; ### HTML（通用） ## 测试 * **X (Twitter)** : [卡验证器]() ## 相关技能 * **social-share-generator** ：用户分享时，分享按钮使用 Twitter 卡进行 X 预览；必须为共享按钮设置卡片才能显示正确的预览 * **开放图** ：OG标签；如果 Twitter 标签丢失，Twitter 将退回到 OG * **title-tag** ：标题标签通常反映 twitter:title * **元描述** ：元描述通常反映 twitter:description * **页面元数据** ：Hreflang，其他元标记 * **twitter-x-posts** ：X 帖子副本和参与度（与链接预览不同）

推特卡

包含技能