码迷,mamicode.com
首页 > 其他好文 > 详细

添加分享

时间:2017-09-26 16:03:22      阅读:166      评论:0      收藏:0      [点我收藏+]

标签:多平台   images   uuid   child   ica   .com   cal   end   body   

以下案例,均可直接复制到html中,运行看结果,可直接修改应用
 
bshare分享
<!-- ---------------------------单独按钮分享---------------------------- -->
<!-- 引用插分享插件 -->
<script type="text/javascript" charset="utf-8" src="http://static.bshare.cn/b/buttonLite.js#style=-1&amp;uuid=&amp;pophcol=2&amp;lang=zh&text=123"></script>
<!--
     * src,#后面的参数为不同的选项(可选),参考:http://www.bshare.cn/help/apiJsParams
     * 个人用了一下,没有太大的意义,我们没有uuid,有些应用了但是没有效果,可能用法不对,大家可以一起看一下
-->
<h1>单独按钮分享</h1>
<div class="share">
     <!--
          * 自定义的分享按钮
          * 其他分享的代码:http://www.bshare.cn/help/platformNames
     -->
    <a href="javascript:;" onclick="bShare.share(event,‘qzone‘,1);return false;">
        <img src="http://i0.letvimg.com/pay/201504/27/1027/qqzonebg.png"/>
    </a>
    <a href="javascript:;" onclick="bShare.share(event,‘weixin‘,1);return false;">
        <img src="http://i2.letvimg.com/pay/201504/27/1027/weixinbg.png"/>
    </a>
    <a href="javascript:;" onclick="bShare.share(event,‘sinaminiblog‘,1);return false;"/>
        <img src="http://i2.letvimg.com/pay/201504/27/1027/sinabg.png"/>
    </a>
    <!-- 更多平台按钮,(可选择选择性添加) -->
    <a title="更多平台" onclick="javascript:bShare.more(event);return false;" style="cursor:pointer;color:#000;"/>
        <img src="http://static.bshare.cn/frame/images/logos/s4/more.gif" style="height:16px; width:16px; vertical-align:middle;"/>
        <span style="padding-left:2px; vertical-align:middle;">更多平台</span>
     </a>
     <!-- 添加分享次数 (可选择选择性添加)-->
   <span class="BSHARE_COUNT" style="font-size:24px;">0</span>
</div>
<!--
     * 自定义分享链接、标题、摘要及图片等内容
     * 参考:http://www.bshare.cn/help/customShareContent
     * title: "分享的标题,默认为当前页面标题",
     * url: "分享的链接,默认为当前页面URL",
     * summary: "分享的文本摘要,默认为页面Meta标签中description的内容或者用户高亮的内容",
     * pic: "指定分享的图片的链接,目前支持新浪微博,QQ空间,搜狐微博,网易微博,人人网, * 嘀咕,腾讯微博和做啥。"
-->
<script type="text/javascript">
     bShare.addEntry({
         title: "羽泉2014北京圣诞演唱会",
         url: "http://www.letv.com",
         summary: "加入3个月乐视会员,不仅能看《羽泉2014北京圣诞演唱会》,还可领取官方何以礼品",
         pic: "http://i1.letvimg.com/lc03_iscms/201510/15/09/24/01b234e689e04beeae4c1ed7251c36a0.jpg"
     });
</script>
<!-- ---------------------------单独按钮分享end---------------------------- -->
 
 
<!-- ---------------------------一键分享 ---------------------------------- -->
<!-- 引用插分享插件 -->
<script type="text/javascript" charset="utf-8" src="http://static.bshare.cn/b/bsync.js#style=-1"></script>

<h1>一键分享</h1>
<!-- 参数
     * url     可选。分享的链接,默认为当前页面URL。
     * title     可选。分享的标题,默认为当前页面标题。
     * summary     可选。分享的文本摘要,默认为页面Meta标签中description的内容或者用户高亮的内容。
     * pic     可选。图片分享中默认被选中的图片。默认为页面图片中的第一张。
     * pics     可选。分享的图片链接,默认为页面中的图片。
-->
<div class="bsync-custom icon-medium-blue">
     <a title="一键分享到各大微博和社交网络" class="bshare-bsync" onclick="javascript:bSync.share(event, ‘bsharesync‘, {
          url:‘http://www.letv.com‘,
          title:‘羽泉2014北京圣诞演唱会‘,
          summary:‘加入3个月乐视会员,不仅能看《羽泉2014北京圣诞演唱会》,还可领取官方何以礼品~‘,
          pic:‘http://i1.letvimg.com/lc03_iscms/201510/15/09/24/01b234e689e04beeae4c1ed7251c36a0.jpg‘
          })">
     </a>
     <!-- 添加分享次数 (可选择选择性添加)-->
     <span class="BSHARE_COUNT bshare-share-count">0</span>
</div>
 
<!-- ---------------------------一键分享end ---------------------------------- -->
 
 
百度分享
<!-- ---------------------------百度分享---------------------------- -->
 <!doctype html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>百度分享</title>
    <style type="text/css">
        /*再样式上自定义默认按钮图片*/
        .bdshare-button-style0-16 a.bds_tsina{
            background-position: 0 0;
            background: url(http://i0.letvimg.com/pay/201504/27/1027/qqzonebg.png) no-repeat;
            width:52px;
            height:52px;
        }
    </style>
</head>
<body>
<!--
百度分享较为简单,大家可直接到
http://share.baidu.com/code/advance参考
-->
<!-- 分享按钮 -->
<div class="bdsharebuttonbox">
    <a href="#" class="bds_qzone" data-cmd="qzone"></a>
    <a href="#" class="bds_tsina" data-cmd="tsina"></a>
    <a href="#" class="bds_tqq" data-cmd="tqq"></a>
    <a href="#" class="bds_renren" data-cmd="renren"></a>
    <a href="#" class="bds_weixin" data-cmd="weixin"></a>
</div>
<!--
common : {
    bdText : ‘自定义分享内容‘,
    bdDesc : ‘自定义分享摘要‘,
    bdUrl : ‘自定义分享url地址‘,  
    bdPic : ‘自定义分享图片‘
}, -->
<script>
    window._bd_share_config = {
        "common": {
            "bdText": "hello123456",
            "bdDesc":"111",
            "bdUrl":"http://www.letv.com",
            "bdPic": "http://i1.letvimg.com/lc03_iscms/201510/15/09/24/01b234e689e04beeae4c1ed7251c36a0.jpg",
        },
        "share": {
        },
        "image": {"viewList": ["qzone", "tsina", "tqq", "renren", "weixin"], "viewText": "分享到:", "viewSize": "16"},
        "selectShare": {"bdContainerClass": null, "bdSelectMiniList": ["qzone", "tsina", "tqq", "renren", "weixin"]}
    };
    document.body.appendChild(document.createElement(‘script‘)).src = ‘http://bdimg.share.baidu.com/static/api/js/share.js?v=89860593.js?cdnversion=‘ + ~(-new Date() / 36e5);
</script>
</body>
</html>

 

添加分享

标签:多平台   images   uuid   child   ica   .com   cal   end   body   

原文地址:http://www.cnblogs.com/qq735675958/p/7596951.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!