主题模板开发文档

开发包

请根据现有主题二开 参考

目录结构

建议目录结构如下
/                                        # 网站根目录
└── template                            # 主题目录（主题上传目录）
        ├── HuanYing                   # 主题文件夹 (必须)
            ├── index.php                # 主题入口文件 (必须)
            └── config.php                # 主题主题说明 （必须）  自定义设置配置文件 (可选)
            ├── css                        # css目录
                └── style.css            # css文件
            ├── js                        # js目录
                └── script.js            # js文件

文件说明

主题信息

文件：config.php

格式：json

说明：所有参数必填，支持HTML标签

<?php
return [
    'name' => '我的主题',
    'zuozhe' => '开发者',
    'version' => '1.0',
    'jieshao' => '主题介绍',
    
    // 主题自定义配置
    'theme_config' => [
        [
            'type' => 'text',
            'name' => 'site_title',
            'title' => '网站标题',
            'description' => '显示在浏览器标签页的标题',
            'value' => '我的网站',
            'placeholder' => '请输入网站标题'
        ],
        [
            'type' => 'select',
            'name' => 'layout_style',
            'title' => '布局样式',
            'description' => '选择页面布局样式',
            'value' => 'default',
            'enum' => [
                'default' => '默认布局',
                'wide' => '宽屏布局',
                'narrow' => '窄屏布局'
            ]
        ],
        [
            'type' => 'textarea',
            'name' => 'custom_css',
            'title' => '自定义CSS',
            'description' => '添加自定义样式代码，<code>支持CSS语法</code>',
            'value' => '',
            'placeholder' => '请输入CSS代码'
        ],
        [
            'type' => 'radio',
            'name' => 'show_sidebar',
            'title' => '显示侧边栏',
            'description' => '是否显示侧边栏',
            'value' => '1',
            'enum' => [
                '1' => '显示',
                '0' => '隐藏'
            ]
        ],
        [
            'type' => 'checkbox',
            'name' => 'show_features',
            'title' => '显示功能',
            'description' => '选择要显示的功能模块',
            'value' => '1,2',
            'enum' => [
                '1' => '域名解析',
                '2' => 'DNS查询',
                '3' => 'Whois查询',
                '4' => 'Ping测试'
            ]
        ],
        [
            'type' => 'color',
            'name' => 'theme_color',
            'title' => '主题颜色',
            'description' => '设置网站主题颜色',
            'value' => '#1890ff',
            'placeholder' => '#1890ff'
        ]
    ]
];
?>

参数说明

如上演示代码说明

自定义表单

• 支持多种表单类型：text、textarea、select、radio、checkbox、color

• 自动保存和读取配置数据

• 支持HTML描述和链接

• 支持验证规则

• 响应式表单界面

• 实时预览和保存

配置项类型说明

1. text（单行文本）

[
    'type' => 'text',
    'name' => 'site_title',
    'title' => '网站标题',
    'description' => '显示在浏览器标签页的标题',
    'value' => '我的网站',
    'placeholder' => '请输入网站标题'
]

2. textarea（多行文本）

[
    'type' => 'textarea',
    'name' => 'custom_css',
    'title' => '自定义CSS',
    'description' => '添加自定义样式代码',
    'value' => '',
    'placeholder' => '请输入CSS代码'
]

3. select（下拉菜单）

[
    'type' => 'select',
    'name' => 'layout_style',
    'title' => '布局样式',
    'description' => '选择页面布局样式',
    'value' => 'default',
    'enum' => [
        'default' => '默认布局',
        'wide' => '宽屏布局',
        'narrow' => '窄屏布局'
    ]
]

4. radio（单选按钮）

[
    'type' => 'radio',
    'name' => 'show_sidebar',
    'title' => '显示侧边栏',
    'description' => '是否显示侧边栏',
    'value' => '1',
    'enum' => [
        '1' => '显示',
        '0' => '隐藏'
    ]
]

5. checkbox（多选框）

[
    'type' => 'checkbox',
    'name' => 'show_features',
    'title' => '显示功能',
    'description' => '选择要显示的功能模块',
    'value' => '1,2',
    'enum' => [
        '1' => '域名解析',
        '2' => 'DNS查询',
        '3' => 'Whois查询',
        '4' => 'Ping测试'
    ]
]

