How do I use a color from theme options?

You would simply call that option inside of a callback, and hook it into wp_print_styles or wp_head (either one is semantically correct in this case).

First, set up your callback, which will print an inline style sheet:

function wpse74013_print_custom_styles() {
    ?>
<style type="text/css">

</style>
    <?php
}
add_action( 'wp_head', 'wpse74013_print_custom_styles' );

The next step is to access your Theme option:

$options = get_option( 'my_theme_options' );

Now you need to apply the link color, which I’ll assume is $options['link_color'], to your CSS. Let’s assume that your link color is defined in style.css like so:

a { color:#0000FF; }

Simply replace the HEX value as appropriate:

a { color:#<?php echo $options['link_color']; ?>; }

Putting it all together in your callback:

function wpse74013_print_custom_styles() {
// Get Theme options
$options = get_option( 'my_theme_options' );
    ?>
<style type="text/css">
a { color:#<?php echo $options['link_color']; ?>; }
</style>
    <?php
}
add_action( 'wp_head', 'wpse74013_print_custom_styles' );

And that’s it! You should see your inline stylesheet output in your document head, with the user’s setting output for the link color HEX value.

Related Posts: