|
|
<?php
|
|
|
/**
|
|
|
* 自定义代码管理配置文件
|
|
|
* 提供后台管理界面来添加自定义JS和CSS代码
|
|
|
*/
|
|
|
|
|
|
// 防止直接访问
|
|
|
if (!defined('ABSPATH')) {
|
|
|
exit;
|
|
|
}
|
|
|
|
|
|
/**
|
|
|
* 添加自定义代码管理菜单
|
|
|
*/
|
|
|
function nenghui_add_custom_code_menu() {
|
|
|
add_theme_page(
|
|
|
'自定义代码管理', // 页面标题
|
|
|
'自定义代码', // 菜单标题
|
|
|
'edit_theme_options', // 权限要求
|
|
|
'nenghui-custom-code', // 菜单slug
|
|
|
'nenghui_custom_code_page' // 回调函数
|
|
|
);
|
|
|
|
|
|
// 添加Header/Footer代码管理子菜单
|
|
|
add_theme_page(
|
|
|
'Header/Footer代码管理',
|
|
|
'Header/Footer代码',
|
|
|
'edit_theme_options',
|
|
|
'nenghui-header-footer-code',
|
|
|
'nenghui_header_footer_admin_page'
|
|
|
);
|
|
|
}
|
|
|
add_action('admin_menu', 'nenghui_add_custom_code_menu');
|
|
|
|
|
|
/**
|
|
|
* 自定义代码管理页面
|
|
|
*/
|
|
|
function nenghui_custom_code_page() {
|
|
|
// 处理表单提交
|
|
|
if (isset($_POST['submit']) && wp_verify_nonce($_POST['nenghui_custom_code_nonce'], 'nenghui_custom_code_action')) {
|
|
|
// 保存自定义CSS
|
|
|
if (isset($_POST['custom_css'])) {
|
|
|
update_option('nenghui_custom_css', wp_unslash($_POST['custom_css']));
|
|
|
}
|
|
|
|
|
|
// 保存自定义HTML/JS
|
|
|
if (isset($_POST['custom_html'])) {
|
|
|
update_option('nenghui_custom_html', wp_unslash($_POST['custom_html']));
|
|
|
}
|
|
|
|
|
|
// 保存CSS启用状态
|
|
|
update_option('nenghui_custom_css_enabled', isset($_POST['css_enabled']) ? '1' : '0');
|
|
|
|
|
|
// 保存HTML/JS启用状态
|
|
|
update_option('nenghui_custom_html_enabled', isset($_POST['html_enabled']) ? '1' : '0');
|
|
|
|
|
|
echo '<div class="notice notice-success is-dismissible"><p>设置已保存！</p></div>';
|
|
|
}
|
|
|
|
|
|
// 获取当前设置
|
|
|
$custom_css = get_option('nenghui_custom_css', '');
|
|
|
$custom_html = get_option('nenghui_custom_html', '');
|
|
|
$css_enabled = get_option('nenghui_custom_css_enabled', '1');
|
|
|
$html_enabled = get_option('nenghui_custom_html_enabled', '1');
|
|
|
|
|
|
?>
|
|
|
<div class="wrap">
|
|
|
<h1>自定义代码管理</h1>
|
|
|
<p>在这里可以添加自定义的CSS和JavaScript代码，这些代码将在网站前端加载。</p>
|
|
|
|
|
|
<form method="post" action="">
|
|
|
<?php wp_nonce_field('nenghui_custom_code_action', 'nenghui_custom_code_nonce'); ?>
|
|
|
|
|
|
<div class="nenghui-custom-code-section">
|
|
|
<h2>自定义CSS</h2>
|
|
|
<p class="description">添加自定义CSS样式代码，无需包含 <style> 标签。</p>
|
|
|
|
|
|
<label for="css_enabled">
|
|
|
<input type="checkbox" id="css_enabled" name="css_enabled" value="1" <?php checked($css_enabled, '1'); ?>>
|
|
|
启用自定义CSS
|
|
|
</label>
|
|
|
|
|
|
<div class="nenghui-code-editor">
|
|
|
<textarea
|
|
|
id="custom_css"
|
|
|
name="custom_css"
|
|
|
rows="15"
|
|
|
cols="100"
|
|
|
placeholder="/* 在这里输入您的CSS代码 */
|
|
|
.my-custom-class {
|
|
|
color: #333;
|
|
|
font-size: 16px;
|
|
|
}"
|
|
|
class="large-text code"
|
|
|
><?php echo esc_textarea($custom_css); ?></textarea>
|
|
|
</div>
|
|
|
</div>
|
|
|
|
|
|
<div class="nenghui-custom-code-section">
|
|
|
<h2>自定义HTML/JavaScript</h2>
|
|
|
<p class="description">添加自定义HTML和JavaScript代码，支持完整的HTML标签。代码将在页面底部加载。</p>
|
|
|
|
|
|
<label for="html_enabled">
|
|
|
<input type="checkbox" id="html_enabled" name="html_enabled" value="1" <?php checked($html_enabled, '1'); ?>>
|
|
|
启用自定义HTML/JavaScript
|
|
|
</label>
|
|
|
|
|
|
<div class="nenghui-code-editor">
|
|
|
<textarea
|
|
|
id="custom_html"
|
|
|
name="custom_html"
|
|
|
rows="15"
|
|
|
cols="100"
|
|
|
placeholder="<!-- 在这里输入您的HTML和JavaScript代码 -->
|
|
|
<script>
|
|
|
jQuery(document).ready(function($) {
|
|
|
// 您的JavaScript代码
|
|
|
console.log('自定义HTML/JS已加载');
|
|
|
});
|
|
|
</script>
|
|
|
|
|
|
<!-- 您也可以添加HTML元素 -->
|
|
|
<div id='custom-element' style='display:none;'>
|
|
|
<p>这是自定义HTML内容</p>
|
|
|
</div>"
|
|
|
class="large-text code"
|
|
|
><?php echo esc_textarea($custom_html); ?></textarea>
|
|
|
</div>
|
|
|
</div>
|
|
|
|
|
|
<div class="nenghui-custom-code-tips">
|
|
|
<h3>💡 使用提示</h3>
|
|
|
<ul>
|
|
|
<li><strong>CSS代码：</strong>直接输入CSS规则，系统会自动包装在 <style> 标签中</li>
|
|
|
<li><strong>HTML/JavaScript代码：</strong>支持完整的HTML标签，包括script、div、span等</li>
|
|
|
<li><strong>jQuery支持：</strong>主题已加载jQuery，可以直接使用 $ 或 jQuery</li>
|
|
|
<li><strong>HTML元素：</strong>可以添加自定义的HTML元素和内联样式</li>
|
|
|
<li><strong>代码安全：</strong>请确保代码来源可靠，避免添加恶意代码</li>
|
|
|
<li><strong>测试建议：</strong>添加代码后请在前端测试效果，确保没有错误</li>
|
|
|
</ul>
|
|
|
</div>
|
|
|
|
|
|
<?php submit_button('保存设置'); ?>
|
|
|
</form>
|
|
|
</div>
|
|
|
|
|
|
<style>
|
|
|
.nenghui-custom-code-section {
|
|
|
background: #fff;
|
|
|
border: 1px solid #ccd0d4;
|
|
|
border-radius: 4px;
|
|
|
padding: 20px;
|
|
|
margin: 20px 0;
|
|
|
}
|
|
|
|
|
|
.nenghui-custom-code-section h2 {
|
|
|
margin-top: 0;
|
|
|
color: #23282d;
|
|
|
border-bottom: 1px solid #eee;
|
|
|
padding-bottom: 10px;
|
|
|
}
|
|
|
|
|
|
.nenghui-code-editor {
|
|
|
margin-top: 15px;
|
|
|
}
|
|
|
|
|
|
.nenghui-code-editor textarea {
|
|
|
font-family: 'Monaco', 'Menlo', 'Ubuntu Mono', monospace;
|
|
|
font-size: 13px;
|
|
|
line-height: 1.4;
|
|
|
background: #f9f9f9;
|
|
|
border: 1px solid #ddd;
|
|
|
border-radius: 4px;
|
|
|
padding: 15px;
|
|
|
width: 100%;
|
|
|
box-sizing: border-box;
|
|
|
resize: vertical;
|
|
|
}
|
|
|
|
|
|
.nenghui-code-editor textarea:focus {
|
|
|
border-color: #007cba;
|
|
|
box-shadow: 0 0 0 1px #007cba;
|
|
|
outline: none;
|
|
|
}
|
|
|
|
|
|
.nenghui-custom-code-tips {
|
|
|
background: #f0f6fc;
|
|
|
border: 1px solid #c6e2ff;
|
|
|
border-radius: 4px;
|
|
|
padding: 20px;
|
|
|
margin: 20px 0;
|
|
|
}
|
|
|
|
|
|
.nenghui-custom-code-tips h3 {
|
|
|
margin-top: 0;
|
|
|
color: #0366d6;
|
|
|
}
|
|
|
|
|
|
.nenghui-custom-code-tips ul {
|
|
|
margin: 10px 0;
|
|
|
padding-left: 20px;
|
|
|
}
|
|
|
|
|
|
.nenghui-custom-code-tips li {
|
|
|
margin: 8px 0;
|
|
|
line-height: 1.5;
|
|
|
}
|
|
|
|
|
|
.nenghui-custom-code-section label {
|
|
|
display: inline-block;
|
|
|
margin-bottom: 10px;
|
|
|
font-weight: 600;
|
|
|
}
|
|
|
|
|
|
.nenghui-custom-code-section input[type="checkbox"] {
|
|
|
margin-right: 8px;
|
|
|
}
|
|
|
</style>
|
|
|
<?php
|
|
|
}
|
|
|
|
|
|
/**
|
|
|
* 在前端输出自定义CSS
|
|
|
*/
|
|
|
function nenghui_output_custom_css() {
|
|
|
$css_enabled = get_option('nenghui_custom_css_enabled', '1');
|
|
|
$custom_css = get_option('nenghui_custom_css', '');
|
|
|
|
|
|
if ($css_enabled === '1' && !empty($custom_css)) {
|
|
|
echo "\n<!-- 自定义CSS开始 -->\n";
|
|
|
echo '<style type="text/css" id="nenghui-custom-css">' . "\n";
|
|
|
echo wp_strip_all_tags($custom_css);
|
|
|
echo "\n</style>\n";
|
|
|
echo "<!-- 自定义CSS结束 -->\n";
|
|
|
}
|
|
|
}
|
|
|
add_action('wp_head', 'nenghui_output_custom_css', 999);
|
|
|
|
|
|
/**
|
|
|
* 在前端输出自定义HTML/JavaScript
|
|
|
*/
|
|
|
function nenghui_output_custom_html() {
|
|
|
$html_enabled = get_option('nenghui_custom_html_enabled', '1');
|
|
|
$custom_html = get_option('nenghui_custom_html', '');
|
|
|
|
|
|
if ($html_enabled === '1' && !empty($custom_html)) {
|
|
|
echo "\n<!-- 自定义HTML/JavaScript开始 -->\n";
|
|
|
echo '<div id="nenghui-custom-html-container">' . "\n";
|
|
|
|
|
|
// 检查用户权限，只有管理员或编辑者才能使用此功能
|
|
|
if (current_user_can('edit_theme_options')) {
|
|
|
// 对于有权限的用户，直接输出HTML内容（已在后台进行基本验证）
|
|
|
echo wp_unslash($custom_html);
|
|
|
} else {
|
|
|
// 对于其他情况，进行严格的安全过滤
|
|
|
echo wp_kses($custom_html, array(
|
|
|
'script' => array(
|
|
|
'type' => array(),
|
|
|
'src' => array(),
|
|
|
'async' => array(),
|
|
|
'defer' => array()
|
|
|
),
|
|
|
'div' => array(
|
|
|
'id' => array(),
|
|
|
'class' => array(),
|
|
|
'style' => array()
|
|
|
),
|
|
|
'span' => array(
|
|
|
'id' => array(),
|
|
|
'class' => array(),
|
|
|
'style' => array()
|
|
|
),
|
|
|
'p' => array(
|
|
|
'id' => array(),
|
|
|
'class' => array(),
|
|
|
'style' => array()
|
|
|
),
|
|
|
'a' => array(
|
|
|
'href' => array(),
|
|
|
'target' => array(),
|
|
|
'id' => array(),
|
|
|
'class' => array(),
|
|
|
'style' => array()
|
|
|
),
|
|
|
'img' => array(
|
|
|
'src' => array(),
|
|
|
'alt' => array(),
|
|
|
'width' => array(),
|
|
|
'height' => array(),
|
|
|
'id' => array(),
|
|
|
'class' => array(),
|
|
|
'style' => array()
|
|
|
),
|
|
|
'h1' => array('id' => array(), 'class' => array(), 'style' => array()),
|
|
|
'h2' => array('id' => array(), 'class' => array(), 'style' => array()),
|
|
|
'h3' => array('id' => array(), 'class' => array(), 'style' => array()),
|
|
|
'h4' => array('id' => array(), 'class' => array(), 'style' => array()),
|
|
|
'h5' => array('id' => array(), 'class' => array(), 'style' => array()),
|
|
|
'h6' => array('id' => array(), 'class' => array(), 'style' => array()),
|
|
|
'ul' => array('id' => array(), 'class' => array(), 'style' => array()),
|
|
|
'ol' => array('id' => array(), 'class' => array(), 'style' => array()),
|
|
|
'li' => array('id' => array(), 'class' => array(), 'style' => array()),
|
|
|
'br' => array(),
|
|
|
'strong' => array('id' => array(), 'class' => array(), 'style' => array()),
|
|
|
'em' => array('id' => array(), 'class' => array(), 'style' => array()),
|
|
|
'b' => array('id' => array(), 'class' => array(), 'style' => array()),
|
|
|
'i' => array('id' => array(), 'class' => array(), 'style' => array())
|
|
|
));
|
|
|
}
|
|
|
|
|
|
echo "\n</div>\n";
|
|
|
echo "<!-- 自定义HTML/JavaScript结束 -->\n";
|
|
|
}
|
|
|
}
|
|
|
add_action('wp_footer', 'nenghui_output_custom_html', 999);
|
|
|
|
|
|
/**
|
|
|
* 为自定义代码管理页面添加帮助信息
|
|
|
*/
|
|
|
function nenghui_add_custom_code_help() {
|
|
|
$screen = get_current_screen();
|
|
|
if ($screen && $screen->id === 'appearance_page_nenghui-custom-code') {
|
|
|
$screen->add_help_tab(array(
|
|
|
'id' => 'nenghui-custom-code-help',
|
|
|
'title' => '使用帮助',
|
|
|
'content' => '<h3>自定义代码管理帮助</h3>' .
|
|
|
'<h4>CSS代码示例：</h4>' .
|
|
|
'<pre>/* 修改标题颜色 */\n' .
|
|
|
'h1, h2, h3 {\n' .
|
|
|
' color: #333;\n' .
|
|
|
'}\n\n' .
|
|
|
'/* 自定义按钮样式 */\n' .
|
|
|
'.custom-button {\n' .
|
|
|
' background: #007cba;\n' .
|
|
|
' color: white;\n' .
|
|
|
' padding: 10px 20px;\n' .
|
|
|
' border-radius: 4px;\n' .
|
|
|
'}</pre>' .
|
|
|
'<h4>JavaScript代码示例：</h4>' .
|
|
|
'<pre>// 页面加载完成后执行\n' .
|
|
|
'jQuery(document).ready(function($) {\n' .
|
|
|
' // 添加点击事件\n' .
|
|
|
' $(".custom-button").click(function() {\n' .
|
|
|
' alert("按钮被点击了！");\n' .
|
|
|
' });\n' .
|
|
|
'});\n\n' .
|
|
|
'// 原生JavaScript示例\n' .
|
|
|
'document.addEventListener("DOMContentLoaded", function() {\n' .
|
|
|
' console.log("页面加载完成");\n' .
|
|
|
'});</pre>' .
|
|
|
'<h4>注意事项：</h4>' .
|
|
|
'<ul>' .
|
|
|
'<li>CSS代码会在页面头部加载</li>' .
|
|
|
'<li>JavaScript代码会在页面底部加载</li>' .
|
|
|
'<li>可以随时启用或禁用代码而不删除内容</li>' .
|
|
|
'<li>建议在测试环境中先测试代码效果</li>' .
|
|
|
'</ul>'
|
|
|
));
|
|
|
|
|
|
$screen->set_help_sidebar(
|
|
|
'<p><strong>相关链接：</strong></p>' .
|
|
|
'<p><a href="https://developer.mozilla.org/zh-CN/docs/Web/CSS" target="_blank">CSS文档</a></p>' .
|
|
|
'<p><a href="https://developer.mozilla.org/zh-CN/docs/Web/JavaScript" target="_blank">JavaScript文档</a></p>' .
|
|
|
'<p><a href="https://jquery.com/" target="_blank">jQuery官网</a></p>'
|
|
|
);
|
|
|
}
|
|
|
}
|
|
|
add_action('current_screen', 'nenghui_add_custom_code_help');
|
|
|
|
|
|
/**
|
|
|
* Header/Footer代码管理页面
|
|
|
*/
|
|
|
function nenghui_header_footer_admin_page() {
|
|
|
// 处理表单提交
|
|
|
if (isset($_POST['submit']) && wp_verify_nonce($_POST['nenghui_header_footer_nonce'], 'nenghui_header_footer_action')) {
|
|
|
// 保存Header代码
|
|
|
if (isset($_POST['header_code'])) {
|
|
|
update_option('nenghui_header_code_content', wp_unslash($_POST['header_code']));
|
|
|
}
|
|
|
|
|
|
// 保存Footer代码
|
|
|
if (isset($_POST['footer_code'])) {
|
|
|
update_option('nenghui_footer_code_content', wp_unslash($_POST['footer_code']));
|
|
|
}
|
|
|
|
|
|
// 保存启用状态
|
|
|
update_option('nenghui_header_code_enabled', isset($_POST['header_enabled']) ? '1' : '0');
|
|
|
update_option('nenghui_footer_code_enabled', isset($_POST['footer_enabled']) ? '1' : '0');
|
|
|
|
|
|
echo '<div class="notice notice-success is-dismissible"><p>Header/Footer代码设置已保存！</p></div>';
|
|
|
}
|
|
|
|
|
|
// 获取当前设置
|
|
|
$header_code = get_option('nenghui_header_code_content', '');
|
|
|
$footer_code = get_option('nenghui_footer_code_content', '');
|
|
|
$header_enabled = get_option('nenghui_header_code_enabled', '0');
|
|
|
$footer_enabled = get_option('nenghui_footer_code_enabled', '0');
|
|
|
|
|
|
?>
|
|
|
<div class="wrap">
|
|
|
<h1>Header/Footer自定义代码管理</h1>
|
|
|
<p>在这里可以管理网站头部和底部的自定义HTML代码，如统计代码、验证代码、客服代码等。</p>
|
|
|
|
|
|
<form method="post" action="">
|
|
|
<?php wp_nonce_field('nenghui_header_footer_action', 'nenghui_header_footer_nonce'); ?>
|
|
|
|
|
|
<div class="nenghui-code-section">
|
|
|
<h2>🔝 Header自定义代码</h2>
|
|
|
<p class="description">这些代码将在网站头部（<head>标签内）加载，适合放置统计代码、验证代码、meta标签等。</p>
|
|
|
|
|
|
<label for="header_enabled">
|
|
|
<input type="checkbox" id="header_enabled" name="header_enabled" value="1" <?php checked($header_enabled, '1'); ?>>
|
|
|
启用Header自定义代码
|
|
|
</label>
|
|
|
|
|
|
<div class="nenghui-code-editor">
|
|
|
<textarea
|
|
|
id="header_code"
|
|
|
name="header_code"
|
|
|
rows="12"
|
|
|
cols="100"
|
|
|
placeholder="<!-- 示例：Google Analytics代码 -->
|
|
|
<script async src="https://www.googletagmanager.com/gtag/js?id=GA_MEASUREMENT_ID"></script>
|
|
|
<script>
|
|
|
window.dataLayer = window.dataLayer || [];
|
|
|
function gtag(){dataLayer.push(arguments);}
|
|
|
gtag('js', new Date());
|
|
|
gtag('config', 'GA_MEASUREMENT_ID');
|
|
|
</script>"
|
|
|
class="large-text code"
|
|
|
><?php echo esc_textarea($header_code); ?></textarea>
|
|
|
</div>
|
|
|
</div>
|
|
|
|
|
|
<div class="nenghui-code-section">
|
|
|
<h2>🔻 Footer自定义代码</h2>
|
|
|
<p class="description">这些代码将在网站底部（</body>标签前）加载，适合放置客服代码、统计代码、自定义JavaScript等。</p>
|
|
|
|
|
|
<label for="footer_enabled">
|
|
|
<input type="checkbox" id="footer_enabled" name="footer_enabled" value="1" <?php checked($footer_enabled, '1'); ?>>
|
|
|
启用Footer自定义代码
|
|
|
</label>
|
|
|
|
|
|
<div class="nenghui-code-editor">
|
|
|
<textarea
|
|
|
id="footer_code"
|
|
|
name="footer_code"
|
|
|
rows="12"
|
|
|
cols="100"
|
|
|
placeholder="<!-- 示例：客服代码 -->
|
|
|
<script>
|
|
|
(function() {
|
|
|
var script = document.createElement('script');
|
|
|
script.src = 'https://example.com/chat.js';
|
|
|
document.body.appendChild(script);
|
|
|
})();
|
|
|
</script>"
|
|
|
class="large-text code"
|
|
|
><?php echo esc_textarea($footer_code); ?></textarea>
|
|
|
</div>
|
|
|
</div>
|
|
|
|
|
|
<?php submit_button('保存Header/Footer代码设置'); ?>
|
|
|
</form>
|
|
|
</div>
|
|
|
|
|
|
<style>
|
|
|
.nenghui-code-section {
|
|
|
background: #fff;
|
|
|
border: 1px solid #ccd0d4;
|
|
|
border-radius: 6px;
|
|
|
padding: 25px;
|
|
|
margin: 25px 0;
|
|
|
box-shadow: 0 1px 3px rgba(0,0,0,0.1);
|
|
|
}
|
|
|
|
|
|
.nenghui-code-section h2 {
|
|
|
margin-top: 0;
|
|
|
color: #23282d;
|
|
|
border-bottom: 2px solid #0073aa;
|
|
|
padding-bottom: 10px;
|
|
|
font-size: 18px;
|
|
|
}
|
|
|
|
|
|
.nenghui-code-section label {
|
|
|
display: inline-block;
|
|
|
margin-bottom: 15px;
|
|
|
font-weight: 600;
|
|
|
color: #23282d;
|
|
|
}
|
|
|
|
|
|
.nenghui-code-section input[type="checkbox"] {
|
|
|
margin-right: 8px;
|
|
|
transform: scale(1.1);
|
|
|
}
|
|
|
</style>
|
|
|
<?php
|
|
|
}
|
|
|
|
|
|
/**
|
|
|
* 在网站头部输出自定义Header代码
|
|
|
*/
|
|
|
function nenghui_output_header_code() {
|
|
|
$header_enabled = get_option('nenghui_header_code_enabled', '0');
|
|
|
$header_code = get_option('nenghui_header_code_content', '');
|
|
|
|
|
|
if ($header_enabled === '1' && !empty($header_code)) {
|
|
|
echo "\n<!-- Nenghui自定义Header代码开始 -->\n";
|
|
|
echo wp_unslash($header_code);
|
|
|
echo "\n<!-- Nenghui自定义Header代码结束 -->\n";
|
|
|
}
|
|
|
}
|
|
|
add_action('wp_head', 'nenghui_output_header_code', 998);
|
|
|
|
|
|
/**
|
|
|
* 在网站底部输出自定义Footer代码
|
|
|
*/
|
|
|
function nenghui_output_footer_code() {
|
|
|
$footer_enabled = get_option('nenghui_footer_code_enabled', '0');
|
|
|
$footer_code = get_option('nenghui_footer_code_content', '');
|
|
|
|
|
|
if ($footer_enabled && !empty($footer_code)) {
|
|
|
echo "\n<!-- Nenghui自定义Footer代码开始 -->\n";
|
|
|
echo wp_unslash($footer_code);
|
|
|
echo "\n<!-- Nenghui自定义Footer代码结束 -->\n";
|
|
|
}
|
|
|
}
|
|
|
add_action('wp_footer', 'nenghui_output_footer_code', 998);
|
|
|
|
|
|
?>
|
