Switch 语句不会更改 WordPress 主题选项页面中的 CSS

发布于 2024-12-16 00:47:31 字数 5608 浏览 3 评论 0原文

我正在为我的新主题创建一个主题选项页面,并设置一些单选按钮以在用户单击每个按钮时更改样式。保存更改后,应该将样式表添加到主题的标题中。它无法正常工作。我认为我的 switch 语句可能写错了。我正在使用 WordPress 的设置 API。下面是大部分有问题的代码。

function mxs_admin_init() {
    register_setting(
    'mixinstyles_theme_options',
    'mixinstyles_theme_options',
     'mixinstyles_options_validate'
);
    add_settings_section(
    'mixinstyles_main',
    'Mixin' Styles Settings',
    'theming_section_text',
    'mixinstyles'
    );
    add_settings_field(
    'custom_style_buttons',
    '<strong>Color Schemes</strong>',
    'custom_style_buttons',
    'mixinstyles',
    'mixinstyles_main'
    );
}
        ...
function mxs_theme_options_page() { ?>
    <div class="wrap" style="margin-bottom: 20px;">
    <div id="icon-themes" class="icon32"><br /></div><h2>Mixin' Styles Theme Options</h2>
        <?php if($_REQUEST['settings-updated'] == 'true') {
        echo '<div id="message" class="updated fade"><p>Mixin&apos; Styles options saved.</p></div>';
        } ?>
    <form action="options.php" method="post" name="options_form">
    <?php settings_fields('mixinstyles_theme_options'); ?>
    <?php do_settings_sections('mixinstyles'); ?>
    <div style="text-align: center; padding: 20px;"><input name="Submit" class="button-primary" type="submit" value="<?php esc_attr_e('Save Changes'); ?>" /></div>
    </form>
    </div>
<?php
}
...
function custom_style_buttons() { 
    $options = get_option('mixinstyles_theme_options');
    echo "<div class='radiobutton-wrap'> \n";
    echo "<div class='radiobutton-padding'> \n <input type='radio' id='default_style' value='default_style' name='mixinstyles_theme_options[custom_style_buttons]' /><img src='" . get_bloginfo('template_directory') . "/images/default_screenshot.png' alt='Default style' /><br /><label for='default_style'>Default Style</label> </div> \n";
    echo "<div class='radiobutton-padding'> \n <input type='radio' style='padding-left: 10px; padding-right: 10px;' id='blue_orange' value='blue_orange' name='mixinstyles_theme_options[custom_style_buttons]' /><img src='" . get_bloginfo('template_directory') . "/images/blueorange_screenshot.png' alt='Blue/Orange style' /><br /><label for='blue_orange'>Blue/Orange</label> </div> \n";
    echo "<div class='radiobutton-padding'> \n <input type='radio' id='violet_yellow' value='violet_yellow' name='mixinstyles_theme_options[custom_style_buttons]' /><img src='" . get_bloginfo('template_directory') . "/images/violetyellow_screenshot.png' alt='Violet/Yellow style' /><br /><label for='violet_yellow'>Violet/Yellow</label> </div> \n";
    echo "</div> \n";
    echo "<div class='radiobutton-wrap'> \n";
    echo "<div class='radiobutton-padding'> \n <input type='radio' id='magenta_green' value='magenta_green' name='mixinstyles_theme_options[custom_style_buttons]' /><img src='" . get_bloginfo('template_directory') . "/images/magentagreen_screenshot.png' alt='Magenta/Green style' /><br /><label for='magenta_green'>Magenta/Green</label></div> \n";
    echo "<div class='radiobutton-padding'> \n <input type='radio' id='orange_blue' value='orange_blue' name='mixinstyles_theme_options[custom_style_buttons]' /><img src='" . get_bloginfo('template_directory') . "/images/orangeblue_screenshot.png' alt='Orange/Blue style' /><br /><label for='orange_blue'>Orange/Blue</label></div> \n";
    echo "<div class='radiobutton-padding'> \n <input type='radio' id='yellow_violet' value='yellow_violet' name='mixinstyles_theme_options[custom_style_buttons]' /><img src='" . get_bloginfo('template_directory') . "/images/yellowviolet_screenshot.png' alt='Yellow/Violet style' /><br /><label for='yellow_violet'>Yellow/Violet</label></div> \n";
    echo "</div> \n";
}
...
function mxs_style_switcher() {
    //global $mixinstyles_theme_options;
    $options = get_option('mixinstyles_theme_options');

    //$blue_orange = $options['blue_orange'];
    switch ( $options['custom_style_buttons'] ) { //opens switch statement
    case "blue_orange":
    echo '"\n" . <link rel="stylesheet" href="'; 
    bloginfo('template_directory');
    echo '/custom-styles/blue-orange.css" type="text/css" /> . "\n";';
    break;
    case "violet_yellow":
    echo '"\n" . <link rel="stylesheet" href="';
    bloginfo('template_directory');
    echo '/custom-styles/violet-yellow.css" type="text/css" /> . "\n";';
    break;
    case "magenta_green":
    echo '"\n" . <link rel="stylesheet" href="';
    bloginfo('template_directory');
    echo '/custom-styles/magenta-green.css" type="text/css" /> . "\n";';
    break;
    case "orange_blue":
    echo '"\n" . <link rel="stylesheet" href="';
    bloginfo('template_directory');
    echo '/custom-styles/orange-blue.css" type="text/css" /> . "\n";';
    break;
    case "yellow_violet":
    echo '"\n" . <link rel="stylesheet" href="';
    bloginfo('template_directory');
    echo '/custom-styles/yellow-violet.css" type="text/css" /> . "\n";';
    break;
    default:
    echo '';
    } //closes switch statement
}

