WordPress 添加favicon、访问统计和访问日志

添加 favicon

自己做了一个小 icon,本来想的是传到根目录下、加个 link 标签就完事儿,没想到还遇到了其他问题;操作步骤:

将做好的 ico 文件放到网站的根目录下,然后打开主题下的 header.php,在 <head> 中添加 link 标签,注意 href 尽量用绝对地址:

<link rel="shortcut icon" href="//ashita.top/favicon.ico" type="image/x-icon">

然后修改 favicon 的权限,505 为可读和可执行:

sudo chmod 505 favicon.ico

第一次添加 link 标签是在 wp 根目录下的 wp-blog-header.php 中,前台页面一切正常,后来编辑文章的时候发现无法保存和预览,找了好久才发现是这个改动的问题;
主题页面模板之外的文件,还是少修改为好;

favicon 的权限问题也找了好久,不能小看任何一个小需求啊;

favicon 是用 svg 画的,宽高100px,如果需要修改宽高,可以直接将 svg 文件拖到 ps 中,修改图像大小就可以了;代码如下:

<svg width="100px" height="100px" xmlns="http://www.w3.org/2000/svg">
    <path d="M85 50 Q100 0 50 15 Q15 25 50 50 Q85 75 50 85 Q0 100 15 50" stroke-width="20" stroke="#f00" fill="none"></path>
</svg>

添加访问统计

这里的统计是用户访问站点的情况,其实就是埋点了。

一开始想的是在后端统计访问情况,functions.php 中加一段代码,每次页面加载的时候,就把访问情况记录下来;

后来发现有一个缺点:线上的网站有很多爬虫访问,不一定都是“人”在浏览器中访问的;这个方案中,爬虫访问的情况,也做了统计,最终数据就不准了;

爬虫基本都是通过模拟请求实现的,获取到 HTML 内容后,当做一个纯文本处理,不会执行页面中的代码,在前端做统计就避开了这个问题;

我加了百度、Bing 和 Google 统计,代码也是加在主题中的 header.php 中;

我加了当前域名和管理员判断,只有非管理员并且域名为 “ashita.top” 的访问才添加统计代码;管理员判断逻辑在 这里 有提到;
如果是管理员或本地 localhost 调试访问,都不添加这段 js 代码;

 <?php
    if($_SERVER['HTTP_HOST'] === 'ashita.top' && !user_is_admin()){
       echo '<script>
        var _hmt = _hmt || [];
        (function () {
            var hm = document.createElement("script");
            hm.src = "http://hm.baidu.com/hm.js?unique_key";
            var s = document.getElementsByTagName("script")[0];
            s.parentNode.insertBefore(hm, s);
        })();
    </script>';
    } 
?>

百度统计文档和提示都比较清晰,直接使用就好了,刚添加上数据是有延迟的,实际操作的时候,等了一个多小时才看到数据;

访问日志

添加了访问统计,就可以看别人访问自己网站的一些数据了,比如访问时长、跳出率什么的,但是统计平台并没有把所有数据都展示出来,比如用户访问的IP地址、用户的 userAgent 等;

ip 可以大致来区分访问者所在的地区;

userAgent 可以知道访问者所用的浏览器类型,以后还可以做以浏览器维度的分析;

与前端埋点不同,访问日志的需求中,我想要记录所有请求页面的 ip 和 ua,即使是爬虫,也可以看到是哪个爬虫;

项目根目录下建一个 logs 文件夹,在 functions.php 中添加下面的代码就可以了:

// 获取 ip 地址
function get_remote_addr()
{
    if (isset($_SERVER["HTTP_X_REAL_IP"])) {
        return $_SERVER["HTTP_X_REAL_IP"];
    } else if (isset($_SERVER["HTTP_X_FORWARDED_FOR"])) {
        return preg_replace('/^.+,\s*/', '', $_SERVER["HTTP_X_FORWARDED_FOR"]);
    } else {
        return $_SERVER["REMOTE_ADDR"];
    }
}
// 获取 ua
function get_user_agent()
{
    return $_SERVER["HTTP_USER_AGENT"];
}

# csv 日志
function write_logs()
{
    //if (user_is_admin()) return;
    $line = array();
    $titles = array('time', 'ip', 'user-agent', 'referer', 'cookie');
    $cont = '';

    foreach (getallheaders() as $name => $value) {
        $idx = array_search(strtolower($name), $titles);
        if ($idx > -1) {
            $line[$idx] = $value;
        }
    }

    date_default_timezone_set("Asia/Shanghai");
    $date = time();
    $line[0] = date("Y/m/d H:i:s", $date);
    $line[1] = get_remote_addr();

    for ($i = count($line) - 1; $i >= 0; $i--) {
        $line[$i] = "\"$line[$i]\"";
    }
    ksort($line);

    $path = "logs/" . date("Y-m-d") . ".csv";
    if (!file_exists($path)) {
        $cont = implode(",", $titles) . "\n";
    }
    if (!$line[0]) return;
    $cont .= join(',', $line) . "\n";

    $file = fopen($path, "ab");
    fwrite($file, $cont);
    fclose($file);
}

//write_logs();
add_action('wp_head', 'write_logs');

如果这篇文章对你有用,可以点击下面的按钮告诉我

0

发表回复