6. color（颜色选择器）

[
    'type' => 'color',
    'name' => 'theme_color',
    'title' => '主题颜色',
    'description' => '设置网站主题颜色',
    'value' => '#1890ff',
    'placeholder' => '#1890ff'
]

实例演示

<?php
// 获取配置值
$site_title = theme_config('site_title', '默认标题');
$layout_style = theme_config('layout_style', 'default');
$show_sidebar = theme_config('show_sidebar', '1');
$theme_color = theme_config('theme_color', '#1890ff');

// 使用配置
echo '<title>' . $site_title . '</title>';
echo '<div class="layout-' . $layout_style . '">';

if ($show_sidebar == '1') {
    echo '<div class="sidebar">侧边栏内容</div>';
}

echo '<style>
    .primary-color { color: ' . $theme_color . '; }
    .primary-bg { background-color: ' . $theme_color . '; }
</style>';

// 处理多选值
$show_features = theme_config('show_features', '1,2');
$features_array = explode(',', $show_features);

$features = [
    '1' => ['name' => '域名解析', 'url' => '/dns'],
    '2' => ['name' => 'DNS查询', 'url' => '/query'],
    '3' => ['name' => 'Whois查询', 'url' => '/whois'],
    '4' => ['name' => 'Ping测试', 'url' => '/ping']
];

foreach ($features as $id => $feature) {
    if (in_array($id, $features_array)) {
        echo '<a href="' . $feature['url'] . '">' . $feature['name'] . '</a>';
    }
}

/ 示例1：获取首页提示内容
$home_title = theme_config('home_title', '欢迎使用域名解析系统');
echo '<div class="home-notice">' . $home_title . '</div>';

// 示例2：今日热榜功能
if (theme_config('lytoday', 0) == 1) {
    // 显示在搜索栏下方
    echo '<div class="search-area">';
    echo '<!-- 搜索栏内容 -->';
    echo '</div>';
    echo theme_config('lytodaycode');
} elseif (theme_config('lytoday', 0) == 2) {
    // 显示在底部
    echo '<!-- 页面内容 -->';
    echo theme_config('lytodaycode');
}

// 示例3：背景图片位置
$bg_position = theme_config('background_position', '0');
if ($bg_position == '1') {
    echo '<style>.bg-image { background-attachment: fixed; }</style>';
} else {
    echo '<style>.bg-image { background-attachment: scroll; }</style>';
}

// 示例4：公安备案号
if (!empty(theme_config('gonganbei', ""))) {
    // 使用正则提取备案号数字拼接到备案官网
    preg_match_all('/\d+/', theme_config('gonganbei'), $gab);
    if (!empty($gab[0])) {
        echo '<a class="icp" href="http://www.beian.gov.cn/portal/registerSystemInfo?recordcode=' . $gab[0][0] . '" target="_blank" rel="nofollow noopener">
            <img src="/assets/img/icp.png" alt="公安网备" width="16" height="16">' . theme_config('gonganbei') . ' </a>';
    }
}

// 示例5：主题颜色
$theme_color = theme_config('theme_color', '#1890ff');
echo '<style>
    .primary-color { color: ' . $theme_color . '; }
    .primary-bg { background-color: ' . $theme_color . '; }
    .primary-border { border-color: ' . $theme_color . '; }
</style>';

// 示例6：功能模块显示控制
$show_features = theme_config('show_features', '1,2');
$features_array = explode(',', $show_features);

$features = [
    1 => ['name' => '域名解析', 'url' => '/dns'],
    2 => ['name' => 'DNS查询', 'url' => '/query'],
    3 => ['name' => 'Whois查询', 'url' => '/whois'],
    4 => ['name' => 'Ping测试', 'url' => '/ping']
];

echo '<div class="features">';
foreach ($features as $id => $feature) {
    if (in_array($id, $features_array)) {
        echo '<a href="' . $feature['url'] . '" class="feature-item">' . $feature['name'] . '</a>';
    }
}
echo '</div>';

// 示例7：条件判断
if (theme_config('show_sidebar', 1) == 1) {
    echo '<div class="sidebar">侧边栏内容</div>';
}

