wp image upload

by jho1086

HTML

<?php
/*    -------------------------------------------------------------
    Meta boxes [function.php]
- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -    */
add_action('edit_post', 'adj_update');
add_action('save_post', 'adj_update');
add_action('publish_post', 'adj_update');

/* Use the admin_menu action to define the custom boxes */
add_action('admin_menu', 'adj_add_custom_box');

/* Adds a custom section to the "advanced" Post and Page edit screens */
function adj_add_custom_box() {
    if( function_exists( 'add_meta_box' )) {
        add_meta_box( 'addsettings', 'Additional Settings', 
                'adj_inner_custom_box', 'page', 'advanced', 'high' );
    }
}
   
/* Prints the inner fields for the custom post/page section */
function adj_inner_custom_box() {
    // Use nonce for verification
    echo '<input type="hidden" name="myplugin_noncename" id="myplugin_noncename" value="' . 
    wp_create_nonce( plugin_basename(__FILE__) ) . '" />';
    
    // The actual fields for data entry
    global $post;
    $subtitle = stripslashes(get_post_meta($post->ID, 'subtitle', true));
    $pagebackground = stripslashes(get_post_meta($post->ID, 'pagebackground', true));
?>
        <div class="inside">
        <label for="subtitle"><strong>Page Subtitle:</strong> </label>
        <input type="text" name="subtitle" value="<?php echo $subtitle ?>" id="subtitle" style="width:95%" />
        <p>If menu title is different with page title, please type here the desired page title.</p>
        
        <label for="pagebackgroundthumb"><strong>Page Background Image:</strong> </label>
        <div id="pagebackgroundthumb"><?php if(!empty($pagebackground))echo '<img src="'.$pagebackground.'" alt="" width="80%" />';?></div>
        <input id="upload_image" name="pagebackground" type="hidden" size="45" value="<?php echo $pagebackground;?>">
        <input class="button-secondary" id="upload_image_button" value="Upload/Select an image" type="button"><input...

CSS

<?php
//code to display the custom field value in template.
$background = stripslashes(get_post_meta($post->ID, 'pagebackground', true));
if (isset($background[0])){echo '<img src="'.$background.'" alt="images" />';}
?>

JavaScript

<script type="text/javascript">
var formfield = '';
$j(document).ready(function(){uploadimagebutton();});
function uploadimagebutton() {
    $j('#upload_image_button').click(function() {
        formfield = $j(this).prev().attr('name');
        tb_show('', 'media-upload.php?type=image&amp;TB_iframe=true');
        return false;
    });    
    window.original_send_to_editor = window.send_to_editor;
    window.send_to_editor = function(html){
        if (formfield) {
            imgurl = $j(html).attr('src');
            $j('#'+formfield).val(imgurl);
            tb_remove();
            $j('#pagebackgroundthumb').html('<img src="'+imgurl+'" alt="" style="max-width:85%;" />');
        } else {
            window.original_send_to_editor(html);
        }
    };
    $j('#delete_image_button').click(function(){
        formfield = $j(this).prev().prev().attr('name');
        $j('#'+formfield).attr('value', '');
        $j('#pagebackgroundthumb').html('');
    });
}
</script>