dede搜索页面模板如何自定义样式？-DEDE建站-盈思创科技

DedeCMS 的搜索功能主要涉及两个核心部分：

（图片来源网络，侵删）

搜索框表单：通常位于网站首页或页头,用于用户输入关键词并提交。
搜索结果页：展示搜索结果的页面,这是我们需要重点自定义的模板。

搜索结果页模板文件位置

DedeCMS 的搜索结果页模板默认文件是 search.php,它位于你的网站根目录下。

文件路径：/你的网站根目录/search.php

这个文件本身是一个 PHP 文件，但它混合了 PHP 逻辑代码和 HTML 模板代码，我们主要修改其中的 HTML 部分来自定义页面样式和布局。

搜索结果页模板结构详解

打开 search.php 文件,你会看到类似下面的结构：

<?php
require_once (dirname(__FILE__) . "/include/common.inc.php");
require_once DEDEINC."/arc.searchview.class.php";
// 获取搜索关键词
$keyword = isset($q) ? trim($q) : '';
// 实例化搜索类
$search = new SearchView($keyword);
// --- 这里是页面的主要内容区域 ---
?>
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">搜索结果 - <?php echo $cfg_webname; ?></title>
// ... 其他 head 标签，如 CSS、JS 引用等 ...
</head>
<body>
    <div class="header">
        // ... 网站头部内容 ...
    </div>
    <div class="main">
        <div class="search-box">
            // ... 通常这里会再次显示一个搜索框 ...
        </div>
        <div class="search-result">
            // ====== 这是核心的搜索结果列表区域 ======
            <?php
            $search->Display(); // 这句是关键！它负责输出所有的搜索结果列表
            ?>
            // =========================================
        </div>
        <div class="search-page">
            // ====== 这是核心的分页区域 ======
            <?php
            $search->GetPageList(); // 这句是关键！它负责输出分页导航
            ?>
            // ==============================
        </div>
    </div>
    <div class="footer">
        // ... 网站底部内容 ...
    </div>
</body>
</html>

核心代码解释：

（图片来源网络，侵删）

$search->Display();：这是输出搜索结果列表的函数，它会循环遍历所有符合条件的内容,并调用内部的模板来渲染每一个结果条目。
$search->GetPageList();：这是输出分页导航的函数，如“首页上一页 1 2 3 4 5 下一页末页”。

如何自定义搜索结果页（推荐方法）

直接修改 search.php 文件虽然可行，但升级 DedeCMS 时可能会被覆盖。更推荐的方法是使用 DedeCMS 的模板机制。

步骤 1：创建独立的模板文件

在你的模板目录（默认为 /templets/）下创建一个新文件夹，search/。
在 /templets/search/ 文件夹内创建一个 HTML 文件，default.htm。

现在你的路径是：/templets/search/default.htm

步骤 2：在 `default.htm` 中编写你的搜索页HTML结构

这个文件将完全控制搜索页的显示样式，你可以把它当成一个普通的 HTML 页面来写，只需要把搜索结果列表和分页的 PHP 代码放进去即可。

/templets/search/default.htm 示例代码：

（图片来源网络，侵删）

<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">搜索结果 - {dede:global.cfg_webname/}</title>
    <link rel="stylesheet" href="{dede:global.cfg_templetsstyle/}/css/style.css">
</head>
<body>
    {dede:include filename="head.htm"/} <!-- 引用头部模板 -->
    <div class="search-container">
        <!-- 1. 搜索框 -->
        <div class="search-form">
            <form name="formsearch" action="{dede:global.cfg_cmsurl/}/search.php">
                <input type="hidden" name="kwtype" value="0" />
                <input type="text" name="q" class="search-keyword" placeholder="请输入搜索关键词" value="{dede:global name='q'/}">
                <button type="submit" class="search-submit">搜索</button>
            </form>
        </div>
        <!-- 2. 搜索结果统计信息 -->
        <div class="search-info">
            <p>为您找到 <strong>{dede:global.itemcount/}</strong> 条与 "<strong>{dede:global name='q'/}</strong>" 相关的结果</p>
        </div>
        <!-- 3. 搜索结果列表 -->
        <div class="search-result-list">
            {dede:list pagesize='10'} <!-- 这里的 pagesize 表示每页显示多少条结果 -->
            <div class="result-item">
                <h3><a href="[field:arcurl/]" title="[field:title/]">[field:title/]</a></h3>
                <p class="result-summary">[field:description function='cn_substr(@me, 200)'/]...</p>
                <div class="result-meta">
                    <span>来源：[field:typename/]</span>
                    <span>发布时间：[field:pubdate function='MyDate('Y-m-d', @me)'/]</span>
                </div>
            </div>
            {/dede:list}
        </div>
        <!-- 4. 搜索结果分页 -->
        <div class="search-page">
            {dede:pagelist listsize='5' listitem='index,pre,pageno,next,end,option'/}
        </div>
    </div>
    {dede:include filename="footer.htm"/} <!-- 引用底部模板 -->
