Question

是否有一个好看的sharethis / addthis / addtoany替代方案来共享一个没有javascript的网址？

赞：<a href="http://addthis.com?url=[...]">share</a>

我已经发现了这个：http://www.addthis.com/bookmark.php?url=google.com&title=google，但它非常难看并且有太多选择。

更新：我不是在寻找HTML，而是寻找像http://www.addthis.com/bookmark.php?url=google.com&title=google这样的服务，我可以在这里提供网址，社交分享网站可以处理facebook，twitter和google +的链接。

我对addthis.com/bookmark.php唯一的问题是它很难看并且有太多选项。我只想要链接到facebook，twitter和google +。

Answer 1

这是你想要的吗？纯粹的CSS与一些结冰动画效果。没有JS。

www.jsfiddle.net/Godinall/UH8sx/

<强> HTML ：

<div id="show_social">Add to Social Networks
<div id="social_share">
    <p id="socialicons">
      <a href="http://www.facebook.com/SuperRodUK"><img src="http://3.bp.blogspot.com/-eG9bPvyOXro/UPBYTmI8VEI/AAAAAAAAJqI/TFBZzBxJ59c/s1600/NBT+facebook+icon.png" /></a>  
      <a href="http://www.twitter.com/SuperRodUK"><img src="http://4.bp.blogspot.com/-dB0P2JmL6QA/UPBYVfvhyII/AAAAAAAAJqU/HFD5UeTJck8/s1600/NBT+twitter+icon.png" /></a>  
      <a href="https://plus.google.com/ken@super-rod.co.uk"><img src="http://1.bp.blogspot.com/-XU8OI90JZQc/UPBYUKmev_I/AAAAAAAAJqM/FPgdcMimraQ/s1600/NBT+google+plus+icon.png" /></a>  
      <a href="http://www.feeds.feedburner.com/"><img src="http://4.bp.blogspot.com/-YPkJD-sewC8/UPBYWk9dzBI/AAAAAAAAJqg/D3FVlAJz4VE/s1600/NBT+rss+feed+icon.png" /></a> 
      <a href="http://www.youtube.com/user/SuperRodUK"><img src="http://1.bp.blogspot.com/-YNToKMeHx9A/UPBYWVeeq5I/AAAAAAAAJqc/HEpC_PsZBsY/s1600/NBT+youtube+icon.png" /></a> 
    </p>
</div>
    </div>

<强> CSS ：

#show_social{width:400px;background:rgba(100,100,100,0.2);text-align:center;font-family:Helvetica;border:1px solid rgba(10,10,10,0.5)}
#social_share{display:none;}
#show_social:hover #social_share{display:block;}
#socialicons img {
     -moz-transition: all 0.8s ease-in-out;
     -webkit-transition: all 0.8s ease-in-out;
     -o-transition: all 0.8s ease-in-out;
     -ms-transition: all 0.8s ease-in-out;
     transition: all 0.8s ease-in-out;
 }
 #socialicons img:hover {
     -moz-transform: rotate(360deg);
     -webkit-transform: rotate(360deg);
     -o-transform: rotate(360deg);
     -ms-transform: rotate(360deg);
     transform: rotate(360deg);
 }

如果您想使用网络服务，他们无论如何都会跟踪您的使用情况。至于AddThis，它们确实有更好的布局和更简单的选项，请参阅以下链接：https://www.addthis.com/get/smart-layers?frm=hp，它被称为智能层，仅以您喜欢的3种社交服务开始，并且布局是HTML5友好的。

我之前给你的演示也可以修改为只实现你想要的3个社交服务，你可以用你自己的处理器替换我的处理程序。您可以根据需要调整外观。

Answer 2

这是你要找的吗？从UX点来看，这是非常糟糕的，没有人喜欢打开一个新窗口，它可能只是一个弹出窗口。

 <a href="http://twitter.com/share?url=http://helloworld.com/blog&text=Hello World" target="_blank">Tweet This button</a>

好看的sharethis / addthis / addtoany没有javascript

2 个答案: