WordPress代码实现post views为文章记录点击数/点击排行/有缓存及CDN使用ajax实现

  • A+
所属分类:Wordpress

普通动态WordPress网站可用代码(若使用缓存插件生产缓存页面或使用CDN可能无效--请使用ajax版)
放入function.php内即可,会自动更新自定义字段views,需要显示

1
<?php get_post_views($post -> ID); ?>

调用自定义字段即可

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
//postviews代码版
function get_post_views ($post_id) {
$count_key = 'views';
$count = get_post_meta($post_id, $count_key, true);
if ($count == '') {
delete_post_meta($post_id, $count_key);
add_post_meta($post_id, $count_key, '0');
$count = '0';
}
echo number_format_i18n($count);
}
function set_post_views () {
global $post;
$post_id = $post -> ID;
$count_key = 'views';
$count = get_post_meta($post_id, $count_key, true);
if (is_single() || is_page()) {
if ($count == '') {
delete_post_meta($post_id, $count_key);
add_post_meta($post_id, $count_key, '0');
} else {
update_post_meta($post_id, $count_key, $count + 1);
}
}
}
add_action('get_header', 'set_post_views');

有缓存及CDN使用ajax版如下
首先根目录建立views.php文件 代码如下

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
<?php
require('../../wp-blog-header.php');
$isXhr = $_SERVER['HTTP_X_REQUESTED_WITH'];
if (strtoupper($isXhr) == strtoupper("XMLHttpRequest")) {
    $post_id = $_POST['post_id'];
    $po = get_post_meta($post_id,'views',true);
    if(!$po)  {
        //表示不存在这个自定义栏目,那么新增这个自定义栏目
        add_post_meta($post_id, 'views', 1, true);
        echo 1;
    } else {
        // 若已存在这个自定义栏目,则先获取当前数值,并递增+1,再更新数据库
        $count = $po + 1;
        update_post_meta($post_id,'views',$count);
        echo $count;
    }
} else {
    header("Status: 403 Not Found");
    exit;
}

然后在主题需要统计views的页面加入以下代码

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
<script>
$(function(){
    function page_views() {
        if(!window.localStorage) {
            console.info('浏览器不支持 localStorage');
        }else{
            var post_id = <?php the_ID();?>;
            var views = localStorage.getItem("view_list");
            if(views===null){
                localStorage.setItem("view_list",post_id);
                $.post("/views.php?time="+new Date().getTime(),{post_id:post_id});
                return true;
            }else{
                var item = views.split("|");
                var bool = $.inArray(post_id+'',item);
                if(bool===-1){
                    $.post("/views.php?time="+new Date().getTime(),{post_id:post_id});
                    localStorage.setItem("view_list",views+"|"+post_id);
                    return true;
                }
                return false;
            }
 
        }
    }
    page_views();
});
</script>

方法三 适用于CND及缓存插件版

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
第一步:在 wordpress 根目录下,新建 ajax.php.内容如下
<?php
define( 'DOING_AJAX', true );
require_once( 'wp-config.php' );
do_action( 'wp_ajax_nopriv_' . $_REQUEST['action'] );
die( '0' );
第二步:在主题目录下的 functions.php 添下以下代码
//WordPress 文章点击统计 ajax 版,兼容 wp super cache 缓存代码及插件
//整理:Vetrue https://vetrue.com
add_action( 'wp_ajax_nopriv_v', 'views' );
function views($echo) {
    $post_id = intval( $_GET['views_id'] );
    if( $post_id > 0 ) {
        $post_views = get_post_custom( $post_id );
        $post_views = intval( $post_views['views'][0] );
        update_post_meta( $post_id, 'views', ( $post_views + 1 ) );
        exit();
    }
    if ($echo == 1) {
        global $post;
        $post_ID = $post->ID;
        $views = (int)get_post_meta($post_ID, 'views', true);
        echo number_format($views);
    }
}
第三步:引入 jquery 库
第四步:在 footer.php 文件 body 之前添加
<?php if( is_single() ){?>
<script type='text/javascript'>
/* <![CDATA[ */var v = {"u":"\/ajax.php","id":"<?php the_ID(); ?>"};/* ]]> */
jQuery.ajax({type:"GET",url:v.u,data:"views_id="+v.id+"&action=v"});
</script>
<?php } ?>
第五步:完毕,接下来在需要显示的计数的主循环内添加以下代码即可
<?php views(1);?>次阅读

发表评论

:?: :razz: :sad: :evil: :!: :smile: :oops: :grin: :eek: :shock: :???: :cool: :lol: :mad: :twisted: :roll: :wink: :idea: :arrow: :neutral: :cry: :mrgreen: