博客地址：https://waikanl.cn

安装包获取：inis v5 安装包

视频教程：视频安装教程

环境要求：需安装 MySQL 5.7 及以上版本（推荐 8.0+ 版本以获得更优体验），无其他强制环境依赖

二、具体安装步骤

（一）上传并解压安装包

登录宝塔面板，进入【文件】管理模块

上传下载好的 inis v5 安装包至指定目录，上传完成后点击解压，等待解压完成

（二）新建并配置 Go 项目

进入宝塔面板【网站】模块，选择【新建】-【Go 项目】，按以下配置填写：

项目执行文件：选择解压后文件夹中的【inis】可执行程序

项目名称：默认名称或自定义均可

项目端口：建议保留默认 2000 端口（不推荐修改）

执行命令：保持默认配置即可

环境变量：无需额外配置

运行用户：选择【www】

开机启动：建议勾选（确保服务器重启后项目自动运行）

项目备注：默认或自定义均可

绑定域名：填写自己的域名（示例：inis.cn）

所有配置完成后，点击【确认】保存。保存成功后，可先通过绑定的域名初步访问验证

（三）创建数据库

进入宝塔面板【数据库】模块，选择【MySQL】-【添加数据库】

按以下配置填写：

数据库名：可自定义，推荐填写【inis】（便于记忆）

用户名：默认或自定义均可

密码：默认生成或自行设置（建议记录密码，后续可能用到）

访问权限：保持默认配置即可

添加至：保持默认配置即可

点击【提交】，完成数据库创建

（四）完成安装引导

打开之前绑定的域名，按照页面提示完成后续安装引导操作，即可正常使用 inis v5 系统

步骤概览

1. 备份原始文件
2. 确定修改位置
3. 添加必要的CSS样式
4. 修改文章头部HTML结构
5. 测试效果

详细步骤

1. 备份原始文件

在开始修改之前，先备份你的 echo_log.php 文件，以防需要恢复：

1. 找到你当前使用的主题文件夹: content/templates/你的主题名称/
2. 复制 echo_log.php 文件并重命名为 echo_log.php.bak

2. 添加必要的CSS样式

打开主题的 header.php 文件，在 </head> 标签前添加以下CSS样式：

