PHPCMS仿站视频教程第一课：准备工作与环境搭建

课程目标：

phpcms仿站视频教程第一课
（图片来源网络，侵删）
  1. 了解什么是PHPCMS以及仿站的基本概念。
  2. 成功搭建本地的PHP+MySQL+Apache（或Nginx）运行环境。
  3. 成功下载并安装PHPCMS V9程序。
  4. 掌握仿站的前期准备工作，为下一节课“网站结构分析”打下基础。

第一部分：理论知识与心态准备

在开始动手之前，我们先来明确几个概念,这有助于你理解后续的操作。

什么是PHPCMS？

PHPCMS是一款非常经典的PHP开源网站管理系统，特别是它的PHPCMS V9版本，在国内拥有极高的普及率，它采用MVC（Model-View-Controller）架构，代码清晰，扩展性强，非常适合用来快速搭建企业官网、门户网站等。

对于我们来说，PHPCMS就是一个“网站框架”或“网站骨架”，我们不需要从零开始写代码，而是利用它的框架，然后把别人的网站（目标站）的“皮肤”（HTML/CSS/JS图片）和“内容”套用进去。

什么是仿站？

仿站，顾名思义，就是模仿一个已经存在的网站来制作一个新的网站,这通常包括：

phpcms仿站视频教程第一课
（图片来源网络，侵删）
  • 模仿布局结构： 顶部导航、主体内容、底部信息等区块的排布。
  • 模仿视觉风格： 颜色、字体、图片样式等。
  • 模仿功能模块： 如轮播图、产品展示、新闻列表等。

重要提示： 仿站是学习前端和CMS系统搭建的绝佳方式，但请务必遵守法律法规和道德规范，我们仿的是网站的“结构和样式”，而不是直接复制其原创内容（文字、图片、视频等），仿站用于学习和练习，或获得客户授权后进行二次开发,切勿用于商业侵权。

第二部分：软件环境搭建

要让PHPCMS程序在你的电脑上运行，需要搭建一个本地的服务器环境，最简单、最推荐新手使用的方法是集成环境包。

准备工具：集成环境包

集成环境包已经帮你配置好了PHP、MySQL、Apache/Nginx等软件,你只需要一键安装即可。

  • 强烈推荐：phpStudy

    phpcms仿站视频教程第一课
    （图片来源网络，侵删）
    • 优点： 对Windows用户极其友好，界面直观，功能齐全（支持切换PHP版本、管理数据库、域名绑定等）,是国内开发者最常用的本地环境之一。
    • 下载地址： 官方网站 https://www.xp.cn/ (请搜索“phpStudy下载”找到最新官网链接,注意辨别安全)

  • 备选方案：WampServer / MAMP

    • WampServer： 另一款经典的Windows集成环境。
    • MAMP： 主要用于Mac系统。

本教程以 phpStudy (Windows版) 为例进行讲解。

安装phpStudy

  1. 下载phpStudy安装包，解压并运行 phpStudy.exe。
  2. 按照安装向导的提示进行安装，过程非常简单，一直点击“下一步”即可。
  3. 安装完成后,桌面会生成一个phpStudy的快捷方式图标。

启动环境并测试

  1. 启动服务： 双击桌面上的phpStudy图标，打开控制面板，确保 Apache 和 MySQL 后面的状态是 “运行中”（显示绿色）。

  2. 测试是否成功：

    • 打开你的浏览器（如Chrome、Firefox）。
    • 在地址栏输入 http://localhost 或 http://127.0.0.1。
    • 如果看到phpStudy的欢迎页面,说明你的本地服务器环境已经成功搭建！

配置虚拟域名（非常重要的一步）

默认情况下，我们通过 localhost 访问网站，为了更接近真实环境,我们需要为我们的仿站项目设置一个专属的域名。

  1. 在phpStudy控制面板，点击 “网站” -> “管理” -> “伪静态”。
  2. 在打开的目录中，找到 httpd-vhosts.conf 文件,用记事本或其他文本编辑器打开它。
  3. 在文件末尾，模仿已有的虚拟主机配置,添加如下代码：
<VirtualHost *:80>
    DocumentRoot "D:\phpStudy\WWW\my_phpcms"  <!-- !!! 这是你将要存放PHPCMS程序的文件夹路径 !!! -->
    ServerName www.my_phpcms.com              <!-- !!! 这是你要设置的域名，可以自定义 !!! -->
    <Directory "D:\phpStudy\WWW\my_phpcms">
        Options FollowSymLinks ExecCGI
        AllowOverride All
        Order allow,deny
        Allow from all
        Require all granted
    </Directory>
</VirtualHost>

代码解释：

  • DocumentRoot: 指定你网站程序存放的根目录，请确保这个目录你已经创建好了，我创建在 D:\phpStudy\WWW\my_phpcms。
  • ServerName: 你为这个网站设置的域名，这里我们设置为 www.my_phpcms.com，你也可以设置成 www.a.com 等你喜欢的名字。

  1. 修改本地Hosts文件：

    • 按下 Win + R 键，输入 drivers\etc\hosts，然后回车，用记事本打开 hosts 文件。
    • 在文件最下方，添加一行：0.0.1 www.my_phpcms.com
    • 保存文件（如果提示无权限，先将其复制到桌面，编辑后再复制回去覆盖原文件）。

  2. 重启Apache： 回到phpStudy控制面板，点击 “重启” 按钮，选择 “重启Apache”。

  3. 测试虚拟域名：

    • 清空浏览器缓存，在地址栏输入你刚刚设置的域名：http://www.my_phpcms.com。
    • 如果浏览器正常打开，没有报错,说明虚拟域名配置成功！

