Wednesday, November 5, 2008

How to create a WordPress theme option page

This tutorial will show you how to create a simple WordPress theme option page.

First, you will need a sample theme. Create a new folder in wp-contentthemes. Name it 'test' (or, whatever you like). Create three files in the 'test' folder: index.php, style.css and functions.php. Now, you should choose the 'test' theme as the current theme.

Second, open the functions.php file in your favourite text editor, and paste the following php code.
add_action('admin_menu', 'add_welcome_interface');
function add_welcome_interface()
/* add_theme_page( page_title, menu_title,
access_level/capability, file, [function]); */

add_theme_page('Your Theme Name', 'Your Theme Options',
'edit_themes', basename(__FILE__), 'editoptions');

function editoptions() {

<div class=“wrap">
<h2>Your Theme Name</h2>
<form action=“options.php" method=“post">

<?php wp_nonce_field('update-options'); ?>

<table class=“form-table">
<tr valign=“top">
<th scope=“row">First Option</th>
<td><input value=“<?php echo get_option('first_option'); ?>;"
<tr valign=“top">
<th scope=“row">Second Option</th>
<td><input value=<?php echo get_option('second_option'); ?>"

<input type=“hidden" value=“update" name=“action">
<input type="hidden" value="first_option,second_option"

<p class=“submit">
<input type=“submit" value=“<?php _e('Save Changes') ?>“


<?php } ?>

Finally, you can call the options that you save in index.php file, using the get_option() function.
echo get_option(‘first_option’);
echo get_option(’second_option’);

Function References:




  1. although i dun know what the post u write about but it is very useful for people who search in google about this !!

  2. pardon me, dont you need IF function in your index.php?

    Or am I missing something..?

  3. NoktahHitam: That is only part of the index.php file. As I had mentioned, you can retrieve the options that you have save via get_option() function, as in the example.

    However, if you want to check the existent of the option before you actually call it, you can apply the if condition like this:

    if (get_option('option_one')) {
    echo get_option('option_one');

  4. waht is the php string that i should put in my index.php to call those function? And do this mess in IE?

  5. syuxx: To retrieve the saved options, for example your option name is 'greeting', you can display it like this

    echo get_option('greeting');

    You can use it in any file, such as header.php or sidebar.php.

    For example, you can use it to display a greeting message, social bookmark, or even advertisement.

    A good example would be, if you have an advertisement code too be put in multiple location. Save it as an option. Whenever you want to display the ads, just use get_option() function.

    Regarding the IE, IMHO, I don't think that it is a relevant question.