<!-- 文章头部风格样式 -->
<style>
.article-header-banner {
    position: relative;
    background: linear-gradient(135deg, #4361ee 0%, #3a0ca3 100%);
    color: #fff;
    padding: 60px 0 80px;
    margin-bottom: 30px;
    overflow: hidden;
    text-align: center;
}

.article-header-banner::after {
    content: "";
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    height: 40px;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1440 320'%3E%3Cpath fill='%23ffffff' fill-opacity='1' d='M0,128L48,144C96,160,192,192,288,197.3C384,203,480,181,576,154.7C672,128,768,96,864,96C960,96,1056,128,1152,154.7C1248,181,1344,203,1392,213.3L1440,224L1440,320L1392,320C1344,320,1248,320,1152,320C1056,320,960,320,864,320C768,320,672,320,576,320C480,320,384,320,288,320C192,320,96,320,48,320L0,320Z'%3E%3C/path%3E%3C/svg%3E");
    background-size: cover;
    background-position: center;
}

.article-title {
    font-size: 2.5rem;
    font-weight: bold;
    margin-bottom: 20px;
}

.article-meta {
    display: flex;
    justify-content: center;
    align-items: center;
    flex-wrap: wrap;
    gap: 20px;
    font-size: 14px;
    color: rgba(255, 255, 255, 0.9);
}

.article-meta-item {
    display: flex;
    align-items: center;
}

.article-meta-item svg {
    margin-right: 5px;
    width: 16px;
    height: 16px;
}

.article-tags {
    margin-top: 20px;
}

.tag-item {
    display: inline-block;
    background: rgba(255, 255, 255, 0.2);
    color: #fff;
    padding: 4px 10px;
    border-radius: 20px;
    margin: 0 5px 5px 0;
    font-size: 12px;
}

.article-container {
    max-width: 90%;
    margin: 0 auto;
    padding: 0 15px;
}

@media (max-width: 768px) {
    .article-title {
        font-size: 1.8rem;
    }

    .article-meta {
        flex-wrap: wrap;
        gap: 10px;
    }
}
</style>

3. 修改文章头部HTML结构

现在，打开你的 echo_log.php 文件，找到文章头部区域。基于我们的主题文件，我们需要修改这部分：

1. 找到以下这部分代码（大约在第357行左右）：

<!-- 文章头部区域 -->
<header class="mb-8">
    <!-- 阅读控制工具栏 -->
    <div class="flex justify-end mb-4 items-center space-x-3 text-gray-600">
        <!-- 工具栏内容 -->
    </div>

    <!-- 文章标题 -->
    <h1 class="text-3xl md:text-4xl font-bold mb-4 text-gray-800"><?= htmlspecialchars($log_title, ENT_QUOTES, 'UTF-8') ?></h1>

    <!-- 文章元信息 -->
    <div class="flex flex-wrap items-center text-gray-600 mb-6 space-x-4">
        <!-- 元信息内容 -->
    </div>

            <!-- 文章摘要 -->
    <?php if (!empty($excerpt)): ?>
    <div class="bg-gray-50 border-l-4 border-blue-500 p-4 mb-6 text-gray-700 italic rounded">
        <?= $excerpt ?>
    </div>
    <?php endif; ?>

            <!-- 文章封面图片 -->
    <?php if (!empty($log_cover)): ?>
    <div class="mb-6 rounded-lg overflow-hidden shadow-md">
        <img src="<?= htmlspecialchars($log_cover, ENT_QUOTES, 'UTF-8') ?>" alt="<?= htmlspecialchars($log_title, ENT_QUOTES, 'UTF-8') ?>" class="w-full h-auto">
    </div>
    <?php endif; ?>
</header>

2. 用下面的新代码替换整个头部区域：

<!-- 文章头部区域 -->
<div class="article-header-banner">
    <div class="article-container">
        <h1 class="article-title"><?= htmlspecialchars($log_title, ENT_QUOTES, 'UTF-8') ?></h1>
        <div class="article-meta">
            <div class="article-meta-item">
                <svg viewBox="0 0 1024 1024" xmlns="http://www.w3.org/2000/svg" fill="currentColor"><path d="M512 64C264.6 64 64 264.6 64 512s200.6 448 448 448 448-200.6 448-448S759.4 64 512 64zm0 820c-205.4 0-372-166.6-372-372s166.6-372 372-372 372 166.6 372 372-166.6 372-372 372z"></path><path d="M686.7 638.6L544.1 535.5V288c0-4.4-3.6-8-8-8H488c-4.4 0-8 3.6-8 8v275.4c0 2.6 1.2 5 3.3 6.5l165.4 120.6c3.6 2.6 8.6 1.8 11.2-1.7l28.6-39c2.6-3.7 1.8-8.7-1.8-11.2z"></path></svg>
                <?= $reading_time ?>分钟
            </div>
            <div class="article-meta-item">
                <svg viewBox="0 0 1024 1024" xmlns="http://www.w3.org/2000/svg" fill="currentColor"><path d="M880 184H712v-64c0-4.4-3.6-8-8-8h-56c-4.4 0-8 3.6-8 8v64H384v-64c0-4.4-3.6-8-8-8h-56c-4.4 0-8 3.6-8 8v64H144c-17.7 0-32 14.3-32 32v664c0 17.7 14.3 32 32 32h736c17.7 0 32-14.3 32-32V216c0-17.7-14.3-32-32-32zm-40 656H184V460h656v380zM184 392V256h128v48c0 4.4 3.6 8 8 8h56c4.4 0 8-3.6 8-8v-48h256v48c0 4.4 3.6 8 8 8h56c4.4 0 8-3.6 8-8v-48h128v136H184z"></path></svg>
                <?= date('Y-m-d', $date) ?>
            </div>
            <div class="article-meta-item">
                <svg viewBox="0 0 1024 1024" xmlns="http://www.w3.org/2000/svg" fill="currentColor"><path d="M858.5 763.6a374 374 0 0 0-80.6-119.5 375.63 375.63 0 0 0-119.5-80.6c-.4-.2-.8-.3-1.2-.5C719.5 518 760 444.7 760 362c0-137-111-248-248-248S264 225 264 362c0 82.7 40.5 156 102.8 201.1-.4.2-.8.3-1.2.5-44.8 18.9-85 46-119.5 80.6a375.63 375.63 0 0 0-80.6 119.5A371.7 371.7 0 0 0 136 901.8a8 8 0 0 0 8 8.2h60c4.4 0 7.9-3.5 8-7.8 2-77.2 33-149.5 87.8-204.3 56.7-56.7 132-87.9 212.2-87.9s155.5 31.2 212.2 87.9C779 752.7 810 825 812 902.2c.1 4.4 3.6 7.8 8 7.8h60a8 8 0 0 0 8-8.2c-1-47.8-10.9-94.3-29.5-138.2zM512 534c-45.9 0-89.1-17.9-121.6-50.4S340 407.9 340 362c0-45.9 17.9-89.1 50.4-121.6S466.1 190 512 190s89.1 17.9 121.6 50.4S684 316.1 684 362c0 45.9-17.9 89.1-50.4 121.6S557.9 534 512 534z"></path></svg>
                <?= isset($user_cache[$author]) ? htmlspecialchars($user_cache[$author]['name'], ENT_QUOTES, 'UTF-8') : '管理员' ?>
            </div>
            <div class="article-meta-item">
                <svg viewBox="0 0 1024 1024" xmlns="http://www.w3.org/2000/svg" fill="currentColor"><path d="M942.2 486.2C847.4 286.5 704.1 186 512 186c-192.2 0-335.4 100.5-430.2 300.3a60.3 60.3 0 0 0 0 51.5C176.6 737.5 319.9 838 512 838c192.2 0 335.4-100.5 430.2-300.3 7.7-16.2 7.7-35 0-51.5zM512 766c-161.3 0-279.4-81.8-362.7-254C232.6 339.8 350.7 258 512 258c161.3 0 279.4 81.8 362.7 254C791.5 684.2 673.4 766 512 766zm-4-430c-97.2 0-176 78.8-176 176s78.8 176 176 176 176-78.8 176-176-78.8-176-176-176zm0 288c-61.9 0-112-50.1-112-112s50.1-112 112-112 112 50.1 112 112-50.1 112-112 112z"></path></svg>
                <?= $views ?>
            </div>
            <div class="article-meta-item">
                <svg viewBox="0 0 1024 1024" xmlns="http://www.w3.org/2000/svg" fill="currentColor"><path d="M928 161H699.2c-49.1 0-97.1 14.1-138.4 40.7L512 233l-48.8-31.3A255.2 255.2 0 0 0 324.8 161H96c-17.7 0-32 14.3-32 32v568c0 17.7 14.3 32 32 32h228.8c49.1 0 97.1 14.1 138.4 40.7l44.4 28.6c1.3.8 2.8 1.3 4.3 1.3s3-.4 4.3-1.3l44.4-28.6C602 807.1 650.1 793 699.2 793H928c17.7 0 32-14.3 32-32V193c0-17.7-14.3-32-32-32zM324.8 721H136V233h188.8c35.4 0 69.8 10.1 99.5 29.2l48.8 31.3 6.9 4.5v462c-47.6-25.6-100.8-39-155.2-39zm563.2 0H699.2c-54.4 0-107.6 13.4-155.2 39V298l6.9-4.5 48.8-31.3c29.7-19.1 64.1-29.2 99.5-29.2H888v488z"></path></svg>
                <?= $word_count ?>字
            </div>
        </div>

        <?php if (!empty($tags)): ?>
        <div class="article-tags">
            <?php foreach ($tags as $tag): ?>
            <span class="tag-item"><?= htmlspecialchars($tag, ENT_QUOTES, 'UTF-8') ?></span>
            <?php endforeach; ?>
        </div>
        <?php endif; ?>
    </div>
</div>

<!-- 文章摘要 -->
<?php if (!empty($excerpt)): ?>
<div class="container mx-auto px-4">
    <div class="max-w-4xl mx-auto">
        <div class="bg-gray-50 border-l-4 border-blue-500 p-4 mb-6 text-gray-700 italic rounded">
            <?= $excerpt ?>
        </div>
    </div>
</div>
<?php endif; ?>

<!-- 文章封面图片 -->
<?php if (!empty($log_cover)): ?>
<div class="container mx-auto px-4">
    <div class="max-w-4xl mx-auto">
        <div class="mb-6 rounded-lg overflow-hidden shadow-md">
            <img src="<?= htmlspecialchars($log_cover, ENT_QUOTES, 'UTF-8') ?>" alt="<?= htmlspecialchars($log_title, ENT_QUOTES, 'UTF-8') ?>" class="w-full h-auto">
        </div>
    </div>
</div>
<?php endif; ?>

<!-- 阅读控制工具栏 -->
<div class="container mx-auto px-4 mb-8">
    <div class="max-w-4xl mx-auto">
        <div class="flex justify-end items-center space-x-3 text-gray-600">
            <div class="font-size-controls flex items-center border rounded-lg overflow-hidden">
                <button id="decreaseFontBtn" class="px-3 py-2 bg-gray-100 hover:bg-gray-200 border-r flex items-center justify-center transition-colors duration-200" aria-label="减小字体">
                    <svg xmlns="http://www.w3.org/2000/svg" class="h-4 w-4" fill="none" viewBox="0 0 24 24" stroke="currentColor">
                        <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M20 12H4" />
                    </svg>
                </button>
                <span id="fontSizeIndicator" class="px-3 py-2 text-sm">默认</span>
                <button id="increaseFontBtn" class="px-3 py-2 bg-gray-100 hover:bg-gray-200 border-l flex items-center justify-center transition-colors duration-200" aria-label="增大字体">
                    <svg xmlns="http://www.w3.org/2000/svg" class="h-4 w-4" fill="none" viewBox="0 0 24 24" stroke="currentColor">
                        <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M12 4v16m8-8H4" />
                    </svg>
                </button>
            </div>
            <button id="printArticleBtn" class="flex items-center space-x-1 px-3 py-2 bg-gray-100 hover:bg-gray-200 rounded-lg transition-colors duration-200" aria-label="打印文章">
                <svg xmlns="http://www.w3.org/2000/svg" class="h-4 w-4" fill="none" viewBox="0 0 24 24" stroke="currentColor">
                    <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M17 17h2a2 2 0 002-2v-4a2 2 0 00-2-2H5a2 2 0 00-2 2v4a2 2 0 002 2h2m2 4h6a2 2 0 002-2v-4a2 2 0 00-2-2H9a2 2 0 00-2 2v4a2 2 0 002 2zm8-12V5a2 2 0 00-2-2H9a2 2 0 00-2 2v4h10z" />
                </svg>
                <span class="text-sm">打印</span>
            </button>

            <!-- 新增：目录按钮 -->
            <button id="tocBtn" class="flex items-center space-x-1 px-3 py-2 bg-gray-100 hover:bg-gray-200 rounded-lg transition-colors duration-200" aria-label="文章目录">
                <svg xmlns="http://www.w3.org/2000/svg" class="h-4 w-4" fill="none" viewBox="0 0 24 24" stroke="currentColor">
                    <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M4 6h16M4 12h16M4 18h7" />
                </svg>
                <span class="text-sm">目录</span>
            </button>
        </div>
    </div>
</div>

4. 保存并测试

1. 保存修改后的 echo_log.php 文件
2. 打开你的博客，访问一篇文章测试效果

5. 常见问题解决

问题：标签没有正确显示

如果标签没有显示，修改标签相关代码如下：

<?php 
// 获取标签
$tags_html = blog_tag($logid);
$tags = array();
if(!empty($tags_html)) {
    // 解析标签HTML
    preg_match_all('/<a[^>]*>(.*?)<\/a>/i', $tags_html, $matches);
    if(!empty($matches[1])) {
        $tags = $matches[1];
    }
}
?>

<?php if (!empty($tags)): ?>
<div class="article-tags">
    <?php foreach ($tags as $tag): ?>
    <span class="tag-item"><?= $tag ?></span>
    <?php endforeach; ?>
</div>
<?php endif; ?>

问题：样式冲突

如果遇到样式冲突，可以给我们的样式添加更具体的选择器：

.article-header-banner {
    /* 保持原有样式 */
}
.article-header-banner .article-title {
    /* 样式 */
}

效果预览

完成修改后，你的文章头部将会变成蓝色渐变背景的现代风格，类似于技术教程网站，包含：

• 渐变蓝色背景
• 波浪形底部过渡
• 居中大标题
• 图标式的文章信息（阅读时间、发布日期、作者、阅读量、字数）
• 圆角标签展示

希望这个教程对你有所帮助！如有任何问题，可以随时提问。

自定义字段分类

亿纸鱼企业主题的自定义字段主要分为以下几类：

1. 产品信息相关字段：用于展示产品价格、型号、状态等产品详情
2. 服务相关字段：用于描述服务周期、服务区域、服务类型等服务信息
3. 联系信息字段：用于提供联系人、电话、邮箱等联系方式
4. 企业特色字段：用于标记文章特色、企业资质、企业规模等
5. 案例展示字段：用于展示案例所属行业、完成日期、客户反馈等
6. SEO相关字段：用于优化文章的搜索引擎表现

如何使用自定义字段

步骤一：进入文章编辑页面

登录后台，新建文章或编辑已有文章，在文章编辑页面摘要下方，您会看到"自定义字段"面板。

步骤二：填写相关字段

根据文章类型（产品、服务、案例等），填写相应的自定义字段。不需要填写所有字段，只需填写与当前文章相关的字段即可，其中产品主图必填。

步骤三：保存文章

填写完成后，点击"保存"按钮，系统会自动保存您填写的自定义字段信息。

步骤四：前台展示

前台页面会根据您填写的自定义字段自动展示相应的信息，无需额外设置。

产品信息字段详解

基本产品信息

产品图片信息

产品详细规格

应用场景

产品信息字段适用于创建产品展示页面、产品目录或在线商城。通过这些字段，您可以清晰地展示产品的各项参数和特性，帮助客户做出购买决策。

服务相关字段详解

基本服务信息

服务详情

应用场景

服务相关字段适用于创建服务介绍页面、服务套餐展示或解决方案说明。通过这些字段，您可以详细描述服务的内容、流程和特点，增强客户对服务的理解和信任。

联系信息字段详解

基本联系信息

更多联系方式

应用场景

联系信息字段适用于创建联系我们页面、产品咨询页面或服务支持页面。通过这些字段，您可以提供多种联系方式，方便客户随时联系您。

企业特色字段详解

文章特色标记

企业资质信息

应用场景

企业特色字段适用于创建企业介绍页面、企业新闻或重点推荐内容。通过这些字段，您可以突出展示企业的实力和特色，增强企业形象。

案例展示字段详解

基本案例信息

案例详情

应用场景

案例展示字段适用于创建成功案例页面、项目展示或行业解决方案页面。通过这些字段，您可以全面展示项目的过程和成果，展现企业的专业能力。

SEO相关字段详解

应用场景

SEO相关字段适用于所有类型的文章，用于优化文章在搜索引擎中的表现，提高网站流量和曝光度。

常见问题解答

Q1: 是否必须填写所有自定义字段？

A: 不需要填写所有字段，只需根据文章类型填写相关字段即可。系统只会显示已填写的字段。

Q2: 自定义字段支持HTML代码吗？

A: 多行文本类型的字段（如product_specs、service_features等）支持HTML代码，可以使用HTML格式化文本。

Q3: 如何在前台展示自定义字段？

A: 亿纸鱼企业主题已经预设了自定义字段的展示模板，填写字段后会自动在相应位置显示。无需额外设置。

Q4: 如何设置文章特色标记？

A: 在文章编辑页面，找到"highlight_feature"字段，选择相应的标记（推荐/热门/新品）即可。

Q5: 产品图片如何设置？

A: 在"product_image"字段中填写图片URL，或者使用媒体库上传图片后复制URL填入。多张图片请在"product_gallery"字段中填写，以英文逗号分隔。

通过以上介绍，相信您已经对亿纸鱼企业主题的自定义字段有了全面的了解。合理利用这些字段，可以大大提升您网站的专业性和用户体验，为访客提供更加丰富和有价值的信息。