第三部分：下载并安装PHPCMS V9

环境准备好了,现在我们来安装PHPCMS程序。

下载PHPCMS V9

  • 官方下载地址： http://www.phpcms.cn/download/ (请搜索“PHPCMS V9 下载”找到官网)
  • 由于官网可能更新，我们可以下载一个相对稳定且常用的版本，PHPCMS V9.6.0。
  • 下载后得到一个压缩包，phpcms_v9.6.0_UTF8.zip。

上传程序到服务器

  1. 解压刚刚下载的 phpcms_v9.6.0_UTF8.zip 压缩包。
  2. 你会看到一个名为 phpcms 的文件夹,里面就是PHPCMS的所有程序文件。
  3. 将这个 phpcms 文件夹里面的所有内容，复制到你之前配置的虚拟域名根目录下，也就是 D:\phpStudy\WWW\my_phpcms。
  4. 注意： 是复制 phpcms 文件夹的，而不是 phpcms 文件夹本身。

运行安装向导

  1. 在浏览器地址栏输入你配置的域名：http://www.my_phpcms.com。
  2. 浏览器会自动跳转到PHPCMS的安装向导页面，如果出现文件权限不足的提示，请确保 my_phpcms 目录下的 caches 和 phpcms 等文件夹有写入权限（在phpStudy中可以右键目录->“权限设置”）。
  3. 环境检测
    • 向导会自动检测你的PHP、MySQL环境，如果各项都显示“√”,说明环境没有问题。
    • 如果有“×”,请返回第二部分检查你的phpStudy配置。
  4. 创建数据库名
    • 数据库信息：点击 “创建数据库”，向导会自动为你创建一个数据库，数据库名、用户名、密码会自动填好。请务必记下这些信息！
    • （手动创建方法：打开phpStudy控制面板，点击 “MySQL管理” -> “MySQL-Front” 或 “phpMyAdmin”，在phpMyAdmin中新建一个数据库，phpcms_v9，字符集选择 utf8_general_ci。）
  5. 安装配置
    • 数据库信息：如果向导没有自动填写，就手动输入刚才记下的数据库名、用户名、密码。
    • 管理员账号：设置你的后台登录用户名和密码，请务必牢记！
    • 站点名称：可以暂时填写“我的PHPCMS站点”。
  6. 完成安装：
    • 点击“开始安装”，等待几秒钟，安装完成后，会提示你删除 /install 目录。
    • 回到 my_phpcms 文件夹，找到并删除 install 文件夹。
    • 现在再次访问 http://www.my_phpcms.com,你应该能看到PHPCMS的默认首页了！

第四部分：仿站前期准备工作

恭喜你！PHPCMS已经成功运行,让我们为仿站做最后一步准备。

选择目标网站

找一个你想要模仿的网站，建议从企业官网入手，因为结构相对简单，某个科技公司的官网、装修公司的官网等。

下载目标网站源码

我们需要获取目标网站的HTML、CSS、JS和图片文件。

  • 使用工具： 浏览器的开发者工具（F12）或专门的“整站下载工具”。
  • 简单方法（手动下载）：
    1. 在目标网站页面，点击鼠标右键，选择 “另存为...”。
    2. 在弹出的窗口中，选择“完整网页”,然后保存。
    3. 这样你就可以得到一个包含HTML和图片文件夹的压缩包，这种方法只能保存当前页面，对于多页面网站效率较低,但对于分析首页结构足够了。
  • 专业方法（使用工具）：
    • 推荐使用 “WebZip” 或 “Teleport Pro” 等专业的网站下载工具，可以设置规则，将整个网站（或指定目录）的所有文件下载到本地。

整理下载的源码

将下载下来的目标网站源码解压，你会看到一堆HTML、CSS、JS文件和图片文件夹，把它们整理好，放在一个专门的文件夹里，D:\仿站案例\目标网站源码。

第一课总结

太棒了！你已经完成了仿站教程的第一课，并且取得了阶段性的胜利,让我们回顾一下你学到并做到的：

  1. 理解了 PHPCMS和仿站的基本概念。
  2. 成功搭建了本地的phpStudy服务器环境。
  3. 学会了配置虚拟域名,这是本地开发的关键技能。
  4. 亲手安装了PHPCMS V9程序,并看到了默认首页。
  5. 准备好了仿站的目标网站素材。

下一课预告： 在下一课中，我们将正式进入仿站的核心环节——网站结构分析，我们将一起打开目标网站的源码，学习如何分析它的HTML结构，并找出哪些部分是PHPCMS的“栏目”，哪些是“内容块”,敬请期待！

课后作业：

  1. 确保你的PHPCMS后台可以正常登录（访问 http://www.my_phpcms.com/index.php?m=admin）。
  2. 去找一个你喜欢的企业官网，并尝试用今天学到的方法,下载它的首页源码。
  3. 尝试用浏览器开发者工具（F12）打开目标网站，切换到“元素”面板,熟悉一下HTML的代码结构。