在标题主题模板中,我这样调用样式切换器:

<?php $mxs_settings = get_option('mixinstyles_theme_options');
echo $mxs_settings['mxs_style_switcher']; ?>

I'm creating a theme options page for my new theme and I set up some radio buttons to change the style when a user clicks each button. After saving the changes, it is supposed to add a stylesheet to the header of the theme. It is not working correctly. I assume that my switch statement might be written incorrectly. I'm using WordPress's Settings API. Below is most of the code in question.

function mxs_admin_init() {
    register_setting(
    'mixinstyles_theme_options',
    'mixinstyles_theme_options',
     'mixinstyles_options_validate'
);
    add_settings_section(
    'mixinstyles_main',
    'Mixin' Styles Settings',
    'theming_section_text',
    'mixinstyles'
    );
    add_settings_field(
    'custom_style_buttons',
    '<strong>Color Schemes</strong>',
    'custom_style_buttons',
    'mixinstyles',
    'mixinstyles_main'
    );
}
        ...
function mxs_theme_options_page() { ?>
    <div class="wrap" style="margin-bottom: 20px;">
    <div id="icon-themes" class="icon32"><br /></div><h2>Mixin' Styles Theme Options</h2>
        <?php if($_REQUEST['settings-updated'] == 'true') {
        echo '<div id="message" class="updated fade"><p>Mixin' Styles options saved.</p></div>';
        } ?>
    <form action="options.php" method="post" name="options_form">
    <?php settings_fields('mixinstyles_theme_options'); ?>
    <?php do_settings_sections('mixinstyles'); ?>
    <div style="text-align: center; padding: 20px;"><input name="Submit" class="button-primary" type="submit" value="<?php esc_attr_e('Save Changes'); ?>" /></div>
    </form>
    </div>
<?php
}
...
function custom_style_buttons() { 
    $options = get_option('mixinstyles_theme_options');
    echo "<div class='radiobutton-wrap'> \n";
    echo "<div class='radiobutton-padding'> \n <input type='radio' id='default_style' value='default_style' name='mixinstyles_theme_options[custom_style_buttons]' /><img src='" . get_bloginfo('template_directory') . "/images/default_screenshot.png' alt='Default style' /><br /><label for='default_style'>Default Style</label> </div> \n";
    echo "<div class='radiobutton-padding'> \n <input type='radio' style='padding-left: 10px; padding-right: 10px;' id='blue_orange' value='blue_orange' name='mixinstyles_theme_options[custom_style_buttons]' /><img src='" . get_bloginfo('template_directory') . "/images/blueorange_screenshot.png' alt='Blue/Orange style' /><br /><label for='blue_orange'>Blue/Orange</label> </div> \n";
    echo "<div class='radiobutton-padding'> \n <input type='radio' id='violet_yellow' value='violet_yellow' name='mixinstyles_theme_options[custom_style_buttons]' /><img src='" . get_bloginfo('template_directory') . "/images/violetyellow_screenshot.png' alt='Violet/Yellow style' /><br /><label for='violet_yellow'>Violet/Yellow</label> </div> \n";
    echo "</div> \n";
    echo "<div class='radiobutton-wrap'> \n";
    echo "<div class='radiobutton-padding'> \n <input type='radio' id='magenta_green' value='magenta_green' name='mixinstyles_theme_options[custom_style_buttons]' /><img src='" . get_bloginfo('template_directory') . "/images/magentagreen_screenshot.png' alt='Magenta/Green style' /><br /><label for='magenta_green'>Magenta/Green</label></div> \n";
    echo "<div class='radiobutton-padding'> \n <input type='radio' id='orange_blue' value='orange_blue' name='mixinstyles_theme_options[custom_style_buttons]' /><img src='" . get_bloginfo('template_directory') . "/images/orangeblue_screenshot.png' alt='Orange/Blue style' /><br /><label for='orange_blue'>Orange/Blue</label></div> \n";
    echo "<div class='radiobutton-padding'> \n <input type='radio' id='yellow_violet' value='yellow_violet' name='mixinstyles_theme_options[custom_style_buttons]' /><img src='" . get_bloginfo('template_directory') . "/images/yellowviolet_screenshot.png' alt='Yellow/Violet style' /><br /><label for='yellow_violet'>Yellow/Violet</label></div> \n";
    echo "</div> \n";
}
...
function mxs_style_switcher() {
    //global $mixinstyles_theme_options;
    $options = get_option('mixinstyles_theme_options');

    //$blue_orange = $options['blue_orange'];
    switch ( $options['custom_style_buttons'] ) { //opens switch statement
    case "blue_orange":
    echo '"\n" . <link rel="stylesheet" href="'; 
    bloginfo('template_directory');
    echo '/custom-styles/blue-orange.css" type="text/css" /> . "\n";';
    break;
    case "violet_yellow":
    echo '"\n" . <link rel="stylesheet" href="';
    bloginfo('template_directory');
    echo '/custom-styles/violet-yellow.css" type="text/css" /> . "\n";';
    break;
    case "magenta_green":
    echo '"\n" . <link rel="stylesheet" href="';
    bloginfo('template_directory');
    echo '/custom-styles/magenta-green.css" type="text/css" /> . "\n";';
    break;
    case "orange_blue":
    echo '"\n" . <link rel="stylesheet" href="';
    bloginfo('template_directory');
    echo '/custom-styles/orange-blue.css" type="text/css" /> . "\n";';
    break;
    case "yellow_violet":
    echo '"\n" . <link rel="stylesheet" href="';
    bloginfo('template_directory');
    echo '/custom-styles/yellow-violet.css" type="text/css" /> . "\n";';
    break;
    default:
    echo '';
    } //closes switch statement
}

