一、功能需求背景
在一些網站應用場景中,可能不需要系統默認自動提取文章圖片作為縮略圖,而是希望能對特定文章單獨設置縮略圖,并且能將內容圖片設置為多圖展示形式。基于此需求,我們可以在 PbootCMS 中通過代碼修改來實現增加內容首圖為縮略圖按鈕以及內容圖片為多圖按鈕的功能。
二、操作步驟詳解
(一)定位模板文件
找到 PbootCMS 項目中的 app\admin\view\default\content\content.html
文件,此文件用于控制后臺內容編輯頁面的展示布局。
(二)添加按鈕代碼
在該文件的代碼第 340 行至 740 行之間,添加以下 HTML 代碼來呈現內容首圖設置和內容圖片多圖設置的按鈕:
<div class="layui-form-item"> <label class="layui-form-label">內容首圖設置</label> <div class="layui-input-block"> <input type="checkbox" name="contenttopic" value="1" title="內容首圖設置縮略圖"> <input type="checkbox" name="contenttopics" value="1" title="內容圖片設置多圖"> </div> </div>
這段代碼會在后臺內容編輯頁面生成兩個復選框按鈕,分別用于控制是否將內容首圖設為縮略圖以及是否將內容圖片設為多圖。
(三)修改控制器文件
$contenttopic = post('contenttopic'); // 設置內容首圖按鈕 $contenttopics = post('contenttopics'); // 設置內容圖片為多圖按鈕
這兩行代碼用于接收從后臺頁面提交的按鈕狀態數據。
(四)修改文章處理邏輯
在文件的代碼第 136 行和 486 行處,添加以下 PHP 代碼來根據按鈕狀態處理文章圖片:
// 提取文章第一張圖為縮略圖 if ($contenttopic && preg_match("/<img.+?src=[\'\"]?([^\'\"]+?(\.gif|\.jpg|\.png|\.jpeg))[\'\"]?.+?>/i", decode_string($content), $srcs) && isset($srcs[1])) { $ico = $srcs[1]; } // 設置內容圖片為多圖,不適用內容圖片多的情況 if ($contenttopics && preg_match_all("/<img.+?src=[\'\"]?([^\'\"]+?(\.gif|\.jpg|\.png|\.jpeg))[\'\"]?.+?>/i", decode_string($content), $srcs)) { $srcstr = implode(',', $srcs[1]); $pics = $srcstr; }
這段代碼的作用是,當內容首圖設置按鈕被選中時,提取文章中的第一張圖片作為縮略圖;當內容圖片多圖設置按鈕被選中時,提取文章中的所有圖片并以逗號分隔的形式存儲。
五、注意事項
最終實現效果: