How can I add meta boxes to the front end post submission form? Similar to front end post submission that creates new posts, the form replies should go directly into the post meta boxes.

Meta Boxes Code Example for post from back-end to front-end

<?php 

function admin_init(){
    add_meta_box("mia_post_meta", "Information", "mia_post_meta", "post", "normal", "high");
}
add_action("admin_init", "admin_init");

function mia_post_meta($callback_args) {
    global $post;

    $post_type = $callback_args->post_type;
    $temp_array = array();

    $temp_array = maybe_unserialize(get_post_meta($post->ID,'mia_ev_settings',true));

    $mia_ev_bday = isset( $temp_array['mia_ev_bday'] ) ? $temp_array['mia_ev_bday'] : '';   
    echo '<script type="text/javascript">jQuery(document).ready(function(){jQuery("#mia_ev_bday").simpleDatepicker();});</script>';

?>

    <div id="mia_custom_settings" style="margin: 13px 0 17px 4px;">

            <div class="mia_fs_setting" style="margin: 13px 0 26px 4px;">
                <label for="mia_ev_bday" style="color: #000; font-weight: bold;"> Birthday: </label>
                <input type="text" class="small-text" value="<?php echo $mia_ev_bday; ?>" id="mia_ev_bday" name="mia_ev_bday" size="67" />
                <br />
                <small style="position: relative; top: 8px;">ex: <code>13 Jan, 2011</code></small>
            </div>

    </div>

    <?php
}

add_action('save_post', 'save_details');
function save_details($post_id){
    global $post;

    $temp_array = array();

    if ( defined('DOING_AUTOSAVE') && DOING_AUTOSAVE ) 
        return $post_id;

    $temp_array['mia_ev_bday'] = isset($_POST["mia_ev_bday"]) ? $_POST["mia_ev_bday"] : '';

    update_post_meta( $post->ID, "mia_ev_settings", $temp_array );
}

function mia_bday_scripts(){
    wp_register_script('datepicker', get_bloginfo('template_directory').'/js/date/datepicker.js', array('jquery'));
    wp_enqueue_script('datepicker');
}

function mia_style_css(){
    wp_register_style( 'datepicker', get_bloginfo('template_directory').'/js/date/datepicker.css');
    wp_enqueue_style('datepicker');
}

add_action('admin_print_scripts', 'mia_date_scripts');
add_action('admin_print_styles', 'mia_style_css');

?>

The mia_ev_bday should be filled out by users on the front-end as well.

FORM EXAMPLE on Front-end see Image

The information added by users in the form should be displayed in the post and appear in the back-end meta box in the custom meta boxes.

3 Answers
3

You can make a form that has an action of your form handling php script. In the php script, you can check if the form was submitted, and if there is an action, if so, then create variables for the form fields using the $_POST var. Then create the $post = array() to set up the post meta array, and use the wp_insert_post($post); to insert the post.

Here is an example of a form processing code I use for the frontend post form used on http://WPHonors.com. It works for the custom post type I created for it, which had a basic form set up, with a hidden post_type field with the post type as the value.

if( $_POST['post_type'] == 'site' ) {

    $title = $_POST['title'];
    $desc = $_POST['description'];
    $siteurl = $_POST['siteurl'];
    $cat = array( $_POST['cat'] );
    $tags = trim( $_POST['tags'] );

    if(!isset($title)) { echo '<div class="error">Title required.</div>'; }
    if(!isset($desc)) { echo '<div class="error">Description required.</div>'; }
    if(!isset($siteurl)) { echo '<div class="error">URL required.</div>'; }
    if($cat == -1) { echo '<div class="error">Select a category.</div>'; }
    if(!isset($tags)) { echo '<div class="error">Must use at least one tag.</div>'; }

    if (!current_user_can( 'publish_posts')) { $poststatus="draft"; } else { $poststatus="publish"; } 

    //$insert = new TypeSites();
    $post = array(
        'post_title'    => $title,
        'post_content'  => $desc,
        'siteurl'   => $siteurl,
        'post_category' => $cat,
        'tags_input'    => $tags,
        'post_status'   => $poststatus,
        'post_type' => 'site'
    );
    wp_insert_post( $post );
}

Leave a Reply

Your email address will not be published. Required fields are marked *