问题标签 [twitter-card]

For questions regarding programming in ECMAScript (JavaScript/JS) and its various dialects/implementations (excluding ActionScript). Note JavaScript is NOT the same as Java! Please include all relevant tags on your question; e.g., [node.js], [jquery], [json], [reactjs], [angular], [ember.js], [vue.js], [typescript], [svelte], etc.

0 投票
1 回答
675 浏览

angular - angular 2 推特玩家卡

我正在尝试为 Angular 2 项目实现 twitter 播放器卡。

根据文档https://dev.twitter.com/cards/types/player

以及示例代码https://github.com/twitterdev/cards-player-samples

我可以为当前视图动态创建元标记。但是每个玩家卡都有放置音频/视频源的容器。

此来源与我通过元标记 name="twitter:player:stream" 发送的来源不兼容

我的标签是正确的(与下面的示例几乎相同,但带有我的网址)

其中播放器是另一个从服务更新源视频的组件

服务导入,价值可见

但元标签和源视频在 url 中不可见(我不能在每个帖子中粘贴超过 2 个 url,这就是它格式错误的原因)

卡-dev.twitter.com/validator

除了我只得到了成功的消息

有谁知道如何使用 Angular2 实现 twitter 游戏卡?

我以为我已经足够接近了,但也许还有另一种解决方案。

0 投票
0 回答
53 浏览

twitter - twitter 不遵循链接的 CARD 元标记 (OGP) 第一次使用它后记

我已经为推特卡添加了必要的元标记,并且 Cardtype 是“摘要”。当我尝试发布任何 URL 时,它第一次不遵循 CARD 元标记 (OGP) 的链接。它只是按原样显示。现在,当我再次尝试相同的链接时,它可以正常工作并显示预期的结果。

我也在另一个网站上试过这个。它的行为是一样的吗?这背后有什么原因吗?为什么我第一次尝试任何链接时看不到 Twitter CARD 的效果?

0 投票
1 回答
633 浏览

twitter - 带有大图像的 Twitter 摘要卡不起作用

我已经使用了上述所有元标记,但图像仍然只显示为摘要卡,而不是显示带有大图像的摘要卡。

0 投票
1 回答
9023 浏览

php - 如何修复“无法呈现卡片预览”推特错误?

我正在尝试在我的网站上实现 twitter 共享。为此,我添加了这些元标记:

当我尝试使用 twitter 卡验证器检查卡预览时。我收到此错误:错误:获取页面失败,因为它被 robots.txt 拒绝。

为了解决这个问题。我在服务器上的机器人文件中添加了这些行:

但我仍然遇到这个问题。请帮我解决这个问题。

0 投票
2 回答
2239 浏览

twitter - Twitter Card 在 Card Validator 中有效,但在共享页面时无效,除非它首先经过验证

我正在尝试制作一些新闻页面,以在 Twitter 上共享时显示带有图像(summary_large_image)的 Twitter Card。我在页面上添加了必要的元标记。验证器说一切都很好,实际上,当我在验证后共享页面时,它在 Twitter 上也显示得很好。

问题是,如果我共享另一个页面,而没有先进入 Card Validator,则该卡不会出现在 Twitter 上。如果我之后使用页面 URL 转到 Card Validator,它将使卡片出现在以前共享的推文和新推文中。

共享页面即使在数十小时后也没有卡片,除非我使用卡片验证器对其进行验证。我显然不能指望普通用户每次想要共享页面时都在卡片验证器中复制/粘贴 URL,所以我一定遗漏了一些东西。

这是一个不起作用的示例推文:https ://twitter.com/BertrandHilaire/status/857855909447569408

这是我写这个问题时它的呈现方式: 没有卡片的推文显示

请注意,如果有人在验证器中验证 URL,它可能会开始工作。

这是验证器的输出(对于另一个页面):

在日志区域:

感谢您的输入,我没有想法!

0 投票
1 回答
1011 浏览

