从卡片入门

指南

指南 contents

入门指南

从卡片入门
卡片和内容属性
URL 爬行与缓存
卡片显示
推文中包含多个 URL
Twitter 卡片和开放图谱

从卡片入门

要从实施卡片标记开始，你需要在本页标题部分添加以下 HTML 标记，从而为你的内容指定卡片类型：

<meta name="twitter:card" content="summary"></meta>

卡片属性为简单的键值对，各键值均在 HTML 元标记中定义，如上所示。属性集的组合定义了 Twitter 上的整体卡片体验，各种卡片类型都支持并要求一组特定的属性。

所有卡片均有一个基本的共同属性——卡片类型值：

卡片属性	说明
`twitter:card`	卡片类型，可以是“summary”、“summary_large_image”、“app”或“player”中的任何一种。

每页只支持一种卡片类型。如果页面上有一个twitter:card以上的值，则按照先后顺序，以“最后”一个值为准。

卡片和内容属性

各卡片均有内置的内容属性。针对你指定的内容，该属性将显示在合适的 Twitter 账号。用户能够直接从卡片上关注和查看有该属性的账号的资料。属性有两种：

网站属性：表示内容所发布网站或平台的 Twitter 账号。请注意，网站的不同页面/部分可能会设置单独的 Twitter 账号，而最合适的账号应用于为用户提供最佳的情境。例如，nytimes.com 可以为头版文章设置“@nytimes”的网站属性，而为艺术和娱乐版块设置“@NYTArts”的网站属性。

创建者属性：表示在卡片内创建内容的个体用户。此属性适用于大图像卡片的概要。

使用以下属性设置卡片属性：

卡片属性	说明	必填
`twitter:site`	卡片页脚中所使用网站的 @username。	否
`twitter:creator`	内容创建者/作者的 @username。	否

URL 爬行和缓存

当扫描 URL 时，Twitter 爬虫遵守 Google 的 robots.txt 规范。如果带卡片标记的页面被屏蔽，则不会显示任何卡片。如果图像 URL 被屏蔽，则不会显示任何缩略图或照片。

Twitter 使用 Twitterbot（版本，例如 Twitterbot/1.0）的用户代理。用户代理可用于在robots.txt文件中创建例外情境。

例如，此处的robots.txt不允许所有机器人爬行，但 Twitter 的抓取器除外：

User-agent: Twitterbot
Disallow:

User-agent: *
Disallow: /

这里还有一个例子，它规定了哪些目录允许 Twitterbot 爬行（在这种情况下，除图像和档案目录外，不允许其他所有爬行）：

User-agent: Twitterbot
Disallow: *

Allow: /images
Allow: /archives

服务器的robots.txt文件必须保存为 ASCII 字符编码的纯文本。为验证这一要求，运行以下命令：

$ file -I robots.txt
robots.txt: text/plain; charset=us-ascii

当带卡片标记页面的链接发布在推文中后，Twitter 会将内容缓存 7 天。

如果你遇到推文中的卡片未能正常显示的问题，那么请参见卡片疑难解答指南。

卡片显示

只有在时间线中扩展推文（在网页上）或在推文的个人永久链接页面查看推文（通过网页或移动设备在时间线中点击日期）时，才会出现由元标签生成的 Twitter 卡片。

在有限的情况下，卡片可能出现在时间线上，例如在 Twitter 上发布图像、广告格式和 Twitter 发起的试验。

如果你希望将媒体（照片、视频和卡片）加入时间线，则可以考虑以下任一选项：

账号可以将推文置顶于其时间线上，从而自动扩展推文并显示卡片。（这只能在网页上实现）。
对于照片和 GIF 动图，可直接将媒体和推文一起上传，或考虑使用 Twitter API 来上传媒体。
对于带行动号召的广告格式，请访问网站卡片 Twitter 广告。

推文中包含多个 URL

在某些情况下，用户可能希望发包含多个 URL 的推文。在一条推文中，只能显示一张卡片。以下为处理多个 URL 时的先后顺序：

附于推文的图像或媒体，其优先权高于附于 URL 的任何卡片。
带卡片的 URL，按照在推文中的显示顺序从第一个到最后一个进行处理。

Twitter 卡片和开放图谱

Twitter 卡片标签看上去与开放图谱标签相似，基于与开放图谱协议相同的约定。当使用开放图谱协议描述页面上的数据时，很容易生成 Twitter 卡片，而无需复制标签和数据。当 Twitter 卡片处理器在页面上寻找标签时，它会首先检查 Twitter 特定的属性；如果不存在，则会返回受支持的开放图谱属性。它允许在页面上独立定义这两种属性，并最大程度减少描述内容和体验所需的标记复制量。

请注意，尽管开放图谱建议通过<html prefix="og: http://ogp.me/ns#">指定 “og” RDFa Core 1.1 CURIE 前缀映射，但对于 Twitter 卡片及其在 HTML 母体元素名称属性中的twitter:前缀使用，并不要求此等标记。开放图谱协议也为标记 (<meta property="og:image" content="http://example.com/ogp.jpg"/>) 规定使用property和content属性，但 Twitter 卡片使用的是name和content。Twitter 的解析器会返回使用property和content。因此，如果已经存在开放图谱协议标记，则无需对其修改。

以下示例结合使用 Twitter 和开放图谱标签来定义摘要卡片：

<meta name="twitter:card" content="summary" />
<meta name="twitter:site" content="@nytimesbits" />
<meta name="twitter:creator" content="@nickbilton" />
<meta property="og:url" content="http://bits.blogs.nytimes.com/2011/12/08/a-twitter-for-my-sister/" />
<meta property="og:title" content="A Twitter for My Sister" />
<meta property="og:description" content="In the early days, Twitter grew so quickly that it was almost impossible to add new features because engineers spent their time trying to keep the rocket ship from stalling." />
<meta property="og:image" content="http://graphics8.nytimes.com/images/2011/12/08/technology/bits-newtwitter/bits-newtwitter-tmagArticle.jpg" />