Create An Advanced Theme Options Panel in WordPress
Posted on 05. Oct, 2009 by Alex Denning in Featured, Theme Options Page
This is the start of WPShout‘s second ‘themed week’, which run every first week of the month. Last month we got started with WordPress theme development and this month we’re going to be creating an advanced theme options page.
Creating a WordPress theme options page is something that we’ve touched on before on WPShout, and this week we’ll be expanding on what we covered before to create not just a theme options page, but an advanced theme options page; we’ll be creating something that lets users change layouts, hide and display different elements dotted around the theme, enter ad codes, footer text, tracking codes, Feedburner URLs, anything really:
This is a screen of the options page we’ll be creating over the next couple of days – as you can see, pretty impressive! The plan for the week is as follows:
- Day 1: Introduction
- Day 2: Creating the different options
- Day 3: Styling the options page
- Day 4: Implementing the options into a theme
And that’s pretty much it. Unlike last time there won’t be a free eBook to download at the end of the week, but this is a shorter series at only four days. Throughout the week you’ll be most welcome to ask any questions etc etc through the comments, and I’d ask if you’re going to save the series to any social media site then please save this post. The code for the tutorial series comes from my WordPress theme framework, Biblioteca (that in turn is based on Thematic’s options page). We offer you incredible online training for all kind of certifications including mcitp as well as mcts and a+ certification.
That’s all the admin stuff out the way, so subscribe by RSS, save this post to Delicious and grab a cup of tea. It’s going to be an interesting week.
Related posts:
Enjoyed the post? We'll see you on Twitter or in your RSS reader!
Alex Denning is the founder of WPShout. A WordPress developer from London, Alex co-founded WPShift at the start of 2010 where he sells awesome WordPress themes.
You can find Alex on Twitter and at AlexDenning.com.
21 Responses to “Create An Advanced Theme Options Panel in WordPress”
Trackbacks/Pingbacks
[...] Create An Advanced Options Page in WordPress – 1 – 2 – 3 – 4 Una guida in quattro puntate che vi insegnerà a creare una pagina di opzioni avanzata per il vostro tema WordPress. [...]
[...] People love having options. Make it easy on your users to customize or personalize your Theme by creating and including an Options page. Don’t know where to start? Check out this easy tutorial, or this more advanced one. [...]
[...] page isn’t that hard (and needn’t be hard either) – recently WPShout ran “Create an Advanced Theme Options Page” in which, as you might have guessed, we created an advanced theme options page with options [...]
[...] Create An Advanced Options Page in WordPress [...]
[...] to include Advanced Options Page in a theme, glad I read Alex Denning’s article on how to Create an Advanced Options Page in WordPress. Thank you, thank you! I don’t know if I would be able to make it myself hadn’t I read [...]
[...] 4. Create An Advanced Options Page in WordPress (part 1) by WPShout [...]
[...] 9. Create An Advanced Options Page in WordPress [...]
[...] are too created from the functions.php file. WPShout has a whole tutorial written on the topic here.Language – the functions.php file lets you set up the option for multi-lingual theming.As the [...]
[...] Creating An Advanced Options Page in WordPress Part 1, Part 2, Part 3, and Part 4 [...]
[...] Create an Advanced Options Page in WordPress [...]
Leave a Reply
- WordPress Theme Design Basics
- Create An Advanced Options Page in WordPress
- Premium Frameworks Reviewed
- Creating A Tumblog With WordPress
- 10 Practical WordPress Security Tips
- A to Z of WordPress .htaccess Hacks
- WordPress Theme Design Basics
- 10 WordPress Plugins That Every Blog Needs
- 10 Awesome Things To Do With WordPress' Custom Fields
- How To Stop An Eithical Hacker Breaking Into Your WordPress Site
Cosmin
06. Oct, 2009
Looking forward to the series Alex
Just one small adivce: since the options page is quite complex, you should reconsider offering a pdf for download at the end of the week – I’m sure many will appreciate it
Thanks for your efforts in creating this series.
.-= Cosmin´s last blog ..PSD to WordPress Theme Photoshop Plugin =-.
Alex Denning
06. Oct, 2009
If my lovely readers want it, I’ll make it happen. It does take a fair amount of time to put something like that together, so it wouldn’t be available for a couple of weeks, but as I said – if there is a demand for it, I’ll make it
TechSlam
06. Oct, 2009
As cosmin has said, I would also really appreciate if you create a wonderful pdf regarding the creation of options page. Looking forward for it.
.-= TechSlam´s last blog ..Aslam’s BlogBuzz >>>>> Aslam’sBuzz =-.
Ben
06. Oct, 2009
Now this is what I’m talking about
BTW I like the new background you have on the site. Fits a lot better
.-= Ben´s last blog ..Elemental WordPress theme released =-.
Alex Denning
06. Oct, 2009
Cheers Ben
. The posts are all scheduled and I’m quite pleased with the outcome.
Something I’ve been meaning to ask – your theme Elemental – it’s a “framework” but it’s not GPL so how can one use it as a framework?
And ta for the background comment. I really like it as well – got it off GraphicRiver for a couple of pounds
.
Cosmin
29. Oct, 2009
Alex, I haven’t noticed when I first commented, and I really feel the need to ask this.
Regarding the “choose a layout for your blog” option.
In the screenshot, I see you’re using checkboxes and you’re telling the user to only check one – which for us developers totally makes sense and we would never tick two of them.
But for people with no tech skills, wouldn’t it be much accessible to turn those checkboxes into radio buttons (so they really can’t choose 2 options).
What do you say?
Thanks,
Cosmin.
.-= Cosmin´s last blog ..Magazine Style Theme – Arthemia Premium =-.
Alex Denning
29. Oct, 2009
Yeah. Definitely a better option to do that or even have a dropdown. If I ever update this tutorial that’s one to include.
Devin
30. Nov, 2009
Nice tutorial here. I noticed in another post that you recommended using Thematic as a framework. If anyone is doing that and wants to save some development time, try checking out the tutorial and source files for creating a theme options panel with Thematic.. You could also look at how to code a logo upload box.
.-= Devin´s last blog ..Using TimThumb with WordPress MU =-.
Alex Denning
02. Dec, 2009
Blatant plug; wasn’t sure whether to accept your comment or not – this tutorial is also built on Thematic, but interesting to see what you’ve done.
Comment Name Violation
05. Mar, 2010
Really interesting tutorial. I’ve got it saved.
Thanks also to @davin for the link
Cheers mate.
zek
13. Apr, 2010
Hello,
I’m using studiopress lifestyle classic theme. It have option page for the themes. How i can have textarea fill with color code in option page that will changed background color, wrap border color & wrap background color.
Thanks