How To Create A Simple WordPress Theme Options Page

// THEME SETTINGS PAGE - http://www.wpexplorer.com/wordpress-theme-options/
//register settings
function theme_settings_init(){
    register_setting( 'theme_settings', 'theme_settings' );
}

//add settings page to menu
function add_settings_page() {
add_menu_page( __( 'Theme Settings' ), __( 'Theme Settings' ), 'manage_options', 'settings', 'theme_settings_page');
}

//add actions
add_action( 'admin_init', 'theme_settings_init' );
add_action( 'admin_menu', 'add_settings_page' );

//define your variables
$item = array('default','blue','green',);

//start settings page
function theme_settings_page() {

if ( ! isset( $_REQUEST['updated'] ) )
$_REQUEST['updated'] = false;

//get variables outside scope
global $item;
?>

<div>

<div id="icon-options-general"></div>
<h2><?php _e( 'Theme Settings' ) //your admin panel title ?></h2>
<p>Visit <a href="http://www.wpexplorer.com/wordpress-theme-options/">HERE</a> to see how to use it.</p>


<?php
//show saved options message
if ( false !== $_REQUEST['updated'] ) : ?>
<div><p><strong><?php _e( 'Options saved' ); ?></strong></p></div>
<?php endif; ?>

<form method="post" action="options.php">

<?php settings_fields( 'theme_settings' ); ?>
<?php $options = get_option( 'theme_settings' ); ?>

<table>

<!-- Option 1: Custom Logo -->
<tr valign="top">
<th scope="row"><?php _e( 'Text' ); ?></th>
<td><input id="theme_settings[your-text]" type="text" size="36" name="theme_settings[your-text]" value="<?php esc_attr_e( $options['your-text'] ); ?>" />
<label for="theme_settings[your-text]"><?php _e( 'Enter your text' ); ?></label></td>
</tr>

<!-- Option 2: Color Scheme -->
<tr valign="top">
<th scope="row"><?php _e( 'Choice' ); ?></th>
<td><select name="theme_settings[item]">
<?php foreach ($item as $option) { ?>
<option <?php if ($options['item'] == $option ){ echo 'selected="selected"'; } ?>><?php echo htmlentities($option); ?></option>
<?php } ?>
</select>
<label for="theme_settings[item]"><?php _e( 'Choose your item' ); ?></label></td>
</tr>

<!-- Option 3: Disable Footer -->
<tr valign="top">
<th scope="row"><?php _e( 'Disable' ); ?></th>
<td><input id="theme_settings[disable]" name="theme_settings[disable]" type="checkbox" value="1" <?php checked( '1', $options['disable'] ); ?> />
<label for="theme_settings[disable]"><?php _e( 'Check this box if you would like to disable the widgetized footer section' ); ?></label></td>
</tr>

<!-- Option 4: Tracking Code -->
<tr valign="top">
<th scope="row"><?php _e( 'textbox' ); ?></th>
<td><label for="theme_settings[textbox]"><?php _e( 'Enter your long text' ); ?></label>
<br />
<textarea id="theme_settings[textbox]" name="theme_settings[textbox]" rows="5" cols="36"><?php esc_attr_e( $options['textbox'] ); ?></textarea></td>
</tr>

</table>

<p><input name="submit" id="submit" value="Save Changes" type="submit"></p>
</form>

</div><!-- END wrap -->
<h1>How to use it</h1>
<p>Insert the following at the top of the theme file you are editing.</p>
<code>
&#60;&#63;php &#36;options &#61; get&#95;option&#40; &#39;theme&#95;settings&#39; &#41;&#59;
&#63;&#62;
</code>

<h2>Adding Text</h2>
<p>In order to add this to your theme you will first check for the option and if it’s blank show nothing instead.</p>
<code>
&#60;&#63;php if&#40;&#36;options&#91;&#39;your&#45;text&#39;&#93;&#41; &#123; &#63;&#62;<br />
&#60;&#63;php echo &#36;options&#91;&#39;your&#45;text&#39;&#93;&#59;
&#63;&#62;<br />
&#60;&#63;php &#125; else &#123; &#63;&#62;<br />
&#60;&#63;php &#125;
&#63;&#62;
</code>

<h2>Adding Choice</h2>
<p>In the choice code above we added some options in the theme options page where a user could choose from a drop-down their choice.</p>
<code>
&#60;&#63;php if&#40;&#36;options&#91;&#39;item&#39;&#93; &#33;&#61; &#39;&#39;&#41; &#123; &#63;&#62;<br />
&#60;&#63;php
echo &#36;options&#91;&#39;item&#39;&#93;&#59; &#63;&#62;<br />
&#60;&#63;php &#125; &#63;&#62;
</code>

<h2>Adding Disable</h2>
<p>A common option is the ability to disable something in your theme. Using the admin panel code above you would then add the conditional to wherever the code for what you want disabled is.</p>
<code>
&#60;&#63;php if &#40;&#36;options&#91;&#39;disable&#39;&#93; &#33;&#61; true&#41; &#123;
&#63;&#62;<br />
What ever is in here gets
disabled when the theme options checkbox
is ticked<br />
&#60;&#63;php &#125; &#63;&#62;
</code>

<h2>Adding Text box</h2>
<p>This is a simple textarea input where the user will paste their text so all you need to do is “echo” the option’s input in your theme.</p>
<code>
&#60;&#63;php<br />
&#47;&#47;show tracking code for the header<br />
echo
stripslashes&#40;&#36;options&#91;&#39;textbox&#39;&#93;&#41;&#59;<br />
&#63;&#62;
</code>



<?php
}
//sanitize and validate
function options_validate( $input ) {
    global $select_options, $radio_options;
    if ( ! isset( $input['option1'] ) )
        $input['option1'] = null;
    $input['option1'] = ( $input['option1'] == 1 ? 1 : 0 );
    $input['sometext'] = wp_filter_nohtml_kses( $input['sometext'] );
    if ( ! isset( $input['radioinput'] ) )
        $input['radioinput'] = null;
    if ( ! array_key_exists( $input['radioinput'], $radio_options ) )
        $input['radioinput'] = null;
    $input['sometextarea'] = wp_filter_post_kses( $input['sometextarea'] );
    return $input;
}