options-image

Options Framework Plugin

The Options Framework Plugin makes it easy to include a full featured options panel in any WordPress theme.

I built this plugin so theme developers can concentrate on making the actual theme rather than spending a ton of time on building an options panel from scratch. It’s free to use in both commercial and personal projects, just like WordPress itself.

There’s also a theme version if that better fits your project.

Video Demo

Options Framework Plugin from Devin Price on Vimeo.

When Not to Use This Plugin

If you just have a couple options and none of them are complicated color pickers or image uploaders, I’d recommend checking out “A Sample Theme Options Page” from Ian Stewart. Using the Options Framework in this case would be overkill.

Instructions

Download the plugin and activate it on your site.

To learn how to set up the options panel in your own themes, download the Options Check theme from GitHub and use its files as a base. It’s a blueprint for how the Options Framework works with a sample option panel with every type of option you are able to use and a demo of how to display each one on the front end.

You can also purchase the Options Kit, which is a collection of starter themes, including Options Check.

To get started:

1) Copy “options.php” from the Options Check theme into your own theme.
2) Edit the array in “options.php” to define the options you want to use.
3) Add the following function to your theme so it will use default settings even if the Options Framework plugin is not installed:

/*
 * Helper function to return the theme option value. If no value has been saved, it returns $default.
 * Needed because options are saved as serialized strings.
 *
 * This code allows the theme to work without errors if the Options Framework plugin has been disabled.
 */
if ( !function_exists( 'of_get_option' ) ) {
function of_get_option($name, $default = false) {
	$optionsframework_settings = get_option('optionsframework');
	// Gets the unique option id
	$option_name = $optionsframework_settings['id'];
	if ( get_option($option_name) ) {
		$options = get_option($option_name);
	}
	if ( isset($options[$name]) ) {
		return $options[$name];
	} else {
		return $default;
	}
}
}

Available Options

These are the options currently available. If you feel there is something I left out, get in touch and perhaps I can add it.

  • text
  • textarea
  • checkbox
  • select
  • radio
  • upload (an image uploader)
  • images (use images instead of radio buttons)
  • background (a set of options to define a background)
  • multicheck
  • color (a jquery color picker)
  • typography (a set of options to define typography)
  • editor

There’s also “heading” to define the menu tabs, and “info” if you just want to add some additional information to the panel.

Returning Option Settings

If you look in index.php of the Options Check theme, you’ll see how each option is returned. It should look something like this:

of_get_option($id,$default);

What if the Options Framework Plugin is not installed?

The neat thing about this plugin is that it isn’t required for your theme to work. Each option should have a default which will be used if the plugin isn’t installed. Take a look at Portfolio Press without the plugin activated to see how it works.

There are a couple ways to let the user know that options are available if the plugin is installed: a notice on theme activation, an auto prompt on activation, notes in the documentation, etc. I’ve left this up to the theme authors to decide how to implement.

Download the Plugin

Download from WordPress Repository
Download Development Version
Learn About the Options Kit

Additional Tutorials

Future Development

If you’re looking to do something with the plugin that isn’t currently possible, post it in the comments or on GitHub.

Exporting/Importing Options

If you are exporting SQL databases, this thread might be of interest to you. There’s also a fork of the theme version, where someone built this out: https://github.com/vauvarin/options-framework-theme

Credits

The Options Panel was originally based on the excellent work of Woo Themes and still uses some of their code.

A huge thanks to all the people who helped out on GitHub, including @mfields, @helgatheviking, @celtic7, @samargulies, @mattweibe, @Mamaduka and any others.

Also a big thanks to folks who made donations to pay for a third party code review: Jason Schuller, Mint Idea, Luke McDonald .

If you would like to donate to the ongoing plugin development you can purchase the Options Kit for $20 (which has helpful demo themes).

