使用自定按钮来做社会化分享

三个设计网站，Twitter，Facebook，Google Plus，均是在国内不存在的网站。没关系，我喜欢用，也用的最多，所以就先只放着三个。

在文章单页归档的页面，在文章的底部，版权说明的下面就是分享按钮，如下。

三个按钮，依次是Facebook，Twitter，和Google+。

这三个按钮代替了之前我所设置的，利用Addthis的通用插件所设置的社会化分享按钮，Addthis 的做法是会载入一段 JS ，根据需要执行并显示分享按钮或者其它的的分享统计。

现在的三个按钮相对简单，采用了之前在土木坛子看到的理念，开始尝试的时候想用他的代码的，但后来还是用了直接的图片按钮，加上利用MovableType的模板，把网址和标题等直接写入到链接中的办法。所以说更加简单，更加直接，没有JS。

图片我用的是一个图片包里的图片，圆形的图标文件，png。

这些图标可以到Dreamstale网站免费下载，免费使用到不管是个人项目还是商业项目。 MovableType中的模板里的代码如下：

<div class="share-box">
<div class="share-note">分享到：</div>
<a href="https://www.facebook.com/sharer/sharer.php?u=<$MTEntryPermalink encode_xml="1"$>%23facebook"  onclick="window.open('https://www.facebook.com/sharer/sharer.php?u=<$MTEntryPermalink encode_xml="1"$>%23facebook','popup','width=626,height=436,scrollbars=yes,resizable=no,toolbar=no,directories=no,location=no,menubar=no,status=no,left=0,top=0'); return false"><img class="icons"
  src="//seog2soft-106e.kxcdn.com/icons-rounded/facebook-dreamstale25.png" alt="Share on Facebook"/></a>


<a href="https://twitter.com/intent/tweet?text=<$MTEntryTitle remove_html="1"$>&url=<$MTEntryPermalink encode_xml="1"$>" onclick="window.open('https://twitter.com/intent/tweet?text=<$MTEntryTitle remove_html="1"$>&url=<$MTEntryPermalink encode_xml="1"$>','popup','width=550,height=450,scrollbars=yes,resizable=no,toolbar=no,directories=no,location=no,menubar=no,status=no,left=0,top=0'); return false"><img class="icons"
  src="//seog2soft-106e.kxcdn.com/icons-rounded/twitter-dreamstale71.png" alt="Share on Twitter"/></a> 

<a href="https://plus.google.com/share?url=<$MTEntryPermalink encode_xml="1"$>" onclick="javascript:window.open(this.href,
  '', 'menubar=no,toolbar=no,resizable=yes,scrollbars=yes,height=600,width=600');return false;"><img class="icons"
  src="//seog2soft-106e.kxcdn.com/icons-rounded/google+-dreamstale37.png" alt="Share on Google+"/></a>
</div>