当前位置:首页 > CMS教程 > WordPress > 列表

WordPress添加一个位置固定的百度分享按钮

发布:smiling 来源: PHP粉丝网  添加日期:2014-03-21 21:37:57 浏览: 评论:0 

HotNews Pro 2.72集成的固定在页面左侧的百度分享按钮,可方便读者分享自己喜欢的文章,本文教你把这个固定的分享按钮添加到其它主题中.

第一步,在你所用主题目录新建一个名称为:share.php的模板文件,将下面的代码复制到进去并保存,代码如下:

  1. <div id="share">   
  2.        <div class="share">   
  3.            <div id="bdshare" class="bdshare_t bds_tools get-codes-bdshare">   
  4.                <a class="bds_tsina"></a>   
  5.                <a class="bds_tqq"></a>   
  6.                <a class="bds_qzone"></a>   
  7.                <a class="bds_renren"></a> 
  8.                <span class="bds_more"></span>   
  9.            </div>   
  10.            <div style="clear:both;"></div>   
  11.        </div>   
  12.    </div>   
  13.    <script type="text/javascript" id="bdshare_js" data="type=tools&amp;uid=0" ></script>   
  14.    <script type="text/javascript" id="bdshell_js"></script>   
  15.    <script type="text/javascript">   
  16.    document.getElementById("bdshell_js").src = "http://bdimg.share.baidu.com/static/js/shell_v2.js?cdnversion=" + Math.ceil(new Date()/3600000)   
  17.    </script>   
  18.    <style type="text/css">   
  19.    #share {   
  20.        display:block;   
  21.        width:35px;   
  22.        margin-left:-546px;/* 修改左右位置 */   
  23.        position:fixed;   
  24.        left:50%;   
  25.        top:420px;/* 修改上下位置 */   
  26.        _margin-left:-546px;/* IE6修改左右位置 */   
  27.        _position:absolute;   
  28.        _margin-top:420px;/* IE6修改上下位置 */   
  29.        _top:expression(eval(document.documentElement.scrollTop));   
  30.        }   
  31.    .share {   
  32.        background:#fff;   
  33.        width:24px;   
  34.        border: 1px solid #ccc;   
  35.        border-radius:5px 0 0 5px;   
  36.        }   
  37.    #bdshare_l {   
  38.        border-radius: 5px;   
  39.        }   
  40.    div #bdshare_l_c {   
  41.        border: 1px solid #ccc;   
  42.        border-radius: 5px;   
  43.        }   
  44.    #bdshare h6, #bdshare_s h6,#bdshare p, #bdshare_s p {   
  45.        display:none;   
  46.        }   
  47.    </style> 

第二步,将调用代码:<?php include('share.php'); ?> 

添加到主题页脚模板footer.php这句上面:<?php wp_footer(); ?> 

以上代码在WP默认主题Twenty Twelve中测试通过,针对不同主题的页面宽度,可适当调整固定按钮的位置,代码中有注释.

Tags: WordPress 百度分享按钮

分享到: