I was trying to create a Option Theme Page for my theme and I wasn't able.
Today I found the Option Theme Framework but after some time I really can't understand how to use it.
In particular, I'm able to create a new "field" but I cant'use it.
For example, I would create a field to le the user to change the color of a specific class/tag. Has anyone an idea of how to do that?
I can't find any docs

EDIT: I'm able to use the stuff like variables and something else in a normal php page, but I can't use that to change my CSS.

  • Which framework in particular? Could you provide a link, there are quite a few! – TheDeadMedic Mar 17 '14 at 16:43
  • It's called "Option Theme Framework", I wrote it :) – dborghez Mar 17 '14 at 16:46

I'm pretty sure there is an example in the Options Framework sample theme on how to create a color field. How you use the option data in your theme is a different matter. You can print CSS in the header via wp_head hook and use PHP that way. I'm relatively certain this is shown in the sample too.

function wpa_138251(){
 $color = of_get_option('some_color', '#CCCCCC' ); ?>
 <style type="text/css">
    .some-class { background: <?php echo $color; ?>; }
  • I'm sorry but I really can't figure it out WHERE to use that code. I tried to put it in option.php but nothing happened.I tried to apply some style without the variables, like "normal" css and it's the same, nothing change. It makes me mad, I've spent a week on this and I still didn't find a solution! – dborghez Mar 18 '14 at 10:25
  • This code goes in your theme's functions.php file. Is the code showing up in your source at all? Fair warning, I didn't test this, but it should be on the right path. Try to remind yourself that you are learning a new language here. I still have plenty of days where I want to hurl my computer against the wall. – helgatheviking Mar 18 '14 at 11:47
  • I solved in another way, check my reply down there :) Btw, thanks anyway! – dborghez Mar 18 '14 at 14:55

You have to create a file options.php in your theme's drectory. You can find an example of such a file here: https://github.com/devinsays/options-framework-theme/blob/master/options.php

The options.php contains a function optionsframework_options this function returns an array of options.

Example of an option:

$options[] = array(
    'name' => "Archive Layout",
    'desc' => "Choose a layout for your archive pages. If none is selected, the default layout you specified at the top of this page will be used.",
    'id' => "default_archive_layout",
    'std' => "right-sidebar",
    'type' => "images",
    'options' => array(
        'right-sidebar' => $imagepath . '2cl.png',
        'full-width' => $imagepath . '1c.png',
        'left-sidebar' => $imagepath . '2cr.png',
        'three-column' => $imagepath . '3cm.png',)

The above option has an id default_archive_layout, after saving the option (to the database) you can get it's value by calling: of_get_option('default_archive_layout'). Just like the get_option function this function can be called with a second parameter which sets the default value.

Now you can use the above with for instance https://codex.wordpress.org/Function_Reference/wp_add_inline_style to change your style.


I solved in this way:
- add to function.php:

function theme_option_css() {
    require_once 'css/theme_option_css.php';
add_action('wp_head', 'theme_option_css');

-then in my theme_option_css.php

<style type="text/css">
    color:<?php echo of_get_option('example_text_mini');?> !important;
  • 1
    This is pretty much exactly the same as my answer, except you've separated the style rules out into another file, but glad it works. – helgatheviking Mar 18 '14 at 14:58

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.