创建自定义推特按钮的最简单方法是什么?

3

我正在尝试为我的网站上的每篇文章设计一个自定义的Twitter分享按钮。以下是我目前正在使用的原始Twitter代码,它可以正常工作。我希望将其更改为具有我自己设计的背景图像的自定义设计,就像npr.org一样。

<a href="https://twitter.com/share" class="twitter-share-button" data-url="http://www.example.com{$story_url}" data-text="{$title_short}" data-count="none">Tweet</a>

{literal}<script>!function(d,s,id){var js,fjs=d.getElementsByTagName(s)[0],p=/^http:/.test(d.location)?'http':'https';if(!d.getElementById(id)){js=d.createElement(s);js.id=id;js.src=p+'://platform.twitter.com/widgets.js';fjs.parentNode.insertBefore(js,fjs);}}(document, 'script', 'twitter-wjs');</script>{/literal}

下面的(在评论中)自定义设计代码有效,但是当我推特时,它没有标题。如果有人能帮忙解决这个问题就太好了。

推特


以下自定义设计代码可以正常工作,但是当我在推特上分享时,标题会消失。如果有人能帮忙解决这个问题,那就太好了。<a href="http://twitter.com/share?url=http://www.example.com{$story_url}" data-text="{$title_short}" data-count="none" target="_blank"> <div> <img src="/images/custom-logo.jpg"> <span>Twitter</span> </div> </a> - doomla
1个回答

1

关于您在评论中发布的代码:当您不使用官方Twitter类和Javascript时,数据参数将无法正常工作。然后,您需要将所有内容包含在链接URL中,并确保从消息中转义空格等。这对我有效(在Ruby中):

<% tw_text = "I just finished lesson #{@lesson} of unit #{@unit} on LearnYu.com! #Chinese " %>
<% tw_text = URI.escape(tw_text, Regexp.new("[^#{URI::PATTERN::UNRESERVED}]")) %>
<a href="https://twitter.com/share?url=http://www.learnyu.com&via=LearnYu&text=<%= tw_text %>" target="_blank"><img src="/assets/twitter_button.jpg" alt="Share this on Twitter!" /></a>

网页内容由stack overflow 提供, 点击上面的
可以查看英文原文,
原文链接