【问题标题】:Share the link , title and one image in custom twitter share icon在自定义 Twitter 分享图标中分享链接、标题和一张图片
【发布时间】:2015-07-06 04:33:10
【问题描述】:

这是自定义推特图标代码:

HTML:

<i id="twitter_share" class="fa fa-twitter fs20" style="position: relative; bottom: 4px;"></i>

还有 Jquery:

$('#twitter_share').click(function (e) {
    e.preventDefault();
    var loc = "<?= base_url(uri_string()); ?>";
    var title = "<?= $video->title; ?>";
    window.open('http://twitter.com/share?url=' + loc + '&text=' + title + '&', 'twitterwindow', 'height=450, width=550, top=' + ($(window).height() / 2 - 225) + ', left=' + $(window).width() / 2 + ', toolbar=0, location=0, menubar=0, directories=0, scrollbars=0');
});

它适用于 url 和标题。问题是,我怎样才能分享一张图片呢?

非常感谢您的帮助。

更新:在 facebook 中参考 在 facebook 我可以分享这样的内容,也可以在 twitter 上完成吗?谢谢。 !

【问题讨论】:

    标签: javascript jquery html twitter social-networking


    【解决方案1】:

    图片来自您的 HTML 标记,当有人发布您的网址时,Twitter 会抓取该标记。

    Twitter 将伴随推文的元信息集合称为卡片,在其出现在网络上之前需要得到他们的批准。

    1. 好好阅读Twitter Cards Developer 页面
    2. 选择一张合适的卡片(summary_large_image 是一张不错的卡片)并在 HTML 的头部包含合适的 twitter 元标记
    3. Cards Validator 页面上验证您的卡
    4. 一旦您的域被列入白名单,任何带有您网址的推文也将包含您的卡片

    【讨论】:

    • 感谢帮助。你提到的图片需要经过twitter批准,那我如何分享动态内容?
    • 图片不需要被批准,只需要你的域。它也是自动的,您通常会在几分钟内收到一封电子邮件。这是卡验证的一部分:cards-dev.twitter.com/validator
    • 谢谢,现在是白名单,剩下的唯一问题是如何创建分享对话框
    • 如果这样 :gpiot.s1.cotidia.com/twitter-share-demo ,那么对话框没有分享图片预览
    • 这些说明可以正常工作,或者您可以使用推文按钮 dev.twitter.com/web/tweet-button。该图像将在推文发布后显示。如果您想查看它的外观,并确保您的图像被正确嵌入,请使用验证器(上面的链接)
    【解决方案2】:

    我搜索了一些解决方案,一个解决方案是使用Twitter Cards

    也许这个帖子会帮助你Twitter - share button, but with image

    【讨论】: