• 欢迎访问亿网部落,推荐使用最新版火狐浏览器和Chrome浏览器访问本网站 QQ群
  • 如果您觉得本站非常有看点,那么赶紧使用Ctrl+D 收藏亿网部落吧!
  • 欢迎光临亿网部落 www.26yi.com 互联网分享精神,专注收藏分享!
  • 欢迎加入亿网部落 官方QQ群 第一时间通知最新更新的资源! ①群:xxx ②群:xxx
  • 亿网部落 广告位 火热招商中 原价20元/月 现价只需10/月 需要联系QQ:476507773

为WordPress添加侧边跟随百度分享按钮(含划词分享、图片分享效果)

wp教程 亿网部落 4年前 (2015-03-07) 1643次浏览 已收录

.新建一个文件 share.php,然后把如下代码粘贴到其中:

<div id="share">
    <div class="share_top">
        <i class="lt"></i>
    </div>
    <div class="share">
        <div class="bdsharebuttonbox">
            <a href="#" class="bds_more" data-cmd="more"></a>
            <a title="分享到 QQ 空间" href="#" class="bds_qzone" data-cmd="qzone"></a>
            <a title="分享到新浪微博" href="#" class="bds_tsina" data-cmd="tsina"></a>
            <a title="分享到腾讯微博" href="#" class="bds_tqq" data-cmd="tqq"></a>
            <a title="分享到人人网" href="#" class="bds_renren" data-cmd="renren"></a>
            <a title="分享到微信" href="#" class="bds_weixin" data-cmd="weixin"></a>
        </div>
        <div class="clear"></div>
    </div>
    <div class="share_bottom">
        <i class="lb"></i>
    </div>
</div>
<script>window._bd_share_config={"common":{"bdSnsKey":{},"bdText":"","bdMini":"2","bdPic":"","bdStyle":"0","bdSize":"16"},"share":{},"image":{"viewList":["qzone","tsina","tqq","renren","weixin"],"viewText":"分享到:","viewSize":"16"},"selectShare":{"bdContainerClass":null,"bdSelectMiniList":["qzone","tsina","tqq","renren","weixin"]}};with(document)0[(getElementsByTagName('head')[0]||body).appendChild(createElement('script')).src='http://bdimg.share.baidu.com/static/api/js/share.js?v=89860593.js?cdnversion='+~(-new Date()/36e5)];</script>

将这个 share.php 文件上传到当前主题的根目录。

2.在主题的 style.css 中添加如下样式代码:

#share {
	display:block;
	width:35px;
	margin-left:-517px;
	position:fixed;
	left:50%;
	top:420px;
	_margin-left:-515px;
	_position:absolute;
	_margin-top:420px;
	_top:expression(eval(document.documentElement.scrollTop));
	}
.share {
	background:#fff;
	width:24px;
	border-left: 1px solid #ccc;
	border-right: 1px solid #ccc;
	}
.share_top {
    position:relative;
    background:#fff;
    width:24px;
    height:8px;
    border-top:1px solid #ccc;
    border-left: 1px solid #ccc;
    border-right: 1px solid #ccc;
    }
.share_bottom {
    position:relative;
    background:#fff;
    width:24px;
    height:8px;
    margin:0 0 10px 0;
    border-left: 1px solid #ccc;
    border-right: 1px solid #ccc;
    border-bottom:1px solid #ccc;
    }
.bdsharebuttonbox {
    padding:0 0 0 4px !important;
    }
.bdsharebuttonbox a {
    width:16px !important;
    padding:0 !important;
    margin:3px 0 !important;
    }

3.在主题的 footer.php 中 的前面添加调用 share.php 文件的代码即可:

<?php get_template_part( 'share' ) ?>
打赏

乐趣公园 , 版权所有丨本网站资源均来自网络,如果侵犯了你的权益请联系我,我会尽快处理你的问题丨本网站采用BY-NC-SA协议进行授权 , 转载请注明为 WordPress 添加侧边跟随百度分享按钮(含划词分享、图片分享效果)
喜欢 (0)
[476507773@qq.com]
分享 (0)
关于作者:
喜欢互联网,喜欢分享,喜欢贴吧,喜欢折腾火狐,喜欢玩新玩意。在下面这些网站,你可能也会发现我的哈。