具有自定义图标的社会共享链接

我正在寻找任何可靠的信息,创建自定义共享图标以下。

  • 脸书
  • 推特
  • Google +
  • 领英
  • Pinterest

我看到的所有文档似乎都是关于使用他们的社交喜欢/分享按钮——我认为大多数时候这并不是很吸引人。像 socialite.js 这样的东西有助于解决使用“原生”的 like/share 按钮时出现的一些其他问题(对不起,不知道还能叫它们什么) ,但是说实话,它们并不是很漂亮。

任何参考资料/教程或指南都会很棒。

干杯。

81283 次浏览

对于 Facebook 分享,你可以简单地将这个链接添加到任何对象:

<a href="http://www.facebook.com/sharer.php?u=<url to share>
&t=<title of content>">link or image</a>

剩下的: 对不起,我帮不了你。

Grzegorz 提出的解决方案已经过时了,而且这并不是最好的解决方法。对于 Facebook,您只需要加载 JSSDK (https://developers.facebook.com/docs/reference/javascript/)并在单击自定义按钮时调用 UI feed 方法。关于 UI 方法的更多细节: https://developers.facebook.com/docs/reference/javascript/FB.ui/

Twitter: https://dev.twitter.com/docs/tweet-button#build-your-own

你可以在 LinkedIn、 Google + 等网站上找到其他的选择,但是我不知道这些网站是否提供了其他的选择。

继续搜索,你可能没有挖得足够深,我花了2分钟才找到 Twitter 的链接:)

社交链接的网址

推特

https://twitter.com/intent/tweet?text=[TEXT]

脸书

http://www.facebook.com/share.php?u=[URL]&title=[TITLE]

StumbleUpon

http://www.stumbleupon.com/submit?url=[URL]&title=[TITLE]

真好吃

http://del.icio.us/post?url=[URL]&title=[TITLE]]&notes=[DESCRIPTION]

领英

http://www.linkedin.com/shareArticle?mini=true&url=[URL]&title=[TITLE]&source=[SOURCE/DOMAIN]

Technorati

http://technorati.com/faves?add=[URL]&title=[TITLE]

Tumblr

http://www.tumblr.com/share?v=3&u=[URL]&t=[TITLE]

Reddit

http://www.reddit.com/submit?url=[URL]&title=[TITLE]

Google书签

http://www.google.com/bookmarks/mark?op=edit&bkmk=[URL]&title=[title]&annotation=[DESCRIPTION]

印象笔记

http://www.evernote.com/clip.action?url=[URL]&title=[TITLE]

只需要快速更新这些链接,这里有一个 Google + 的链接

https://plus.google.com/share?url=[URL]

现在,如果你想在一个新窗口中打开这些链接,只需在 href 的:

onclick="javascript:window.open(this.href,'', 'menubar=no,toolbar=no,resizable=yes,scrollbars=yes,height=600,width=600');return false;"

这个 javascript 代码可以与 Twitter、 Google + 和 Facebook (可能还有其他的,但我还没有测试过其他任何社交网络)一起工作。

WordPress 的例子:

<a href="https://plus.google.com/share?url=<?php the_permalink(); ?>" onclick="javascript:window.open(this.href,'', 'menubar=no,toolbar=no,resizable=yes,scrollbars=yes,height=600,width=600');return false;">Here you can add text, image, whatever.</a>

为了 定制按钮以及 股份计数从不同的社会网络和网址共享服务,您可以使用代理服务器。社交按钮服务器 Meddelare就是这么做的(仅供参考,我是 Meddelare 的开发者)。

Meddelare : 这是一个开源的、自主托管的替代共享服务,比如 AddThis 和 ShareThis。因为您自己运行代理服务器,所以您也是在保护用户的隐私免受社交网络的跟踪。用户只有在决定点击共享按钮时才会选择跟踪——绝不会仅仅因为他们访问了你的页面就隐含地选择跟踪。

有几个版本: 一个 独立服务器您的 Express.js 服务器的中间件和一个单独的 完全自定义解决方案的后端

Screenshot of a Meddelare example

有关从服务器获得的 JSON/JSONP 以及脚本使用情况,请参见 Meddelare 的例子

Twitter 链接格式 http://twitter.com/home?status=[TITLE]+[URL]已经过时,将不再适用于 Twitter iOS 应用程序。

改为使用以下格式

https://twitter.com/intent/tweet?text=[TITLE]+[URL]

来源: Https://dev.twitter.com/web/tweet-button

您所需要的社会媒体自定义共享链接提供如下。

脸书

http://www.facebook.com/sharer.php?u=[EncodedURL]

推特

http://twitter.com/share?text=[TITLE]&url=[URL]

Google +

https://plus.google.com/share?url=[EncodedURL]

领英

http://www.linkedin.com/shareArticle?mini=true&url=[EncodedURL]

Pinterest

http://pinterest.com/pin/create/button/?url=[EncodedURL]&media={[MEDIA]}&description=[TITLE]

你可以从这里找到一些其他社会媒体自定义 URL 链接和实现指南 -如何创建自定义社交共享链接

这里的所有答案似乎都没有真正回答 OP 的问题,因此我尝试这样做:

许多社交网络实际上提供了 指南关于如何使用他们的徽标,分享图标和其他链接。在这个问题上,有些人比其他人更灵活。

当然,在大多数情况下,他们不会真正适合你的设计,你可能想要自定义他们与你自己的主题/网站颜色。

“自己承担风险”可能是你得到的最好答案。

我不是律师(所以这不是法律建议!)但从我在不同文章中读到的情况来看,一些具有定制社交网络标志的 销售图标集的网站被要求从产品列表中删除它们。

Facebook、 Twitter 或者其他社交网络公司很少会因为你为你的个人博客或网站定制了他们的图标或标志而起诉你(尽管他们可能会这么做) ,但是如果你想掩饰自己,你可能会考虑遵循他们的指导方针..。

以下是一些社交网络品牌指南的链接:

你可以在网上搜索 “[品牌]品牌指南”,找到几乎所有社交网络的这些指导方针。

如欲阅读更多资料,请参阅以下资料来源:

希望这个能帮上忙。

这是我对 facebook 的解决方案,我想你也可以对其他社交网络进行类似的操作。

function customFShare() {
$like_results = @file_get_contents('http://graph.facebook.com/'. get_permalink());
$like_array = json_decode($like_results, true);
return (isset($like_array['shares']) ) ? $like_array['shares'] : "0";
}
function fShareButton() {
return "<a data-share='http://www.facebook.com/sharer/sharer.php?u=". $your_url_here ."' href='#' rel='nofollow'><i>Icon</i> <span>". customFShare() ."</span></a>";
}

超文本标示语言

<div class="facebook-share">
<?php echo fShareButton(); ?>
</div>

JQuery

jQuery(document).on("click",".facebook-share > a", function (e) {
e.preventDefault();
var winHeight = 350,
winWidth = 520,
winTop = (screen.height / 2) - (winHeight / 2),
winLeft = (screen.width / 2) - (winWidth / 2),
link = $(this).data('share');
window.open(link, 'sharer', 'top=' + winTop + ',left=' + winLeft + ',toolbar=0,status=0,width=' + winWidth + ',height=' + winHeight);
});

你会得到很好的 Facebook 图标和计数器按钮。

社交分享 URL ~ On Github!

enter image description here

一个定期更新和重新测试的 github 回购,列出了大约50或60个服务。

Https://github.com/bradvin/social-share-urls

这比公认的答案要好得多。NewsVine、 Delicious、 Slashdot、 Ping.fm 等等,现在都不存在。另外,一些重要的东西不见了,比如 Skype 等等。.