WordPress Settings API, text, tinymce, file upload simple example

Here is example screenshot:

screenshot

<?php
// return array of default theme options
function example_get_default_theme_options() {
    $options = array(
        'slogan' => 'Hello world!',
        'contacts' => 'Provide your contact information here',
        'copyright' => 'All rights reserverd.',
        'logotype' => '',
    );
    return $options;
}

// simple helper functions to get option values in theme
function get_example_option($name) {
    $options = get_option('example_theme_options', example_get_default_theme_options());

    return $options[$name];
}
function example_option($name) {
    echo get_example_option($name);
}

// add theme settings page
function example_menu_options() {
    // page title, menu title, access rules, url slug, render callback function
    $page = add_theme_page('Example Options', 'Example', 'edit_theme_options', 'theme_options', 'example_theme_options_render_page');
    add_action('admin_print_scripts-' . $page, 'example_options_page_enqueue_assets');
}
add_action('admin_menu', 'example_menu_options');

// enqueue needed assets (for tinymce actualy)
function example_options_page_enqueue_assets() {
    wp_enqueue_script('common');
    wp_enqueue_script('jquery-color');
    wp_print_scripts('editor');
    if (function_exists('add_thickbox')) add_thickbox();
    wp_print_scripts('media-upload');
    if (function_exists('wp_tiny_mce')) wp_tiny_mce();
    wp_admin_css();
    wp_enqueue_script('utils');
    do_action("admin_print_styles-post-php");
    do_action('admin_print_styles');

    // handling upload_button for logotype, copy-pasted from custom-metadata plugin
    ?>
    <script type="text/javascript">
    jQuery(document).ready(function($) {
        var upload_field, upload_preview;
        if ($('.upload_button').length) {
            $('.upload_button').live('click', function(e) {
                upload_field = $(this).closest('td').find('input.upload_field:first');
                upload_preview = $(this).closest('td').find('img.upload_preview:first');
                window.send_to_editor=window.send_to_editor_clone;
                tb_show('','media-upload.php?TB_iframe=true');
                return false;
            });
            window.original_send_to_editor = window.send_to_editor;
            window.send_to_editor_clone = function(html){
                file_url = jQuery('img',html).attr('src');
                if (!file_url) { file_url = jQuery(html).attr('href'); }
                tb_remove();
                upload_field.val(file_url);
                upload_preview.attr('src', file_url);
            }
        }

        $('.upload_clear').live('click', function(e) {
            $(this).closest('td').find('input.upload_field:first').val('');
            $(this).closest('td').find('img.upload_preview:first').hide();
            return false;
        });
    });
    </script>
    <?php
}

// register settings
function example_settings_api_init() {
    // retrieve settings, if settings not set, save default
    if(false === get_option('example_theme_options', example_get_default_theme_options()))
        add_option('example_theme_options', example_get_default_theme_options());

    //group name (can be any, see settings_fields() call in example_theme_options_render_page()), option name (look at add_option, get_option), validate function callback
    register_setting('example_options', 'example_theme_options', 'example_theme_options_validate');

    // id, title, render callback function, url slug
    add_settings_section('general', '', '__return_false', 'theme_options');
    // $options[KEY], label, render callback function, url slug, settings_section id
    add_settings_field('slogan', 'Slogan label', 'example_settings_field_slogan', 'theme_options', 'general');
    add_settings_field('contacts', 'Contacts label', 'example_settings_field_contacts', 'theme_options', 'general');
    add_settings_field('copyright', 'Copy label', 'example_settings_field_copyright', 'theme_options', 'general');
    add_settings_field('logotype', 'Logotype label', 'example_settings_field_logotype', 'theme_options', 'general');
}
add_action('admin_init', 'example_settings_api_init');

// render for $options['slogan'] field
function example_settings_field_slogan() { $options = get_option('example_theme_options', example_get_default_theme_options()); ?>
    <input type="text" name="example_theme_options[slogan]" id="slogan" value="<?php echo esc_attr($options['slogan']); ?>" />
<?php }

function example_settings_field_contacts() { $options = get_option('example_theme_options', example_get_default_theme_options()); ?>
    <?php the_editor($options['contacts'], 'example_theme_options[contacts]', '', true, 2); ?>
<?php }

function example_settings_field_copyright() { $options = get_option('example_theme_options', example_get_default_theme_options()); ?>
    <?php the_editor($options['copyright'], 'example_theme_options[copyright]', '', true, 3); ?>
<?php }

function example_settings_field_logotype() { $options = get_option('example_theme_options', example_get_default_theme_options()); ?>
    <?php if(!empty($options['logotype'])):?>
        <div>
            <img class="upload_preview" src="<?php echo esc_attr($options['logotype'])?>" />
        </div>
    <?php endif;?>
    <input type="text" class="upload_field" name="example_theme_options[logotype]" id="logotype" value="<?php echo esc_attr($options['logotype']); ?>" />
    <input type="button" class="button upload_button" value="Upload" />
    <input type="button" class="button upload_clear" value="Remove" />
<?php }

// validation callback, gets array of $input, must retrieve the same array of $output, which will be saved to options
function example_theme_options_validate($input) {
    $output = $defaults = example_get_default_theme_options();

    $output['slogan'] = empty($input['slogan']) ? $defaults['slogan'] : $input['slogan'];
    $output['contacts'] = empty($input['contacts']) ? $defaults['contacts'] : $input['contacts'];
    $output['copyright'] = empty($input['copyright']) ? $defaults['copyright'] : $input['copyright'];
    $output['logotype'] = empty($input['logotype']) ? $defaults['logotype'] : $input['logotype'];

    if(!empty($output['logotype'])) { // allow only jpg, png and gif logotypes
        $output['logotype'] = in_array(strtolower(end(explode('.', $output['logotype']))), array('jpg', 'jpeg', 'png', 'gif')) ? $output['logotype'] : '';
    }

    if(!empty($output['logotype'])) { // try to get full image
        if(0 === strpos($output['logotype'], home_url())) { // if it is local image
            if(preg_match('/(.*?)\-\d+x\d+\.(jpg|jpeg|gif|png)$/usi', $output['logotype'], $match)) { //not full size
                $upload_dir = wp_upload_dir();

                if(file_exists($upload_dir['basedir'] . DIRECTORY_SEPARATOR . str_replace($upload_dir['baseurl'], '', $match[1] . '.' . $match[2]))) {
                    $output['logotype'] = $match[1] . '.' . $match[2];
                }
            }
        }
    }

    return $output;
}

// render page callback
function example_theme_options_render_page() { ?>
    <div class="wrap">
        <?php screen_icon(); ?>
        <h2>Theme options</h2>
        <?php settings_errors(); ?>

        <form method="post" action="options.php">
            <?php
                settings_fields('example_options');
                do_settings_sections('theme_options');
                submit_button();
            ?>
        </form>
    </div>
<?php }

To display option in theme use helper functions like so:

<?php echo apply_filters('the_content', get_swickd_option('copyright')) ?>