amp-html - 如何用 amp-twitter 替换 AMP 页面中嵌入的 Twitter 卡片?

我正在尝试用适合 AMP 的版本替换嵌入式推文卡。

试图取代这个

<blockquote class="twitter-tweet" data-lang="en"><p lang="eu" dir="ltr">An itibari ile <a href="tweet_url">[tweet url]</a> <a href="https://twitter.com/hashtag/paratic?src=hash">#paratic</a> <a href="https://twitter.com/ParaticCom">@ParaticCom</a> <a href="https://tweet_url">pic.twitter.com/NpFDB7LTJQ</a></p>&mdash; Onur Celik (@onurcelik66) <a href="https://twitter.com/onurcelik66/status/856521132664643584">April 24, 2017</a></blockquote><script async src="//platform.twitter.com/widgets.js" charset="utf-8"></script>

有了这个

<amp-twitter width='390' height='330' layout='responsive' data-tweetid='856521132664643584'></amp-twitter>

我不能在 AMP 页面上使用 JavaScript,所以我必须使用 PHP。这里有人可以帮忙吗?

0 投票
4 回答
12164 浏览

facebook-opengraph - Twitter Cards:“未找到卡片(卡片错误)”

在 Twitter 上,我在发布我的网站https://startcrowd.club时无法显示图片卡, 但它在 Facebook 上运行良好。

我想出示这张卡片:http ://startcrowd.club/images/startcrowdimage.jpg

我尝试了https://cards-dev.twitter.com/validator并得到:

信息:成功获取页面
信息:找到 9 个元标记
错误:未找到卡(卡错误)

我的页面https://startcrowd.club/index.html上的相关元标记是:

我遵循的文档是:

https://dev.twitter.com/cards/getting-started

0 投票
1 回答
2347 浏览

html - 图像社交元标签 - property="og:image" name="twitter:image" itemprop="image"

社交网络在从网站中提取标题和描述方面做得很好,因为 URL 是共享的,但对于图像,仍然需要创建自定义元标记:property="og:image" name="twitter:image" itemprop="image". 所以我的问题是这行得通:

所以我不必为我网站上的每个网页创建 3 个不同的元标记。

0 投票
1 回答
44 浏览

facebook-opengraph - 我是否需要 Facebook/twitter 团队的批准才能在我的网站中添加 `og|twitter` 元标记?

我想在第三方网站上添加我网站链接的嵌入式表示。所以,我正在添加oEmbed指向我的网站的链接。此外,我正在向我的网站添加元标记ogtwitter以使嵌入的内容在 Facebook 和 Twitter 网站中可见。

我是否需要获得任何团队FacebookTwitter团队的批准才能使我的ogtwitter标签在他们的网站上可见?

如果不需要批准,他们如何看到og标签twitter?或者我应该如何获得批准将元标记添加到我的网站?

非常感谢任何建议!提前致谢 :-)

0 投票
0 回答
29 浏览

javascript - 从代码修改 Twitter Cars 标记

我有一个带有一堆照片的网络应用程序。如果您转到应用程序的基本网址(例如 /photos),您会看到所有照片的列表,如果您在查询中转到带有特定照片 ID 的网址(/photos?id=34343),应用程序将显示一个视图那张特定的照片。

对于每张照片,可以从 web 应用程序中使用推文中该照片的特定 URL 发布推文。因此,任何阅读推文的人都可以单击链接并访问该照片。这工作得很好。

但是现在我想将照片本身添加到推文中,我不知道该怎么做。我已经阅读了Twitter Cards这似乎是这样做的方式(在我的情况下作为带有大图像的摘要卡)但是卡片的工作方式是为每个网页指定一张卡片,例如

由于我每张照片没有一个网页,但整个网络应用程序只有一个索引页面,是否仍然可以将 Twitter Cards 用于我描述的用例?或者其他一些实现我想要的 Twitter API?

还是我在这里坚持纯文本推文?谢谢!