Support » Themes and Templates » Using Theme Options in CSS

  • Resolved equalmark


    I am trying to offer some styling options in my theme options page. I have created theme options for the body color and this is retrievable with <?php echo get_option('st_bgcolor'); ?> which works fine when placed in my index.php file for example, but fails in my stylesheet which I have below:

    <?php header("Content-type: text/css"); ?>
    body {
    	background-color: #<?php get_option('st_bgcolor'); ?>;

    I have also included the following in the header.php page to call the new stylesheet:

    <link rel="stylesheet" href="<?php bloginfo('template_url'); ?>/style-options.php" type="text/css" media="screen" />

    The stylesheet works and styles the page until I add the <?php echo get_option(‘st_bgcolor’); ?> which is where it fails.

    Anybody any ideas why? Or perhaps how to fix it? Or even another way of doing this?


Viewing 5 replies - 1 through 5 (of 5 total)
  • Jeremy Clark



    It’s because the wordpress functions aren’t available on your style-options.php file because it isn’t included are called in any way by wordpress. The best way is to use a custom query in wordpress.

    I’ve adapted this for use in themes:

    Thanks for the quick response.

    So that code that is on this page is included in the themes functions.php?

    I understand why the php file will not accept WP functions however studying the links you have provided I am not able to understand how to get the style-options.php file to accept WP functions.

    Could you explain a little further how this is done?


    could be what jeremy is talking about, and also, imho, get_option does not actually output anything, it needs to be echoed:

    OK I have finally worked this one out. You need to add the following to your themes functions.php file:

    add_filter('query_vars', 'add_new_var_to_wp');
    function add_new_var_to_wp($public_query_vars) {
        $public_query_vars[] = 'my_theme_custom_var';
        //my_theme_custom_var is the name of the custom query variable that is created and how you reference it in the call to the file
        return $public_query_vars;
    add_action('template_redirect', 'my_theme_css_display');
    function my_theme_css_display(){
        $css = get_query_var('my_theme_custom_var');
        if ($css == 'css'){
            include_once (TEMPLATEPATH . '/style-options.php');
            exit;  //This stops WP from loading any further

    Then call the php css file with the following in your themes header.php file inside <head>

    <link rel="stylesheet" href="<?php bloginfo('url'); ?>/?my_theme_custom_var=css" type="text/css" media="screen" />

    You should then be able to create a file called style-options.php which will be able to accept WP functions.

    Thanks to jeremyclark13

Viewing 5 replies - 1 through 5 (of 5 total)
  • The topic ‘Using Theme Options in CSS’ is closed to new replies.