1.1.4 • Published 6 years ago
social-sharer v1.1.4
SocialSharer
最 Pure 的社会化分享按钮
演示
安装
npm install social-sharer --save使用
<!-- HTML -->
<div class="social-sharer"></div>
<!-- CSS (optional) -->
<link href="../dist/social-sharer.min.css">
<!-- JS -->
<script src="../dist/social-sharer.min.js"></script>
<script>
var socialSharer = new SocialSharer(".social-sharer");
</script>
<!-- jQuery -->
<script src="../dist/jquery.social-sharer.min.js"></script>
<script>
$(".social-sharer").socialSharer();
</script>如果元素内包含带 data-service 属性的元素，插件会直接使用这些元素，并忽选项中的services 参数：
<div class="social-sharer">
<a data-service="weibo" title="分享到微博"></a>
<a data-service="wechat" title="分享到微信"></a>
<a data-service="qq" title="分享给QQ好友"></a>
<a data-service="yingxiang" title="分享到印象笔记"></a>
</div>选项
| 参数 | 类型 | 默认值 | 描述 |
|---|---|---|---|
| url | string | "" | 网址，dataset.url > meta[property="og:url"] > link[rel="canonical"] > location.href |
| title | string | "" | 标题，dataset.title > meta[property="og:title"] > document.title |
| description | string | "" | 描述，dataset.description > meta[property="og:description"] > meta[name="description"] |
| pic | string | "" | 图片，dataset.pic > meta[property="og:image"] > document.images[0] |
| source | string | "" | 网站名称，meta[property="og:site_name"] |
| weiboKey | string | "" | 显示微博来源的 AppKey |
| twitterVia | string | "" | Twitter 参数 |
| twitterHashTags | string | "" | 参见：https://dev.twitter.com/web/tweet-button/web-intent |
| wechatTitle | string | "分享到微信" | 微信二维码标题 |
| wechatTip | string | "用微信「扫一扫」上方二维码即可。" | 微信二维码提示文字 |
| qrcodeSize | number | 260 | 微信二维码尺寸 |
| services | array | "weibo", "wechat", "qzone", "qq", "douban", "yingxiang" | 要使用的服务列表，目前支持：weibo, wechat, qzone, qq, douban, yingxiang, renren, facebook, twitter, gplus, linkedin, evernote, email, webshare |
| classNamePrefix | string | "icon icon-" | 分享图标的 CSS 类前缀 |
| onRender | function | null | 生成分享图标后会调用该函数，参数：icon:element, serviceName:string |
| onClick | function | null | 点击分享图标后会调用该函数，参数：event:object, serviceName:string |
你可以通过给元素设置 data-* 属性来设置对应选项（function类型除外）。例如：
<div class="social-sharer" data-title="标题" data-weibo-key="1234567" data-services="qq,weibo,linkedin"></div>方法
静态方法
SocialSharer.addService(serviceName:string, urlTemplate:string)
添加服务
实例方法
getURL(serviceName:string)
返回服务的分享地址（微信返回二维码地址）