In the header theme template, I'm calling the style switcher like this:

<?php $mxs_settings = get_option('mixinstyles_theme_options');
echo $mxs_settings['mxs_style_switcher']; ?>

如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。

扫码二维码加入Web技术交流群

发布评论

需要 登录 才能够评论, 你可以免费 注册 一个本站的账号。

评论(1

若能看破又如何 2024-12-23 00:47:31

实际上,我找到了一种方法来完成这项工作,不是直接调用标头中的 mxs_style_switcher 函数,而是通过 add_action 标记添加它。在该函数中,我取消了 global $mixinstyles_theme_options; 语句的注释。然后,在函数之外,我放了

add_action('wp_head', 'mxs_style_switcher');

最初,我打算直接从主题的头文件调用该函数,但我决定只使用更可能工作的内容。感谢您的观看。

I actually figured out a way to make this work by instead of calling the mxs_style_switcher function in the header directly, I added it via an add_action tag. Within the function, I uncommented the global $mixinstyles_theme_options; statement. Then, outside of the function, I put

add_action('wp_head', 'mxs_style_switcher');

Originally, I was planning to call the function directly from the theme's header file, but I decided to just use what is more likely to work. Thanks for viewing.

~没有更多了~
我们使用 Cookies 和其他技术来定制您的体验包括您的登录状态等。通过阅读我们的 隐私政策 了解更多相关信息。 单击 接受 或继续使用网站,即表示您同意使用 Cookies 和您的相关数据。
原文