</body>
</html>

步骤 3：修改 `search.php` 使其调用新模板

你需要修改根目录下的 search.php 文件，让它不再直接输出 HTML，而是去加载你刚刚创建的 default.htm 模板。

找到 search.php 文件,将其内容替换为以下代码：

<?php
require_once (dirname(__FILE__) . "/include/common.inc.php");
require_once DEDEINC."/arc.searchview.class.php";
// 获取搜索关键词
$keyword = isset($q) ? trim($q) : '';
// 实例化搜索类
$search = new SearchView($keyword);
// --- 模板调用部分 ---
$tplfile = $cfg_basedir.$cfg_templets_dir."/search/default.htm";
if (!file_exists($tplfile)) {
    $search->Display();
} else {
    // 调用指定的模板文件
    $search->Display($tplfile);
}
?>

代码解释：

$tplfile = ...：定义了你的新模板文件的完整路径。
if (!file_exists($tplfile)) { ... }：做一个容错判断，如果找不到你的模板文件，就使用默认的渲染方式（兼容旧模板）。
$search->Display($tplfile);：这是关键！我们将模板文件的路径作为参数传递给 Display 方法，DedeCMS 就会使用这个模板来渲染搜索结果了。

搜索结果页常用标签说明

在 default.htm 模板中,你可以使用以下标签：

全局标签
- {dede:global.cfg_webname/}：网站名称
- {dede:global.q/}：用户当前搜索的关键词
- {dede:global.itemcount/}：搜索到的结果总数
列表标签 {dede:list}
- 这个标签和首页列表页的 {dede:list} 用法完全一样。
- pagesize='10'：设置每页显示的搜索结果数量。
- [field:title/]。
- [field:arcurl/]：文章链接。
- [field:description/]：需要在后台“文档关键词维护”中设置好摘要）。
- [field:pubdate/]：发布时间，通常配合 function 格式化，如 MyDate('Y-m-d', @me)。
- [field:typename/]：文章所属栏目名。
分页标签 {dede:pagelist}
- listsize='5'：显示的页码按钮数量（当前页码前后各显示几个）。
- listitem='index,pre,pageno,next,end,option'：定义分页导航显示哪些元素。
  - index：首页
  - pre：上一页
  - pageno：页码
  - next：下一页
  - end：末页
  - option：跳转下拉框

高级技巧：按不同栏目或模型搜索

你可能希望用户可以在搜索时指定栏目或内容模型。

修改搜索框表单 在你的搜索框表单里增加 typeid 和 channeltype 字段。

<form name="formsearch" action="{dede:global.cfg_cmsurl/}/search.php">
    <input type="hidden" name="kwtype" value="0" />
    <input type="text" name="q" placeholder="请输入搜索关键词">
    <!-- 新增：指定栏目 -->
    <select name="typeid">
        <option value="0">全站</option>
        {dede:channel type='son' noself='yes'}
        <option value="[field:id/]">[field:typename/]</option>
        {/dede:channel}
    </select>
    <!-- 新增：指定模型 -->
    <select name="channeltype">
        <option value="1">文章</option>
        <option value="2">下载</option>
        <!-- 其他模型... -->
    </select>
    <button type="submit">搜索</button>
</form>

修改 search.php（可选） 如果你希望默认就按某个栏目或模型搜索，可以在 search.php 中给 $keyword 赋值时，同时获取 typeid 和 channeltype 的值。

// ... 原有代码 ...
$keyword = isset($q) ? trim($q) : '';
$typeid = isset($typeid) ? intval($typeid) : 0;
$channeltype = isset($channeltype) ? intval($channeltype) : 0;
// 实例化搜索类时，可以传入更多参数
$search = new SearchView($keyword, $typeid, $channeltype);
// ... 后续代码 ...

通过以上步骤，你就可以完全掌控 DedeCMS 搜索页面的外观和功能,打造出符合自己网站风格的搜索体验。

dede搜索页面模板如何自定义样式？

搜索结果页模板文件位置

搜索结果页模板结构详解

如何自定义搜索结果页（推荐方法）

步骤 1：创建独立的模板文件

步骤 2：在 `default.htm` 中编写你的搜索页HTML结构

步骤 3：修改 `search.php` 使其调用新模板

搜索结果页常用标签说明

高级技巧：按不同栏目或模型搜索

相关文章

目录[+]

搜索结果页模板文件位置

搜索结果页模板结构详解

如何自定义搜索结果页（推荐方法）

步骤 1：创建独立的模板文件

步骤 2：在 default.htm 中编写你的搜索页HTML结构

步骤 3：修改 search.php 使其调用新模板

搜索结果页常用标签说明

高级技巧：按不同栏目或模型搜索

相关文章

目录[+]

步骤 2：在 `default.htm` 中编写你的搜索页HTML结构

步骤 3：修改 `search.php` 使其调用新模板