纯代码实现侧边栏显示社交按钮组

其实想要实现这个功能也是挺简单的,有两种办法。

Social button

方法1:

纯html代码实现(优点:添加很简单,只需把html代码粘贴到小工具中的文本中即可。缺点:更改相对麻烦)把下面内容改成自己的。
[cc lang=”html”]

[/cc]

方法2:

通过funtions增加自定义用户资料,然后通过函数调用。

先加代码到当前主题文件夹下的funtions.php中
代码如下:
//自定义用户资料
[cc lang=”php”]
add_filter( ‘user_contactmethods’, ‘yeziting_add_contact_fields’ );
function yeziting_add_contact_fields( $contactmethods ) {
$contactmethods[‘qq’] = ‘QQ’;
$contactmethods[‘qq_weibo’] = ‘腾讯微博’;
$contactmethods[‘sina_weibo’] = ‘新浪微博’;
$contactmethods[‘donate’] = ‘百度口碑’;
}
[/cc]

然后再加代码到sidebar.php文件中。代码如下。(修改的话直接进后台的个人资料中填写。QQ直接写QQ号即可。微博写如叶子的http://weibo.com/你的围脖地址
腾讯微博同样如此,百度口碑写自己的网址即可如laod.cn
[cc lang=”php”]

QQ交谈
target=”_blank” rel=”external nofollow”> 微博
腾讯微博 style=”padding-left: 12px;” href=”http://koubei.baidu.com/s/” target=”_blank”> 百度口碑

[/cc]

CSS代码:

最后,记得把css写下,无论选的是方法1还是方法2都得写
[cc lang=”css”]
.textwidget {
padding: 15px;
color: #777;
}
.textwidget a {
color: #777;
}
.textwidget a:hover {
color: #45B6F7;
}
[/cc]

原创文章,作者:老D,如若转载,请注明出处:https://laod.cn/page/social-button.html

发表评论

登录后才能评论

评论列表(2条)

  • skynncn
    skynncn 2016-01-13 11:18

    一般我都用adblock屏蔽的。。。。基本不分享

  • 静思科技
    静思科技 2016-01-11 17:15

    来看看,学习了。