WordPress显示评论者IP归属地、浏览器、终端设备、电信运营商的插件

插件实现方法：

1）Show UserAgent 插件

官网： https://wordpress.org/plugins/show-useragent/

2）WP-UserAgent 插件

官网：https://wordpress.org/plugins/wp-useragent/

代码实现方法：

1、下载zip包

整理了图标和文字两种显示方式，命名为Show UserAgent 加强版：show-useragent-pro

2. 上传到主题根目录

把 show-useragent-pro.zip 上传到主题的根目录，注意不是WordPress根目录

解压后的文件列表如下：

# tree show-useragent -L 1
show-useragent
├── browsers
├── flags
├── ip2c
├── ip2c-qqwry.dat
├── ip2c-text.php
└── show-useragent.php

3. 添加代码到 functions.php

在 php 作用域内，添加两行代码：

include("show-useragent/show-useragent.php"); // 显示访客信息
include("show-useragent/ip2c-text.php"); // IP归属地和运营商查询功能

4. 添加代码到 xxx-comment.php 模板

这里，我们需要在评论者用户后面，添加显示IP归属地、浏览器图标等信息，因此需要找到评论者的位置，查找方法如下：

1）打开有评论的网页，按 F12（Mac用户组合键 option + command + i ）进入开发者模式，定位到评论者，例如：阳光岛主

2）搜索定位的关键词

在WordPress根目录下，搜索定位到的关键词，找到对应的评论模板文件

一般模板文件在 wp-include/ 目录下，所以搜索命令为：

# grep "comment-author vcard" wp-includes/ -r | grep -vE ".svn|.git"

wp-includes/class-walker-comment.php: <div class="comment-author vcard">
wp-includes/class-walker-comment.php: <div class="comment-author vcard">

3）修改评论模板文件

打开步骤2）找到的评论模板文件

vim wp-includes/class-walker-comment.php

再次搜索关键词 "comment-author vcard"，定位到在文件中的具体位置

添加代码如下：

<span id="comment_ua_info" class="comment_ua_info" style="white-space: nowrap;overflow: hidden;display:none;">
<?php echo '&nbsp;&nbsp;&nbsp;'; CID_print_comment_flag(); echo ' '; CID_print_comment_browser(); ?>
<?php echo "<span id='ua-info-text' style='font-size:14px;font-weight:normal;color:#aaa;'>"; echo convertip(get_comment_author_ip()); echo "</span>"; ?>
</span>

简单解释：

<span id="comment_ua_info" ... > 包含IP归属地、浏览器，以及文本信息等，目的是为后面鼠标悬浮显示时使用，js实现显示和隐藏效果

CID_print_comment_flag() 显示IP归属地的国旗

CID_print_comment_browser() 显示浏览器和用户设备

convertip(get_comment_author_ip()) 显示IP归属地的文本信息

至此，显示评论者信息已经实现了

如果想看效果，先把 id="comment_ua_info" 中的样式 display:none; 去掉，就可以看到效果了

5. 添加代码到 footer.php

初看步骤4的效果还不错，但是看上去信息会很多，颜色等有点乱，于是想追求极致，还需要继续努力

为了实现鼠标悬浮在评论框才显示的效果，我们需要结合js实现，添加js代码到主题下的footer.php中

vim footer.php

添加js代码

<!-- comment ua-info -->
<script>
jQuery('.comment-body').hover(     
    function(){
        jQuery(this).find('span.comment_ua_info').show();
    },
    function(){
        jQuery(this).find('span.comment_ua_info').hide();
    });
jQuery('.comment-body').click(     
    function(){
        jQuery(this).find('span.comment_ua_info').show();
    });
</script>

说明：

1）jQuery('.comment-body').hover 悬浮事件，主要用于PC电脑端，但是手机端没有悬浮事件

2）jQuery('.comment-body').click 点击事件，主要用于手机端，点击可以显示，但需要注意click事件里不要加hide，否则在电脑端与hover相冲突

3）span.comment_ua_info 标签，是在步骤4中特别说明的，记得要把 id="comment_ua_info" 中的样式设置为 display:none; 默认不显示ua-info信息

至此，评论者IP归属地等信息默认是隐藏了，只有当鼠标悬浮在评论框时才会显示出来

6. 按钮显示评论所有IP

上面的功能，在一些博客里都已实现，我的米扑博客只是把人家的效果，用代码实现分享出来

最后，奉献一点小创新，个人感觉还是比较实用的，就是添加一个按钮，一键显示所有IP

恩，你说的对，步骤4早已经实现了，折腾出步骤5的隐藏IP，现在步骤6又整出一键显示所有IP，闲的蛋疼，哈

恩，蛋疼也好，折腾也罢，也要搞出来，微创新嘛，直接上代码和步骤啦

1） 修改评论文件 comments.php

进入主题目录，修改评论文件 comments.php

vim comments.php

添加一行用于显示的按钮（按钮放哪儿，由你自己决定了）

<span id="comment_show_ip" class="comment_show_ip" style="color:blue; font-size:14px;">显示评论IP</span>

2） 添加js代码到 footer.php

进入主题目录，修改页脚文件 footer.php

vim footer.php

添加js代码如下：

<script>
jQuery(".comment_show_ip").click(function(){
    if(jQuery(".comment_show_ip").text() == "显示评论IP") {
        jQuery(".comment_ua_info").show();
        jQuery(".comment_show_ip").html("隐藏评论IP");
    }
    else {
        jQuery(".comment_ua_info").hide();
        jQuery(".comment_show_ip").html("显示评论IP");
    }
});
</script>

7. 隐藏管理员的IP信息

如果不想显示博客管理员的IP地址，可以加一个判断

if(is_super_admin() || $comment->user_id != 1)

代码判断的含义是只有当前登录用户是管理员自己或者评论是非管理员时，才显示IP信息，即：

1）普通游客，只可以看到非管理员的IP信息

2）管理员未登录（实际就不是管理员了），也只可以看到非管理员的IP信息

3）管理员登录了，则也显示IP信息，管理员可以看到全部人（包含管理员自己）的IP信息

完整代码如下：

<?php
    // 显示博主身份
    if($comment->user_id == 1) {
        echo ' <span style="font-size: 0.9em; font-weight:normal; color:#aaa">[博主]</span>'; 
    }   
 
    // 显示评论者IP归属地、浏览器、终端设备、电信运营商
    if(is_super_admin() || $comment->user_id != 1) {
        echo '<span id="comment_ua_info" class="comment_ua_info" style="display:none;">';
            echo '&nbsp;&nbsp;&nbsp;'; CID_print_comment_flag(); 
            echo ' '; CID_print_comment_browser(); 
            echo '<span id="ua-info-text" style="font-size:14px;font-weight:normal;color:#aaa;">'; 
            echo convertip(get_comment_author_ip()); 
            echo '</span>';
        echo '</span>';
    }   
?>