PhotoFolio 是一套以图片作品为主的摄影作品集网站模板，适合摄影师和视觉创作者展示照片、介绍服务并提供联系入口。黑色背景搭配绿色按钮，首页先用一段简短的个人介绍说明身份，再铺开大幅图片网格；想把访客的注意力放在作品本身，可以从这套布局开始改。
从图库进入项目详情
首页和图库页各放了 8 张图片。网格使用 Bootstrap 栅格，随屏幕缩窄，依次从每行 4 张调整为 3 张、2 张和单列；图片之间保留小间距和圆角，页面没有在每张图下方堆放长说明。
鼠标移到作品上，会出现放大和详情两个入口：放大入口调用 GLightbox，在当前页面中查看大图；详情入口进入 gallery-single.html，用于介绍一组作品或一个项目。访客可以在灯箱里快速翻照片，再进入详情页了解拍摄背景。
详情页包含 7 张图片的 Swiper 轮播，带左右切换和可点击的分页圆点，也配置了自动播放。图片下方留有项目说明、评价和项目信息栏，可以填写拍摄主题、合作方、时间与补充链接。
当前 8 张作品卡片都指向同一个详情页。 它是一份可复用的项目排版，不会按所点图片自动切换内容。整理多组作品时，需要复制详情页、替换各组图片与说明，再逐张修改卡片链接；访客才不会看完不同封面后总是进入同一个示例项目。
分类菜单尚未分组
导航下拉菜单列出了自然、人物、建筑、动物、运动和旅行等类别，但这些入口都链接到 gallery.html，没有携带分类参数，也没有配套筛选脚本。图库页的 8 张图片与首页使用同一组素材。
如果只有一个精选作品集，可以精简菜单，保留一个图库入口。如果确实要按题材分组，可以用图库页复制出多个分类页面，再分别配置图片和导航；需要频繁更新大量照片时，则应另接内容管理系统。模板本身没有照片上传、分类管理或自动生成项目页的后台。
六个展示页如何使用
包内共 7 个 HTML 文件，其中 6 个用于正式展示，另有一个仅保留公共框架的起步页。
| 页面 | 可以放什么内容 |
|---|---|
index.html | 摄影师身份、简短介绍、联系按钮与精选图库 |
gallery.html | 一组作品的图库列表 |
gallery-single.html | 项目轮播、拍摄说明、评价与项目信息 |
about.html | 个人照片、经历、联系方式与评价轮播 |
services.html | 服务介绍、价格列表与评价轮播 |
contact.html | 地址、电话、邮箱和联系表单 |
starter-page.html | 扩展新页面时复用页眉、页脚和页面标题 |
关于页和服务页各有 5 条评价，通过 Swiper 轮播展示。服务页另有 4 张服务卡片和 6 项示例报价，适合改成人像、活动、静物或其他实际承接的拍摄项目。示例姓名、经历、客户评价、金额和地址都要替换；这些静态文案不会连接到真实订单或预约记录。
表单还不能直接收件
联系页有姓名、邮箱、主题和消息 4 个必填项，前端脚本会向 forms/contact.php 发起请求。包里也确实有这个 PHP 文件，但它依赖的 assets/vendor/php-email-form/php-email-form.php 并未提供，因此不能把它当作已经可用的邮件表单。
正式启用时，需要自行接入收件服务或配置完整的服务端邮件程序。若继续采用 PHP 方案，网站空间须能运行 PHP，并配置真实收件地址及所需邮件参数；提交后还应分别验证成功、失败和实际到件情况。纯静态托管只能展示页面，不能执行这段 PHP。
换图改字与部署
这份包使用 Bootstrap 5.3.3、原生 JavaScript、GLightbox、Swiper 和 AOS，没有 jQuery 依赖，也没有必须执行的 Node.js 构建。保留 HTML 与 assets/ 的相对目录关系，就可以先完成静态页面部署。
修改时可以按下面的顺序处理：
- 整理作品分组。 替换
assets/img/gallery/中的照片，决定是否需要多个图库和项目详情页，并把放大入口与详情入口分别指向正确目标。 - 替换身份与业务信息。 修改首页介绍、关于页资料、服务报价和联系信息，同步处理各页的品牌名称、导航及页脚。服务卡片、社交图标和项目网址中还存在空链接或占位链接，需要补齐或移除。
- 统一视觉样式。
assets/css/main.css顶部定义了背景、文字和强调色变量，绿色对应--accent-color。图片使用自适应宽度，替换后要检查同一行的画幅和高度是否协调。 - 最后接通联系流程。 先把展示内容和路径整理好，再接收件服务，避免页面仍是示例资料时就开始接收真实询盘。
字体由 Google Fonts 加载：Cardo 用于标题，Roboto 用于正文，Inter 用于导航。改成中文时，需要选择合适的中文字体，并检查首页介绍在手机上的断行；如果目标环境不便访问外部字体，也要调整字体加载方式。
包内虽然有 assets/scss/ 目录，但只有说明文件，没有 Sass 源码。直接编辑现有 CSS 即可改样式，不应把这份资源描述为包含完整 SCSS 开发源文件。
暂无评论内容