Options Framework Plugin

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

Although this plugin is still maintained and secure, the recommended way to add theme options for new themes is to use the Customizer.

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.

Available Options

These are the options available:

  • 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

Additional Tutorials

Future Development

This plugin is not actively developed. If there’s compatibility or bug fixes needed, let me know.

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 .

669 Responses

  1. Devin Walker

    It would be great to have a supported Import/Export option. I see the Github version but I’m wondering how this is going to work in future releases. It seems to be heavily based off a WooThemes project. I’ll give it a go, but it would be super helpful if this were included by default. Typically, I’d want to provide my theme users a way to import default options to work from rather than working from a empty options panel.

    1. Devin

      I’ve been hoping someone would build a generic import/exporter for options. Sort of a companion plugin for the Options Framework, but it would work for any type of option you wanted to export. It’s not on my timeline at the moment, but I’d like to build it at some point.

  2. CK Hicks

    First, thank you (again) for making this great plugin. I use it all the time and it has saved my bacon on several occasions.

    I’m currently using this for a project with dozens of basic text inputs. Can you think of a (clean) way to generate a table? I’m thinking an array for the individual cell values, then calling the whole case in options.php for easy updating. Pulling values on the front-end will be easy; I just need to wrap my head around the back-end. Any suggestions would be most helpful!

    Keep up the great work.

    1. Devin

      I think the cleanest way would probably be to use the theme version and add a new option type. All the fields you need could be outputted programmatically through a loop and wrapped in a table tag. I’m working on option extensibility, but it is still a ways off for the plugin version.

      If you absolutely want to use the plugin (without any hacking), you’d need to loop through and output all the input fields, and then hook in a custom stylesheet to style them correctly into looking like a table. Not as clean, but would probably work without much fuss.

      Just curious, what is your application for this? Perhaps there is a better way altogether.

      1. CK Hicks

        Thanks much for the detail – I’m trying to make rate tables for a financial institution. They need a way to edit those in a concise way, so naturally I turned to the Options Framework. If they can “see” a table in the admin, it will make them much more confident for the editing.

        I’m pondering various methods, but right now looping seems like the best method. I could always style the individual text fields, but I’d like to get it as close as possible to the front-end so they don’t have the visual interruption.

        If you think of any new ways to do things I’d appreciate it, otherwise I think I’ll generate a new option type and go from there. Really appreciate your work on this!

  4. Michael Guill

    Thank you for this awesome framework and tutorial! I’ve been looking for something just like this to help me make themes a little more client friendly, and this is perfect. :)

    One question, and forgive me if it’s already been addressed in previous comments. FWIW, I did try searching, but I didn’t turn up with anything.

    Is it possible to move the options menu to a top-level admin menu? If so, how would I go about that?

  5. Webbyrå

    Hi!

    How do I add more forms/fields under the same array name?

    Like if I have a array called Box 1.
    And under that I want to add the text for the box, and another field for the url, and another for the url of the image to be displayed. Instead of getting each form on a new row I want them to be like a 3 column and not with a new headline and seperator for each one of them.. Make sense?

  7. Chris

    I am racking my brain on this one but is there a way to display option boxes based on a previous selection? For example, “How many slides do you want?” I choose 5 then five UPLOAD options appear for me to upload each image. (I would then call each with if statements into the page.)

    Would be cool to have a drag and drop reorder…

    Thanks,
    Chris

  8. Adam

    I’m a big noob. Do you know of any video tutorials or screenshots that explain actually implementing the options? Example; if I want people to be able to upload a logo, it get sent directly to the header.

    Thanks!
    AB

  10. Dan

    Hi there,
    I have come across a weird problem. Basically on a certain web server this plugin causes an error when you are trying to add a menu item

    Fatal error: Allowed memory size of 33554432 bytes exhausted (tried to allocate 122880 bytes) in /www/wp-admin/includes/nav-menu.php on line 675

    Once you deactivate Options Framework it works again…

    WP 3.4.2

  12. Shehab

    Hello Devin ,

    I just installed your plugin , but it have a notice that my current theme does not have support for the Options Framework plugin. I have tried Whiteboard theme and Twenty Ten , All the same. Any ideas ?

  14. Rab

    Hi Devin,

    I have to say I’m loving the plugin, you’ve done a fantastic job.

    I was wondering if at some point you may include the option of having the tabs listed vertically instead of horizontally thus allowing much more of them to be added?

    Also, is there any chance at some point you might allow HTML to be added to option descriptions? I’d like to be able to add emphasis and move things onto new lines in order to make important information more noticeable.

    Again, great work!

    Cheers,
    Rab

  15. Romain

    Hi Devin,

    First thing first, your plugin is awesome!!
    For a theme that I’m working on I need to have options that I can repeat easily.
    I have fields that I would like to repeat by clicking on a button to make it easy for the user.
    Do you have an option who does that?

    Regards

  16. Debu

    This is awesome. You saved ny days. I have one question. Is there a way where in we can reset default options just for particular tab instead of all tabs?

    Regards,
    Debu

    1. Devin

      Not at this time. The restore defaults actually just deletes the theme option entirely from the database- so to delete specific sections you’d have to quite a bit more work to determine which options were in each section and delete those specific ones from inside that theme option.

  17. David

    Devin…Do you happen to do any contract work ? I wanted to get a project done and am looking for someone to do some back end Admin for word press. Very similar to what you have done…

    Thanks.

  18. Angie

    Hi Devin,

    I’m just starting to learn how to use this…wondered if you could help me know if this is the right solution for me. Let’s say I wanted to give users the option to change the fonts, colors, background for h2 tags of widget titles (as an example). I have played around enough to see how I can use the background, image uploader, color pickers, typography, and to then echo those out in the theme, but I don’t understand if it’s possible to integrate those options with existing elements in a theme (or conversely, how to make those options the elements of the theme). I have Portfolio Press installed and am looking at it as an example, too… but thought I’d drop my question in case you can more easily shed some light on an answer as I’m looking around myself.

    Thanks – love this.

  20. labm0nkey

    This plugin has all needed options but it lacks of one quite important. For example I want to use a google map where you can set a point and save its coordinates. An option named “custom” where I would be able to insert custom html of the map and for example a textbox which value would be set by jquery would do the trick. I am gonna check myself If it’s possible to do this already but anyway ability to use custom html would make this perfect.

      1. labm0nkey

        Ok I see now but still I can’t find a way to allow more html tags in fields description? I guess it is a bit different.

      2. Rab

        labm0nkey putting HTML (for styling etc) in the descriptions doesn’t appear to be possible at the moment, I’ve been trying it myself.

  21. Rab

    Hi Devin,

    I was wondering if at some point you may include the option of having the tabs listed vertically instead of horizontally thus allowing much more of them to be added?

    Also, is there any chance at some point you might allow HTML to be added to option descriptions? I’d like to be able to add emphasis and move things onto new lines in order to make important information more noticeable.

    Cheers,
    Rab

  22. Nathan

    I was following your tutorial on my local install, and somehow it changed some wordpress info regarding upload size. phpinfo() says the max size is 32MB, but no matter what I try wp only sees 1MB.
    I’ve tried adding
    define(’WP_MEMORY_LIMIT’, ‘64M’);
    but that doesn’t seem to change it either. Any other suggestions?

    otherwise it’s been incredibly helpful, thank you!

  23. carrie

    hi i am using option framework in one of my projects. I am trying to add add this code in the options.
    however when i add the addthis code and save, it removes the script tag,

    how can i include the addthis code including script tag

    thanks for your help

  24. William DeAngelis

    Wondering if its possible to easily add sub navigation / sections? Seems not too difficult with the ability to add custom scripts, but how would one go about adding additional div’s and other html etc?

    1. Devin

      You can add html within the panel using the “info” option. There’s also a hook to insert content after the panel do_action(‘optionsframework_after’).

  25. Dave Burns

    Hi, Devin.

    I think this isn’t possible yet but would appreciate advice from you on where to look or how to do it. My use case is that my theme has an option text field that contains a URL to an image on my site (my logo). The field’s value is hard-coded to my live site. I’d like some way to make this work when I’m looking at a local copy on my dev machine, i.e. right now, that still gets fetched from my live site.

    What I think I’m looking for is the ability to replace tokens in a text field. I wonder about having the framework replace tokens in strings so that if I have a text field with something in it like “$WP_SITEURL/mylogo.png”, the framework would automatically replace that with the correct value when someone calls of_get_option().

    Would be interested to hear your opinion.

    Thanks,
    db

  26. lim

    Hello Devin, Just updated to v1.4 but found that every type=>”text” without any class=>” become a short text input. And I wonder is it possible to create sub heading / sub tabs? if it’s possible can you write the tutorial? Thanks.

  27. ben

    GREAT PLUGIN…super useful; really appreciate the work!

    Help from Portland…a wee glitch for the next update: with the admin-panel CSS:

    in file: /css/optionsframework.css
    line 148..
    the basic text-input fields are all stuck at 140px, and that makes it durn tough to see what option data you’re typing into the field as a user.
    Also, changing those values in the current CSS seems not to work in firefox or safari…guessing this might have to do with a wp-3.5 Theme Customer CSS-conflict.

    I found that if I added a new line of CSS at line 152:
    #optionsframework .controls input.of-input { width:95%; }

    …this cascade of styles will trump whatever is currently conflicting with your current CSS at line-148.

    Happy New Year! And thanks again for an awesome contribution to WordPress!

  28. James

    I have my options framework working beautifully with the theme I am building. Is there any way to make an option “un-resetable”

    Like if I want to restore defaults but I don’t want to reset that one piece.

    1. Devin

      Not without customizing the plugin. The options are all saved into ONE single option array. So when you reset to the defaults, it simply deletes that option.

  29. Kevin

    I’m using Options Framework with WP Multisite. Is there any way to get your plugin to save all the default options in code that is similar to clicking Restore Defaults? I’d like each site to be prepopulated with default settings that need to be present before the admin logs in for the first time. I tried calling optionsframework_setdefaults() on wpmu_new_blog but that didn’t do it. I’ve got WP doing other things on the wpmu_new_blog action but can’t figure out how to get Options Framework to save it’s settings. Any ideas?

    Thanks!

    1. Devin

      Hi Kevin. The setdefaults code is a little buggy, as you’ve seen. I’ve actually tried to remove it once or twice, but have had trouble with admin notices.

      The best way might be to update your theme a little bit so that the defaults you want to use are set in each of_get_option call. This means that the themes would work even if the Options Framework never even saves an option.

      But I will look into the code a bit more and see if I can trace down the issues with setdefaults.

      1. James

        What is the parameter for a default inside of the of_get_option function??? of_get_option($id, $default)??? What if need to set multiple defaults of one option ID like font, size, color, weight…etc

      2. Devin

        You’d pass it an array. of_get_option( ‘myfont’, array(‘color’=>’#000000′,’face’=>’georgia’)). Exactly the same way you set the defaults for the option in options.php.

  30. Cody

    Hi Devin

    Thanks for providing such an awesome plugin for handling the options. I’ve had a look at quite a few but I find OF is so much more easier to use and get a grip of than the others. Also thanks for the videos – very useful :)

    I do have a question though, is it possible to change the location of the options.php file? I have a child theme and like to keep the files tidy, but in doing so I’d like to move the options.php into a folder I have called ‘customisations’ which has a few other snippets of code specific to that theme.

    Thanks :)

    1. Devin

      Yes, there’s a filter on the location:

      $location = apply_filters( ‘options_framework_location’, array(‘options.php’) );

      So you can alter the name and/or location if you choose.

      1. Julien LE THUAUT

        Hi Devin and firstly, thanks for this very useful plugin!
        I’m using it for the first time within a child theme. I need extra parameters in this child theme and I would like to know how to add these new options to the parent theme’s options array?
        Can you tell me what is the right way to do this?
        Thanks!

  31. Cody

    Thanks Devin

    I just wanted to check is that on line 534 of the options-framework.php file? It looks like its part of the core plugin and I just wanted to check as I imagine I would need to update this if I upgrade the plugin?

    1. Devin

      Hi Cody. No, a filter allows you to change the it from your theme rather than editing the plugin directly.

      Here’s how your would do it (added to your theme functions.php file, for example):


      function mytheme_options_framework_location_override() {
      return array('/folder/options.php');
      }
      add_filter('options_framework_location','mytheme_options_framework_location_override');

  33. Adi

    Hi Devin,

    I’m a great fan of the plugin. Does it work well with updated 3.5 WordPress Version? Because the plugin admin area doesn’t print anything that I can use.

    It happens to all of my 3.5 WordPress Version.

    Thanks in a zillion!

  34. Cody

    Hi Devin

    I’ve added the framework and its working great so far, but I do have a few questions I hope you could help (or point me in the right direction with) please?

    * I have a user (currently set to Administrator, but they should be Editor) and they are using the Text Editor it seems to strip out any formatting (like LI, STRONG and H tags). Am I missing a setting to allow them to format the text editor?

    * Is there a way of enabling the ‘upload/insert image’ via the Text Editor?

    Thanks Cody

  35. Angel

    Great f****** tool!
    Thank you very much for sharing.

    I wonder if anybody has tried to save an array of images with the image uploader.
    Lets say that you want a slider banner in the front page, so user can upload and order multiple images through the Theme Options pannel.
    Then in the front page query the array so you can print images and related meta in order to build a slider banner.

    Is that included in the Options Kit?
    That’d be a killer feature.

    Cheers!

    2. Colin

      I just use a php if else statement, and limit the options for the slider to say 6 slides. if ( of_get_option('slider_1_img') ) { /* show all the slider stuff */ } } else { /* do nothing */ }

  37. Kevin

    Is there any way to get Options Framework to save the default values automatically? I’m using it with WP Multisite and every time I create a new site, I have to “restore defaults” to get the values from options.php to be save into the database. Otherwise all of the options are blank. Any suggestions?

    Also, I’m importing a couple hundred sites into WP from a client’s existing homegrown system and would like to set some options values in code as I’m creating the sites. Is there some way to set options values outside of the usual Theme Options page?

    Thanks!
    Kevin

    1. Kevin

      If anyone is interested, I ended up doing the following. It seems like it works although I’m guessing there’s a more elegant way to accomplish this:


      // get the array of default option values
      $values = of_get_default_values();

      // set the value of one of them
      $values['myfield'] = $myvalue;

      // save the option values
      update_option( 'optionsframework', $values );

      // force options framework to save its required settings
      // otherwise you have to browse the admin area first to get
      // the settings to "take"
      optionsframework_init();

      1. asocalguy

        So, for anyone who finds this in the future and is hoping this solves the problem, it doesn’t work anymore with the latest plugin update so I’m going to have to find another solution. This seems like a straightforward feature to include in the plugin but maybe not.

  38. Teo Maragakis

    Thank you for this extremely useful plugin. One question only: Can the code be used to create plugin settings instead of theme settings? Is it just a matter of changing the functions that put the settings pages under the “Appearance” menu in the dashboard?

      1. Teo Maragakis

        Thanks for the link. But have you thought about adding this functionality? It’s a pity to let the code limited since the engine that creates everything is already there. If you decide to improve it and need some help with the code, let me know and I’ll help via Github.

      4. hittheroadjack

        Have done it today and works perfectly with WP 3.5.1 – no big issues.
        Added it as an extension to Shibashake’s plugin example and added also the custom list table example. On top of everything, I did the i18n stuff.
        Need to do some description how to handle it, but not much different from original of4themes.
        I will put it for download on my new website once it is ready in a couple of days and announce it here.
        If someone is in urgent need to get it, just drop me a message and I’ll put it in my public dropbox earlier. Just let me know if you want the whole thing or just the option-framework4plugins part.

  40. Expert Pixels

    Thanks heaps for this, slowly implementing it into my new design.. Very handy little plugin.. Altho im not using it as a plugin ive kinda hacked up bits and pieces and added it to my theme.

    Cheers again.

  41. Melissa

    Hello, I really want to try this plugin to get more flexibility with my website, but I keep getting this notice when I install it — “Your current theme does not have support for the Options Framework plugin. Learn More | Hide Notice”

    What can I do? The theme I am using is Glossy Stylo. I like it, but would love more flexibility! I’d appreciate any suggestions!

    1. Devin

      The plugin doesn’t offer any options on its own- it’s just a tool for developers to make options. You might want to pick a different theme that has the options you need.

      1. Melissa

        Aha, I see. Thanks for the clarification.

        This might be an abstract question but how in the world do you make an option? Is this all through adding code to the theme? I’m just learning the tricks and trades of word press. Thanks!

  42. Rhian

    I am using the Risen theme. Once I updated the included OptionsFramework plugin now the site is not working. All my pages are blank, there is not centered space no sidebar no page just a header and the menu navigation. Please help!!!!!

  43. Aro

    Hi there,

    i want to store a API Code in an option text field but it contains a “%” (percentage sign). When i hit the button save Options – its gone. Is there a way to keep it in string on saving?

    Cheers and regards!

    1. Devin

      I don’t see any reason it would be sanitized out. It saves fine for me. Are you using the latest version of the plugin? Can anyone else reproduce this?

  44. John

    Hi Devin – what would be your recommended method for overriding your css classes with the user’s newly defined color? I see how to call the values in a php file, but not really in a css file. For example if my default css has red links, but the user changes it to pink…would you overwrite the css with javascript or something? Was looking for an example of this but couldn’t find it. Thanks!

    John

  45. Pavan Solapure

    Thanks for this very useful and great plugin!
    I’m using it for the first time within a child theme and I was amazed. From integration to usage, it was too much simple yet powerful.
    Thanks Buddy!

  47. Martijn

    Hi,

    first of all great plugin! I think I’ve found a small bug:

    I have a list of multiple Upload options in a tab. When I upload more than 1 after each other without saving the options, the media upload popup doesn’t auto close after clicking Select to insert the image. You have to click outside the popup and it closes. If you load another one after that, you have to click outside the popup twice to close it, etc.

    Seems the media popup isn’t fully closed somehow after upload.

    Cheers!

    Martijn

  48. Gaurav Kaushik

    Hi Devin,
    Hope you are doing Well, I have a issue with the plugin when I move my projects from one server to another server all the option values lost, don’t find the trick to fix the issues.

    could you please suggest how to fix that.

    Thanks in Advance,
    Gaurav

  49. webster

    Can I edit site name (‘blogname’ field in options table) from options framework page?
    Can I add text input for site title (but it should be stored in (‘blogname’) option and not in options framework field)?
    Is it possible to do it without changing the core code of the framework?

    1. Devin

      You shouldn’t set core options from the framework. If you don’t think people will be able to find it under “Settings > General”, you could put a link from the options panel over to that screen.

Leave a Reply