// 示例8：获取数组类型的配置
$social_links = theme_config('social_links', []);
if (!empty($social_links)) {
    echo '<div class="social-links">';
    foreach ($social_links as $platform => $url) {
        echo '<a href="' . $url . '" target="_blank" class="social-' . $platform . '">' . $platform . '</a>';
    }
    echo '</div>';
}

// 示例9：使用配置进行样式控制
$layout_style = theme_config('layout_style', 'default');
echo '<div class="layout-' . $layout_style . '">';

// 示例10：动态内容显示
$welcome_message = theme_config('welcome_message', '');
if (!empty($welcome_message)) {
    echo '<div class="welcome-message">' . $welcome_message . '</div>';
}

// 示例11：功能开关
if (theme_config('enable_analytics', 0) == 1) {
    $analytics_code = theme_config('analytics_code', '');
    if (!empty($analytics_code)) {
        echo $analytics_code;
    }
}

// 示例12：自定义CSS
$custom_css = theme_config('custom_css', '');
if (!empty($custom_css)) {
    echo '<style>' . $custom_css . '</style>';
}

// 示例13：自定义JS
$custom_js = theme_config('custom_js', '');
if (!empty($custom_js)) {
    echo '<script>' . $custom_js . '</script>';
}

// 示例14：多语言支持
$language = theme_config('language', 'zh-CN');
$translations = [
    'zh-CN' => ['welcome' => '欢迎', 'search' => '搜索'],
    'en-US' => ['welcome' => 'Welcome', 'search' => 'Search']
];
$current_translations = isset($translations[$language]) ? $translations[$language] : $translations['zh-CN'];

echo '<div class="welcome">' . $current_translations['welcome'] . '</div>';
echo '<input type="text" placeholder="' . $current_translations['search'] . '">';

// 示例15：响应式设置
$mobile_friendly = theme_config('mobile_friendly', 1);
if ($mobile_friendly == 1) {
    echo '<meta name="viewport" content="width=device-width, initial-scale=1.0">';
}


?>

函数说明

theme_config($name, $default = false)

获取主题配置值

参数：

- $name (string): 配置项名称

- $default (mixed): 默认值，当配置项不存在时返回

返回值：

- 配置项的值，如果不存在则返回默认值

示例：

// 获取网站标题，如果不存在则返回"默认标题"

$title = theme_config('site_title', '默认标题');

// 获取布局样式，如果不存在则返回"default"

$layout = theme_config('layout_style', 'default');

// 获取布尔值配置

if (theme_config('show_sidebar', 1) == 1) {

    echo '显示侧边栏';

}

高级用法

1. 条件渲染

<?php
// 根据配置决定是否显示某个功能
if (theme_config('enable_analytics', 0) == 1) {
    $analytics_code = theme_config('analytics_code', '');
    if (!empty($analytics_code)) {
        echo $analytics_code;
    }
}
?>

2. 动态样式

<?php
$theme_color = theme_config('theme_color', '#1890ff');
$bg_image = theme_config('bg_image', '');
?>
<style>
    .theme-color { color: <?php echo $theme_color; ?>; }
    <?php if (!empty($bg_image)): ?>
    body { background-image: url('<?php echo $bg_image; ?>'); }
    <?php endif; ?>
</style>

3. 多语言支持

<?php
$language = theme_config('language', 'zh-CN');
$translations = [
    'zh-CN' => ['welcome' => '欢迎', 'search' => '搜索'],
    'en-US' => ['welcome' => 'Welcome', 'search' => 'Search']
];
$current_translations = isset($translations[$language]) ? $translations[$language] : $translations['zh-CN'];
?>
<div class="welcome"><?php echo $current_translations['welcome']; ?></div>

4. 功能模块控制

<?php
$enabled_modules = theme_config('enabled_modules', '1,2,3');
$modules_array = explode(',', $enabled_modules);

$all_modules = [
    '1' => ['name' => '用户管理', 'icon' => 'user'],
    '2' => ['name' => '内容管理', 'icon' => 'content'],
    '3' => ['name' => '系统设置', 'icon' => 'setting'],
    '4' => ['name' => '数据统计', 'icon' => 'stats']
];

foreach ($all_modules as $id => $module) {
    if (in_array($id, $modules_array)) {
        echo '<div class="module-item">';
        echo '<i class="icon-' . $module['icon'] . '"></i>';
        echo '<span>' . $module['name'] . '</span>';
        echo '</div>';
    }
}
?>