529 thoughts on “Options Framework Plugin

  1. Pingback: Añadir opciones de plantilla para WordPress con Options Framwwork

  2. Towfiq wrote:

    Devin Thanks for this excellent Framework.

    I have a question, why is when I click the “Visual” button of the editor I get nothing? The “text” mode is working fine.

    I am using the latest version.

    Thanks.

  3. Tara wrote:

    This may be a ridiculously silly question, but I’m a little confused.

    I understood everything in the video tutorial and in the written instructions. However, I’m wondering how Options Check/Framework knows which elements to change in the css and page template files?

    I understand how to create my own customized options page. I just don’t understand how it relates to the theme I’ve developed. I hope that makes sense!

    • Devin wrote:

      Hi Tara. It doesn’t- but settings up the options page is the first step. Now, you can get the saved option value with of_get_option( ‘example_option’ ) and do what you like with it. The Options Kit has some examples for outputting inline CSS, etc. You can also look at my Portfolio Press theme.

  4. Jill Hoben wrote:

    I received this alert after a scan of my word press site. The only change I noticed was in the file version, from WP3.5 to WP3.6.

    * modified plugin file: wp-content/plugins/options-framework/readme.txt
    Any suggestions?

    • Devin wrote:

      I bumped the WordPress compatibility version from 3.5 to 3.6. Why did you get an alert?

      • Jill Hoben wrote:

        devin,

        I am running a plugin called Word Fence and it sends alerts – maybe a little too much but I would rather know than not know. Sorry if I caused any problems. Thank you.

        Jill

  5. yuzer wrote:

    Hi if in my theme i have multiple homepage templates/layouts… can i have input fields to add text only to those homepage.

    • Devin wrote:

      Sure. You’d need to check if a page was set as the home page, and then get the template name for that page, and if that page template == the page template that requires an option, output the option in options.php. Any option can be wrapped in conditionals.

  6. You say “To learn how to set up the options panel in your own themes, download the Options Check theme from GitHub” i follow that link and can not find a download for that file
    so how do i “1) Copy “options.php” from the Options Check theme into your own theme.” without being able to find that file

  7. Gerard wrote:

    Hi! I use an associative array in some options. In one example the keys are default, small and large. But the values are diferent because they appear into the select list: ‘Normal (default)’, ‘Small (no thumbs)’, and ‘Large (with thumbs)’.

    Then, if I use the function get_option(‘id’, ‘default’) it returns me the value, not the key. I like work with the key because the key is not shown into the select list and it has no spaces, so I can use it as code; p.e., Css classes, etc.

    I tried to get the key by using array_keys, but it doesn’t work and I don’t find examples on Internet. What I’m doing wrong? There is another way to do that? Thank you very much in advance :)

  8. Daniel wrote:

    Hi Devin, thanks for the tutorial.
    I’d like to be able to validate some options.
    In my case I need to validate a numeric option “Price”, in order to prevent the user entering alphanumeric values.
    Is there a way to add some validation function/code?
    Thanks in advance.

    • Devin wrote:

      There’s a optionsframework_after_validate hook.

  9. Mike wrote:

    I must be missing something here.

    I have everything added just like you did in the video. The Theme Options page shows up just fine, the buttons all work, and everything saves perfectly. Although, when I go to output the content, nothing shows up. Here’s what my code looks like within my header.php file:

    What am I missing?

    • Mike wrote:

      Code here (within PHP open/close tags):

      echo of_get_option(‘my_id_here’);

      • Mike wrote:

        My mistake. I guess I was using the wrong “type”

  10. Jerome wrote:

    Hi, is it possible to retain the options from a main site to its multisites in a network? The multisites will use the values of the main site when it is created, and the options on the multisites will be updated when it is updated on the main site. I hid some options on the multisites, to allow changes to be made only on the main site, thus I need this persistence for all network sites – Thanks!

  11. chris conway wrote:

    hi devin – well impressed with this framework.. is there any way of installing 2 pages of settings.. ive changed the page names to create two pages along with most names on my second page but when i save it saves to the first pages settings and the second page doesnt load saved settings just the defaults? is there an option name i need to change for its own array / saved setting/?

    all help would be greatly appreciated

    thanks

    chris conway

    • Devin wrote:

      Not real easy to save to two different options. You’d need to hack at it some. The next version of the framework will allow this though.

      • chris conway wrote:

        i sorted it thanks.. hackked away cant wait for the next release. is there anyway to quickly add new field types to the interface switch? if ‘background_1′ with a whole different set of options? i got a few to work but.. well do i need to register them or something?

        thanks

      • Devin wrote:

        Options will be more extensible in the next version of the plugin. For now, yes, you’d need to add them to the switch statement and add a sanitization hook.

  12. chris conway wrote:

    could i ask you to send me a quick text example where its allowed html tags? i can work from that thgen to do the rest it be appriciated thanks in advance

    chris conway

  13. chris conway wrote:

    // If the developer hasn’t explicitly set an option id, we’ll use a default..

    how do we set a default? – Thanks

  14. deenbandhu wrote:

    Devin Thanks for this excellent Framework.
    but when i use group with two field one editor and another text filed with repeatable . then editor don’t save the value in group.

  15. Dale Ramirez wrote:

    I am planning to include this into my commercial plugin. Am i allowed to put a prefix in every function name or wrap every function with function_exists? So that when a user installed a options framework plugin or include options framework in their theme it will not have a conflict?

    • Devin wrote:

      I would prefix your functions. Checking if function_exists will likely cause conflicts down the road.

      • Dale Ramirez wrote:

        Thank you for replying to my question. Awesome back-end options plugin!

  16. Faraz Ahmad wrote:

    I appreciate your work, your free plugins is very useful, thank you so much :)

  17. George wrote:

    How do I set a default value to a textbox?

    I assumed ‘std’ => ‘Default Value’ does the trick but it doesn’t change anything. I want to fetch my blog title into the a textbox. I’ve tryed ‘std’ => get_bloginfo(‘name’) but it’s not working.

    • Devin wrote:

      That should work. Try resetting to defaults and see if it appears.

  18. Sam Hiser wrote:

    Hi Devin -

    Had trouble Activating options framework in my WordPress installation …

    Fatal error: Cannot redeclare optionsframework_rolescheck() (previously declared in /home5/drronine/public_html/shop/wp-content/themes/organic_shop/admin/options-framework.php:31) in /home5/drronine/public_html/shop/wp-content/plugins/options-framework/options-framework.php on line 61

    Any clue?

    • Devin wrote:

      You’re using an outdated version of the Organic Themes theme. Contact their support team to get the latest.

      • luigi farrauto wrote:

        hello, i have the same ‘fatal error’, but i did downloand organic theme today! are they old?

      • Devin wrote:

        Disable the plugin.

  19. Aaron wrote:

    It would be cool if there could be variable length lists or collections of things.

  20. Kevin wrote:

    Hello Deven,

    Great work on your options framework it is a great way to create the options for the themes fast and easy. However i encounter a rather strange problem when using a checkbox to hide a dropdown menu and a text input. The dropdown is not hiding properly (it stays visible, but if i tick the checkbox twice it hides). It might be due to my lack of jQuery knowledge, but this seems to work with all other elements, as long as i tested them so far.

    {code redacted}

    • Devin wrote:

      Did you look at the demo I have in Options Check. This is how I set it up:


      jQuery('#checkbox-option').click(function() {
      jQuery('#item-to-reveal').fadeToggle(400);
      });

      if (jQuery('#checkbox-option:checked').val() !== undefined) {
      jQuery('#item-to-reveal').show();
      }

      You’ll also want to make sure #item-to-reveal is set to display:none.

      • linggg wrote:

        Hi Devin, this plugin is not compatible with wp3.8, does you have a way to solve it? when will the new plugin version be updated?

      • Devin wrote:

        It is compatible. What is your issue?

  21. rakesh kumar wrote:

    First time going to use your option framework on my themes, Right now using my own developed options panel. Hope this will help me to build some sophisticated admin panel for my free wordpress themes. Thanks a lot for this wonderful efforts.

  22. Scott wrote:

    Hello, I used this plugin previously and need it again for an Organic Themes theme I’m using. I’m running WordPress 3.7.1 and the Options Framework plugin sates compatibility to 3.6.1. Is there a timeline for a new release? I can’t adjust my theme settings correctly without a valid plugin. Thanks!

    • Devin wrote:

      It is compatible with the latest version of WordPress. Give it a try. Also, new version of plugin is coming out shortly to improve it even more for WordPress 3.8.

      • Scott wrote:

        Great, thanks. I did try it and found it to work. I found a comment you made about compatibility shortly after I posted my first comment and gave it a try.

  23. Bonnema wrote:

    The category name doesn’t work for me. The stories will only display if I use the slug. Bug?

  24. Greg Morin wrote:

    Having a problem with a recent update of the Options Framework plugin. Ran the update and it seemed to go fine and everything seems to work, but I have this persistent message at the top of every window in the Admin side of things

    “The Options Framework plugin is required for this theme to function properly. Install now.”

    Clicking on “Install now” just takes me to page that gives info on the plugin (here) and that it is already installed, so there is no option to re-install it.

    It is indeed installed and Active. I tried de-activating and re-activating but no change. Any suggestion as to how to get this annoying and apparently incorrect message to go away. Thanks!

    • Devin wrote:

      That is coming from the theme. I’d contact the theme author to see if they have an update.

  25. Mark H. wrote:

    I’ve updated the Options Framework to v1.7.1 running on WordPress v3.7.1 but the banner at the top of the dashboard page:
    The Options Framework plugin is required for this theme to function properly. Install now.
    Will not go away. When trying to install, it says that current version is already installed. How can I silence this banner?
    tx

    • Devin wrote:

      That is coming from the theme. Contact your theme author.

  26. webster wrote:

    How can I add options panel for my plugin using “Options framework”?

    What version of framework should I use and what code should I add to my plugin to have options page inside of my plugin?

  27. linggg wrote:

    Hello Devin, when will the new plugin coming out to support wp3.8? I am installing genesis framework but I found the current plugin not compatible with wp3.8. Thank you

    Lingg

    • Devin wrote:

      It supports 3.8 already.

      • There was just a minor glitch with 3.8. The checkboxes got wider. Very wide.

        I was able to fix it by changing the width of checkboxes in optionsframework.css file.

  28. wasan wrote:

    help me can not save iframe, script in textarea

    I want to save it all. Where to edit

  29. Marianna wrote:

    Hi Devin,

    I hope you are well. I have installed and activated the plugin but for some reason it’s not showing up in appearances. Can you help please?

    Thanks,

    • Devin wrote:

      Your theme needs to support it- otherwise it’s just a developer tool. Did your theme ask you to install it?

  30. pdme wrote:

    Hi,

    Thanks a lot for a great plugin.

    Is there a way to add field that allows users to select multiple images from the media library? Surely there must be a way to store multiple image URLs in an array?

    Thanks again!

    • Devin wrote:

      Hi Pdme. You want to insert a gallery? Yes, it would be possible to build a custom option like that, but one is not currently available with the framework.

  31. Monica wrote:

    I’ve installed the plugin, but I get the following error when I try to activate it:

    Fatal error: Cannot redeclare optionsframework_init() (previously declared in /home3/northtg5/public_html/wp-content/themes/discover/admin/options-framework.php:73) in /home3/northtg5/public_html/wp-content/plugins/options-framework/options-framework.php on line 54

    Any thoughts/help would be greatly appreciated! I’m stuck at this point. :(

    • Devin wrote:

      Looks like your theme already has in bundled. Perhaps you don’t need the plugin? I’d contact the theme author.

  32. Natalia Wein wrote:

    I installed the options framework plugin to the wordpress website theme, but apparently my current theme does not have support for the Options Framework plugin. What do I need to do to activate the Theme Options section?

    Thank you!

    • Devin wrote:

      The Options Framework provides no options on its own- it’s just a framework to help developers build options for a theme. You would need to hire a developer to build out the options you need.

  33. Really handy! Thank you very much. However, I’m somehow stuck trying to get a textarea working.

    Where can I find a working example for the textarea? Especially the $wp_customize->add_control() part, which is missing in the /options-check/options.php file.

  34. Paul wrote:

    Great plugin Devin!

    I’d like to know if it’s possible to put a custom post type tab from wp dashboard to theme options(options framework). If possible how do I do that? please help :(

    • Devin wrote:

      I’m not sure what you mean by “a custom post type tab”. But you should be able to link to the theme options from anywhere you like.

  35. Hi Devin

    I’m trying to echo content on the page which is selected in the options framework. How would I go about doing this?

    Thanks

  36. sawan wrote:

    i am a news developer, i can develop themes with codes, but cant create a dashboard menu, this plugin saves my time, thanx a lot

  37. Dinith wrote:

    Hi, being acquainted with the options frame work recently i would like to confirm if the options frame work will delete a previously uploaded file on changing the uploaded file with another one?

    Many thanks.

    • Devin wrote:

      No. Items do not get deleted from the media library when using the upload option to replace a file.

Leave a Reply

Your email address will not be published. Required fields are marked *

You may use these HTML tags and attributes: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong>