其实想要实现这个功能也是挺简单的,有两种办法。
方法1:
纯html代码实现(优点:添加很简单,只需把html代码粘贴到小工具中的文本中即可。缺点:更改相对麻烦)把下面内容改成自己的。
1
|
<div class=“textwidget”><a class=“tweibo” style=“padding-left: 12px;” href=“http://wpa.qq.com/msgrd?v=3&uin=你的QQ号码&site=qq&menu=yes” target=“_blank” rel=“external nofollow”><i class=“fa fa-qq”></i> 在线服务</a> <a class=“tweibo” style=“padding-left: 12px;” href=“http://weibo.com/你的围脖” target=“_blank” rel=“external nofollow”><i class=“fa fa-weibo”></i> 微博</a> <a class=“tweibo” style=“padding-left: 12px;” href=“http://t.qq.com/你的企鹅围脖” target=“_blank” rel=“external nofollow”><i class=“fa fa-tencent-weibo”></i> 腾讯微博</a> <a class=“rss” style=“padding-left: 12px;” href=“http://laod.cn/go?url=http://laid.cn/s/你的网址” target=“_blank”><i class=“fa fa-paw”></i> 百度口碑</a></div>
|
方法2:
通过funtions增加自定义用户资料,然后通过函数调用。
先加代码到当前主题文件夹下的funtions.php中
代码如下:
//自定义用户资料
1
2 3 4 5 6 7 |
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’] = ‘百度口碑’; } |
然后再加代码到sidebar.php文件中。代码如下。(修改的话直接进后台的个人资料中填写。QQ直接写QQ号即可。微博写如叶子的http://weibo.com/你的围脖地址
腾讯微博同样如此,百度口碑写自己的网址即可如laod.cn
1
2 |
<div class=“textwidget”><a class=“tweibo” style=“padding-left: 12px;” href=“http://wpa.qq.com/msgrd?v=3&uin=<?php the_author_meta( ‘qq’ );?>&site=qq&menu=yes” target=“_blank” rel=“external nofollow”><i class=“fa fa-qq”></i> QQ交谈</a> <a class=“tweibo” style=“padding-left: 12px;” href=“"http://weibo.com/<?php”>”
target=”_blank” rel=”external nofollow“><i class=”fa fa–weibo“></i> 微博</a> <a class=”tweibo” style=”padding–left: 12px;” href=”http://t.qq.com/<?php the_author_meta( ‘qq_weibo’ );?>” target=”_blank” rel=”external nofollow”><i class=”fa fa-tencent-weibo”></i> 腾讯微博</a> style=”padding-left: 12px;” href=”http://koubei.baidu.com/s/<!–?php the_author_meta( ‘donate’ );?–>” target=”_blank”><i class=”fa fa-paw”></i> 百度口碑</div> |
CSS代码:
最后,记得把css写下,无论选的是方法1还是方法2都得写
1
2 3 4 5 6 7 8 9 10 |
.textwidget {
padding: 15px; color: #777; } .textwidget a { color: #777; } .textwidget a:hover { color: #45B6F7; } |