Update: New Version
I’ve released a newly optimized version of the Theme Options Framework that now only makes two calls to the database rather than one call per option.
Recently I’ve been doing alot of work on my themes. I started off with the idea to make my theme work user friendly by adding a options page. So I started looking for how to do this, and came across this page and some useful code. So I took this and started modifying and trying different things and now I think I’ve got a very useful framework and I wanted to share with others. I’ll continue below as this will be fairly long post.
Update
Mike from Split Visonz has updated my framework to include a checkbox and multiple selection elements. Multiple selection is a dropdown list where you can select multiple items. You can download the new version below and I’ll explain the new additions as well.
First you’ll need to download the framework file:
After you have the controlpanel.php file uploaded to your server into your theme’s main directory you’ll need to add this line to your functions.php file
[php light=”true”]<?php require_once(TEMPLATEPATH . ‘/controlpanel.php’); ?>[/php]
Now you’ll need to start editing the array values to add your options.
[php]
$options = array (
array( "name" => "Radio Selection Set",
"desc" => "This is a descriptions",
"id" => $shortname."_radio",
"type" => "radio",
"std" => "3",
"options" => array("3", "2", "1")),
array( "name" => "Text Box",
"desc" => "This is a descriptions",
"id" => $shortname."_text_box",
"std" => "Some Default Text",
"type" => "text"),
array( "name" => "Bigger Text Box",
"desc" => "This is a descriptions",
"id" => $shortname."_bigger_box",
"std" => "Default Text",
"type" => "textarea"),
array( "name" => "Dropdown Selection Menu",
"desc" => "This is a descriptions",
"id" => $shortname."_dropdown_menu",
"type" => "select",
"std" => "Default",
"options" => array("Default", "Option 1", "Option 2")),
array( "name" => "Checkbox selection set",
"desc" => "This is a descriptions",
"id" => $shortname."_checkbox_menu",
"type" => "checkbox",
"std" => "Default",
"options" => array("Default", "Option 1", "Option 2")),
array( "name" => "Multiple selection box",
"desc" => "This is a descriptions",
"id" => $shortname."_multi_select_dropdown_menu",
"type" => "multiselect",
"std" => "Default",
"options" => array("Defaults", "Option 1s", "Option 2s"))
);
[/php]
I’ve included in the framework examples of all the types of elements you can add, you can have as many options as you like. Notice there are four different types text, textarea, radio, select, multiple select, and checkbox. Also pay attention to the type of the file to the first two variables that you need to edit to reflect your theme.
[php light=”true”]
$themename = "ThemeFullName";
$shortname = "themeShortName";
[/php]
After you have your option page the way you like you’ll need some way of get the variables onto other pages of you theme. You’ll need to add these next few lines to every page on which you plan to use the theme variables.
[php light=”true”]
<?php
global $options;
foreach ($options as $value) {
if($value[‘type’]!="checkbox" and $value[‘type’]!="multiselect"){
if (get_settings( $value[‘id’] ) === FALSE) { $$value[‘id’] = $value[‘std’]; } else {
$$value[‘id’] = get_settings( $value[‘id’] ); }
}
else{
if (get_settings( $value[‘id’] ) === FALSE) { $$value[‘id’] = explode(",",$value[‘std’]); } else {
$$value[‘id’] = explode(",",get_settings( $value[‘id’] )); }
}
} ?>
[/php]
Now you can use the variables on this page. The variables will look like this let’s assume you set $shortname = “theme”, then your variables will look like this $theme_radio, $theme_text_box, $theme_bigger_box, $theme_dropdown_menu. Also keep in mind that you can add one than one of any kind of element, you can also rename any of the elements for easier variable management. Where “id” => $shortname.”_radio”, is defined you can change the _radio part to reflect what the option is actually for. For example I have mine set to chose how many columns my theme displays, so my variable is “id” => $shortname.”_columns”.
Update
To check the value of your multiple selection or checkbox variables you’ll need to use this. Where Item is the value that your checking that is selected or checked.
[php light=”true”]
if(in_array("Item",$theme_checkbox))
[/php]
By Designer October 2, 2008 - 7:48 am
Hey man thanks a lot of this!
I’m still learning wordpress so this will be of great help 🙂
Could I ask you what license this framework has? Usable for commercial projects ? Soon I’m going to start designing wordpress themes and my friend will code them so can this be used? We will be making most of the themes opensource.
Thanks again, keep it up 🙂
By Jeremy Clark October 2, 2008 - 11:10 am
Use as you see fit. Everything I release is GPL. Thanks for you interest.
By Designer October 9, 2008 - 10:11 pm
Thanks 🙂
By Adrian3 October 21, 2008 - 6:16 pm
Thanks for this template. I have been looking around for this very thing. This is the first one I have found that made sense to me. Cheers!
By Jeremy Clark October 22, 2008 - 7:40 am
Glad it helps. I’ll probably be improving on it shortly. I’m thinking of starting developing a new theme.
By Adrian3 October 23, 2008 - 1:49 am
Jeremy,
So I used your framework to make a nice options page for my theme. Liking what I had made I wanted to turn it into a plugin so I could use it with other themes. Everything seems to work just fine pretty much without modification except for when I try to change the options. The path to the controlpanel.php doesn’t work because now the file is in the plugin directory, not the theme directory. This seems like it should be easy, but I frankly barely know what I am doing. Do you think you could help me out? The line in question I think is:
header(“Location: themes.php?page=controlpanel.php&saved=true”);
Thanks in advance for your help, and thanks again for providing this framework!
By Reddy November 1, 2008 - 4:19 pm
Fantastic, just what I’ve been looking for! What I miss is a checkbox type though. Been trying to add it myself, but I must be doing something wrong 🙁
By Jeremy Clark November 1, 2008 - 8:22 pm
Yeah I need to re work the frame work and include a checkbox area. Glad you found your answer though.
By Jeremy Clark November 7, 2008 - 12:21 pm
After looking at how to add check box support, I think it would be a little above my php skill right now. I’ll keep thinking on it though.
By Reddy November 1, 2008 - 4:47 pm
Ah, nevermind, found some answers elsewhere.
By teraOm November 6, 2008 - 12:29 pm
INstead of a txt file download, you may want to zip the file and give us a zip file instead.
Safari and firefox open the txt file as such. One click download wold be a better option and also saves bandwidth..
By Jeremy Clark November 6, 2008 - 12:41 pm
Very true, I’ve added a download button.
By Bobby November 17, 2008 - 11:43 pm
Did theme options change in 2.7? I tried implementing them by hand and it broke my theme and now when I include your framework into my functions.php my theme breaks as well.
By Mommy’s Idea Book » Blog Archive » Theme Options Framework January 21, 2009 - 2:43 am
[…] WordPress Theme Options Framework […]
By Andrew Turner February 15, 2009 - 12:53 am
Nice tutorial there, been looking for something very much like this, and the WP Theme Toolkit was a little too bloated for me.
Thanks.
By Jeremy Clark February 18, 2009 - 7:51 am
Thanks I can’t take all the credit for it though, I did borrow most of the code and just added a few extra elements to it.
By MusicReview March 23, 2009 - 4:22 am
Thank you very much for this framework. This made it much easier for me to ad some large textboxes to my options page, and means I don’t have to edit theme files anymore 🙂
By Jeremy Clark March 23, 2009 - 7:55 am
Glad that it helped.
By steven May 16, 2009 - 3:35 am
Great tutorial, but is there a way to put a stylesheet in it?
By Steven June 29, 2009 - 1:22 pm
Sorry, but I got another question. Is there a way to put a select multiple in the framework? I already tried, but when I want to get it, wordpress only shows one of all things I selected. Hope you understand me 😛
By Jeremy Clark June 29, 2009 - 9:23 pm
I haven’t been able to figure it out either. If I do though I’ll post an updated version.
By Mike September 9, 2009 - 2:11 am
Nice work, I cannot believe I never put something together like this before. I came across this page while looking up how to properly add a select option again as i was having a problem doing it off the top of my head and I’m glad I found this little bit.
As for Stevens problem, could you not just implode/explode the selected options with a delimeter so you can save themall together as a single option if wordpress will not save all the selected options by default.
By Wordpress Theme Options Framework Updated. | Split-Visionz September 11, 2009 - 12:45 am
[…] one of the options and ran a quick google search to find the answer. And that is how I came across This post on Jeremy Clarks blog which is a nice little script to easily add a theme options page. The only […]
By Mike September 11, 2009 - 12:47 am
I just updated this script to include multiple select boxes and checkboxes Jeremy, you can check it out on my blog. Let me know if you have any suggestions or criticisms.
By donna October 13, 2009 - 7:41 pm
hi… I’m using your techzoic WP theme. can’t figure out how to modify any .css.
I’ve used the custom css box in the options page…no go.
I’ve modified the style.php file…. no go.
please help.
I like your theme — except for this… I’m just missing something, right?
By Jeremy Clark October 14, 2009 - 7:53 am
I wouldn’t recommend changing the style.php unless you understand how it works. The custom css box in the options page should work just fine though. I’ll contact you through email to get more info.
By Fernando December 22, 2009 - 11:16 am
Hi Jeremy, I’m trying the framework but when I include the controlpanel.php the theme simply stops rendering. I only get an empty page without code when I see the site.
The file seems to overwrite a couple of Thematic’s Theme and this is could be the problem, but I can’t figure out what’s wrong.
I don’t have a clue.
Thanks for your help
By Jeremy Clark December 23, 2009 - 2:10 am
I’ll have to have a look at the Thematic’s code and see what the problem might be. I’ll contact you by email if I figure out the problem.
By GrindSmart Magazine Design Articles & Tutorials » Blog Archive » WordPress: Giving Clients Access to Theme Options December 28, 2009 - 2:26 am
[…] WordPress Theme Options Framework […]
By 10 Rare WordPress Theme Options Page Tutorials To Get You Started | CSS Reflex - Design Blog | Web Design | Inspiration and Resources for Designers February 15, 2010 - 10:10 am
[…] 1. WordPress Theme Options Framework […]
By 10+ WordPress Tutorials: How to Create an Options Page for Your WordPress Themes and Frameworks - WPConstructs.com March 6, 2010 - 12:39 am
[…] 11. WordPress Theme Options Framework by Jeremy Clark Technet.com […]
By riesurya August 5, 2010 - 1:51 pm
Just arrived after looking for multiple select option on theme options. I’ll make a try. Thanks very much Jeremy 🙂
By Cómo crear una página de opciones para tu tema WordPress • wpargentina October 1, 2010 - 4:39 pm
[…] primero que mencionaremos debido a su simplicidad es el framework de Jeremy Clark. Su WordPress Theme Options Framework contiene todos los controles que puedas necesitar y los hace […]
By tasarhane April 14, 2011 - 5:17 am
thanks a lot. trying..
By Sore Throat Remedies May 13, 2011 - 10:55 pm
oh cool, this information is really useful and definately is comment worthy!
By Jatin Soni June 19, 2011 - 3:41 am
Thanks for this script.
But I am newbie and dont know how and which code i should add into my theme to reflect the value of the option. Also want to know is there any way to add image uploade button into the theme option panel?
I am using now toolkit but getting some issue with that I am not able to replace my header logo, so can you please let me know how to make option with your script where user can upload them own logo with own url as well as my theme has lots of image as its a photographer theme. So need to add lots of image upload option for my home.php template.
I would respect your reply.