ZBlog通用原生主题无门槛纯代码添加文章点赞超详细教程

一、准备工作：先做两个备份，防止操作出错

重点提醒：任何修改主题代码的操作前，必须做这两个备份，不然出错后恢复难度大。

• 备份ZBlog数据库：登录ZBlog后台 → 左侧菜单【系统设置】→ 【数据库管理】→ 点击【备份当前数据库】→ 等备份进度条完成（进度条消失即完成）
• 备份当前主题文件：用FTP工具（推荐FileZilla，下载地址：https://filezilla-project.org/download.php?type=client）连接网站空间 → 进入/zb_users/theme/目录 → 找到你正在使用的主题文件夹（比如是tpure）→ 右键点击整个文件夹 → 选择【下载】到本地电脑

二、创建数据库字段：存储文章点赞数

ZBlog默认没有点赞数字段，需要手动添加一个到zbp_post表（ZBlog文章表），步骤如下：

2.1 通过ZBlog后台插件添加（最简单方法，推荐）

如果后台没有【SQL命令执行插件】，先安装：

• 登录ZBlog后台 → 左侧菜单【应用中心】→ 搜索【SQL命令执行插件】→ 点击安装并启用

启用后执行添加字段的SQL：

• 后台左侧菜单【SQL命令执行插件】→ 找到输入框 → 完整复制下面的SQL语句 → 点击【执行SQL语句】

```sql ALTER TABLE `zbp_post` ADD `log_Likes` INT(11) NOT NULL DEFAULT '0' COMMENT '文章点赞数'; ```

验证是否添加成功：后台左侧菜单【系统设置】→ 【数据库管理】→ 找到zbp_post表 → 点击【查看字段】→ 能看到log_Likes字段，默认值0，类型INT(11)，就成功了。

三、修改主题文件：添加前端点赞按钮和显示

3.1 找到需要修改的文章模板文件

用FileZilla连接网站空间，进入/zb_users/theme/你的当前主题名/template/目录，找到post-single.php（这是单篇文章的核心展示模板，大部分原生主题都是这个文件名，如果没有，找带single或article字样的php文件）。

3.2 下载并打开post-single.php文件

右键点击post-single.php → 【下载】到本地 → 用专业的代码编辑器（推荐VS Code，下载地址：https://code.visualstudio.com/）打开，不要用记事本（会破坏编码）。

3.3 添加点赞按钮和显示的HTML+CSS代码

找文章标题、发布时间、分类、阅读数附近的代码位置（比如阅读数代码后面），插入下面的代码块：

```html ```

注意：如果你的主题有专门的CSS文件（比如style.css），可以把style属性里的内容移到style.css的这样更规范，这里为了无门槛操作，直接内嵌了样式，颜色、间距可以根据自己的主题风格修改数值。

3.4 添加AJAX请求的JavaScript代码

继续在post-single.php文件里找标签（在文件最后面），在标签之前插入下面的代码块：

```javascript ```

四、创建点赞请求的后端处理文件

在/zb_system/ajax/目录下创建一个新文件，命名为article_like.php，步骤如下：

• 在本地电脑新建一个txt文件 → 打开后完整复制下面的PHP代码 → 保存时把文件后缀名txt改成php → 用FileZilla上传到网站空间的/zb_system/ajax/目录

```php 0, 'msg' => '参数错误', 'data' => 0 ); // 检查文章ID是否有效 if($article_id > 0){ // 获取文章对象 $article = $zbp->GetPostByID($article_id); if($article && $article->ID > 0){ // 检查同IP是否已经点赞过 $like_session_key = 'liked_' . $article_id; if(!isset($_SESSION[$like_session_key])){ // 点赞数加1 $article->log_Likes += 1; // 保存文章对象到数据库 $article->Save(); // 标记会话 $_SESSION[$like_session_key] = true; // 更新返回结果 $result['code'] = 1; $result['msg'] = '点赞成功'; $result['data'] = $article->log_Likes; }else{ $result['code'] = 0; $result['msg'] = '您已经点赞过这篇文章了'; $result['data'] = $article->log_Likes; } }else{ $result['code'] = 0; $result['msg'] = '文章不存在'; } } // 输出JSON格式的返回结果 echo json_encode($result); // 终止脚本 exit; ?> ```

说明：这里用了PHP会话（Session）来防止同IP在当前浏览器会话期间重复点赞，如果你想要无限点赞，可以删除代码中“开启会话”到“标记会话”之间的所有代码，包括对应的判断逻辑。

五、上传修改后的文件并测试

5.1 上传修改后的post-single.php

在FileZilla本地窗口找到刚才修改过的post-single.php → 右键点击 → 选择【上传】→ 覆盖网站空间上的原文件（点击【确认覆盖】）。

5.2 测试点赞功能

• 打开网站任意一篇单篇文章 → 找到刚才添加的点赞按钮 → 点击按钮 → 看是否变成绿色的“已点赞”，并且点赞数加1
• 刷新当前文章页面 → 看点赞数是否保持刚才加1后的数值
• 打开浏览器的无痕/隐私模式 → 再次点击同一篇文章的点赞按钮 → 看是否还能点赞（测试不同会话的情况）

六、常见问题解决

6.1 点击点赞按钮没有反应

检查两个地方：

• 你的主题是否引入了jQuery库？大部分ZBlog原生主题都引入了，如果没有，在post-single.php的标签之前，刚才添加的JavaScript代码之前，插入下面的代码引入CDN版jQuery：

```html ```

• 检查article_like.php文件的路径是否正确，刚才的代码里用了{$host}变量，这是ZBlog的全局变量，会自动替换成你的网站地址，确保没有修改这个变量

6.2 点击点赞按钮弹出“参数错误”或“文章不存在”

检查文章ID的获取是否正确：打开单篇文章的页面源代码 → 找到like-btn-开头的按钮ID，看后面的数字是否和这篇文章的后台ID一致（后台文章列表可以看到每篇文章的ID）。

6.3 点赞成功后刷新页面，点赞数又变回原来的数值

检查log_Likes字段是否添加成功，以及article_like.php文件里的文章保存代码是否正确执行（$article->Save();这一行不能丢）。