wordpress settings api add fields

Question

I am trying to add some code to a theme that will allow the user to change the logo or have some text instead. I managed to find some code that otto posted to do the file upload.

I have added what I thought was how to add the other fields but they do not save for some reason and I am sure it is something very simple I have missed:

add_action('admin_init', 'ld_admin_init');
function ld_admin_init() {
register_setting( 'ld_options', 'ld_options', 'ld_options_validate' );
add_settings_section('ld_main', 'Upload', 'ld_section_text', 'ld');
add_settings_field('ld_setting_checkbox', 'Use image', 'ld_setting_checkbox', 'ld', 'ld_main');
add_settings_field('ld_setting_string', 'Logo text', 'ld_setting_string', 'ld', 'ld_main');
add_settings_field('ld_filename', 'File:', 'ld_setting_filename', 'ld', 'ld_main');
}

// add the admin options page
add_action('admin_menu', 'ld_admin_add_page');
function ld_admin_add_page() {
$mypage = add_theme_page('Logo', 'Logo', 'manage_options', 'ld', 'ld_options_page');
}

// display the admin options page
function ld_options_page() {

?>
<div class="wrap">
<h2>Logo settings</h2>
<p>You can upload a new logo.</p>
<form method="post" enctype="multipart/form-data" action="options.php">
<?php settings_fields('ld_options'); ?>
<?php do_settings_sections('ld'); ?>
<p class="submit">
<input type="submit" name="Submit" class="button-primary" value="<?php esc_attr_e('Save Changes') ?>" />
</p>
</form>

</div>

<?php
}

function ld_section_text() {
$options = get_option('ld_options');
echo '<p>Upload your file here:</p>';
if ($file = $options['file']) {
    //var_dump($file);
    echo "<img src='{$file['url']}' />";
}
}

function ld_setting_filename() {
echo '<input type="file" name="ld_filename" size="40" />';
}

function ld_setting_checkbox() {
$usetext = get_option('ld_options');
if($usetext['chkbox1']) { $checked = ' checked="checked" '; }
echo "<input ".$checked." id='plugin_chk1' name='ld_options[chkbox1]' type='checkbox' />";
}

function ld_setting_string() {
$logotext = get_option('ld_options');
echo "<input id='ld_logo_text' name='ld_options[text_string]' size='40' type='text' value='{$logotext['text_string']}' />";
}

function ld_options_validate($input) {
$newinput = array();
if ($_FILES['ld_filename']) {
    $overrides = array('test_form' => false); 
    $file = wp_handle_upload($_FILES['ld_filename'], $overrides);
    $newinput['file'] = $file;
}
return $newinput;
}

I would like to be able to set it up so they can upload the image and if the box is ticked the image is used for the logo else the text is displayed. I jsut need to get the info saved so i can use it in the output.

Answer 1

You're passing the same ID to every single setting of a given type, rather than passing the $setting to the callback. Have a look at how I implement this type of callback in Oenology.

function oenology_setting_callback( $option ) {
    $oenology_options = oenology_get_options();
    $option_parameters = oenology_get_option_parameters();
    $optionname = $option['name'];
    $optiontitle = $option['title'];
    $optiondescription = $option['description'];
    $fieldtype = $option['type'];
    $fieldname = 'theme_oenology_options[' . $optionname . ']';

    // Output checkbox form field markup
    if ( 'checkbox' == $fieldtype ) {
        ?>
        <input type="checkbox" name="<?php echo $fieldname; ?>" <?php checked( $oenology_options[$optionname] ); ?> />
        <?php
    }
    // Output radio button form field markup
    else if ( 'radio' == $fieldtype ) {
        $valid_options = array();
        $valid_options = $option['valid_options'];
        foreach ( $valid_options as $valid_option ) {
            ?>
            <input type="radio" name="<?php echo $fieldname; ?>" <?php checked( $valid_option['name'] == $oenology_options[$optionname] ); ?> value="<?php echo $valid_option['name']; ?>" />
            <span>
            <?php echo $valid_option['title']; ?>
            <?php if ( $valid_option['description'] ) { ?>
                <span style="padding-left:5px;"><em><?php echo $valid_option['description']; ?></em></span>
            <?php } ?>
            </span>
            <br />
            <?php
        }
    }
    // Output select form field markup
    else if ( 'select' == $fieldtype ) {
        $valid_options = array();
        $valid_options = $option['valid_options'];
        ?>
        <select name="<?php echo $fieldname; ?>">
        <?php 
        foreach ( $valid_options as $valid_option ) {
            ?>
            <option <?php selected( $valid_option['name'] == $oenology_options[$optionname] ); ?> value="<?php echo $valid_option['name']; ?>"><?php echo $valid_option['title']; ?></option>
            <?php
        }
        ?>
        </select>
        <?php
    } 
    // Output text input form field markup
    else if ( 'text' == $fieldtype ) {
        ?>
        <input type="text" name="<?php echo $fieldname; ?>" value="<?php echo wp_filter_nohtml_kses( $oenology_options[$optionname] ); ?>" />
        <?php
    } 
    // Output the setting description
    ?>
    <span class="description"><?php echo $optiondescription; ?></span>
    <?php
}

Answer 2

As far as I can see from your code the problem is that you're not returning the submitted values in the ld_options_validate() function. All you return is the $newinput array that can only contain the filename.

Try something like the following for ld_options_validate():

function ld_options_validate( $input ) {
    // set $newinput to the $input that was POSTed
    $newinput = $input;

    // update the file field
    if ($_FILES['ld_filename']) {
        $overrides = array('test_form' => false); 
        $file = wp_handle_upload($_FILES['ld_filename'], $overrides);
        $newinput['file'] = $file;
    } else {
        $newinput['file'] = maybe_unserialize( $input['file'] );
    }

    return $newinput;
}

While that indicates a fix to the actual problem of your other fields you'll need to maintain the file part of $input so it doesn't get overridden when no image is being uploaded. To do this you need to store the value of file in a hidden field within the form although things may get tricky because of serialisation.

Where you display the image in ld_section_text() add the following:

echo '<input type="hidden" name="ld_options[file]" value="' . serialize( $file ) . '" />';

I'd be tempted to register settings for each of your fields separately to make the validation easier.