Putting It All Together: Creating a WordPress Theme Options Page Resources

There are some good theme option tutorials already out there, but I found a lot of them either too elaborate for my needs or incomplete. As a result, I thought I’d break it down how I used various tutorials in order to complete my page.

Loading Your Theme File

To actually load your theme options page, make sure that it is loaded as part of the theme setup. If you’re using an existing theme, you should see a:

add_action( ‘after_setup_theme’, ‘themename_setup’ );
This or something similar tells WordPress to load the themename_setup function more or less as the theme is being loaded/applied. Refer to the function reference page if necessary.

Somewhere in the function that is called, themename_setup, add a line to load your theme options:

require( get_template_directory() . ‘/inc/theme-options.php’ );
Refer to the PHP Manual require page if necessary.

All the code talked about in the tutorials would go in this one file. If a theme-options file already exist, consider whether you would rather make a new one or simply modify the existing one. If you only have 1-2 options, also consider adding options to existing options, such as Writing, Discussion, etc. if appropriate.

Recommended Create a Theme/Plugin Options Page Tutorials

Make your options page: Presscoder’s Tutorial (second half of post) or Otto’s Tutorial (simpler, less to read through, but less complete)

One thing in particular, I preferred Presscoder’s validation code.

The one thing I’ve been having problems with is setting the default options, and some other people I have found also have problems with the register_activation_hook, in which case, try using add_action as explained by Chip Bennett.

At the bottom of Otto’s post, he also briefly explains how to add options on existing pages instead of making a new one.

First half of Presscoder’s post gives a good overview of the WordPress functions and easy copy/paste example code for the various types of form options (e.g. textarea, checkbox).

A full example of an options page can also be found on Presscoder’s post near the bottom (just above “In Summary”).

To get the “Options/Settings Updated” box when a user has submitted/saved their options: Search for “Settings Updated Notice” on page 3 of Chip Bennett’s tutorial.

Displaying Your Options

Obviously, this depends on what kind of options you had (textbox, checkbox, etc.). The simplest example is if you have a textbox or textarea and you want to simply output the user’s input. In the appropriate place, insert:

<?php $array_name = get_option(‘option_name’); echo $array_name[‘key’]; ?>
Refer to get_option function reference if necessary.

More Resources

Chip Bennett obviously wrote much more than what I just refer to, but it goes into much more complex options than I cared to and covers how to implement multiple tabs on one settings page. If you’re interested in more functionality, I definitely recommend his tutorial.

If you prefer to have a prebuilt helper, Olly Benson has created a sort of template or framework with reusable code. Read more on his blog (though I haven’t actually tried using it).

For more, the WordPress Settings API page has a list of tutorials.

Author: Cynthia

Technologist, Librarian, Metadata and Technical Services expert, Educator, Mentor, Web Developer, UXer, Accessibility Advocate, Documentarian

Leave a Comment

Please log in using one of these methods to post your comment:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out /  Change )

Twitter picture

You are commenting using your Twitter account. Log Out /  Change )

Facebook photo

You are commenting using your Facebook account. Log Out /  Change )

Connecting to %s

This site uses Akismet to reduce spam. Learn how your comment data is processed.

%d bloggers like this: