Pages

Thursday, March 21, 2013

WordPress 3.5 media upload customized form


You can use WordPress image upolader in your theme, theme option or plugin.  You can find out detail from this post. You can download demo files from the link placed below.

Follow the steps mentioned here


Include following jquery in your page

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script> <script type="application/javascript">
jQuery(document).ready(function($){
var _custom_media = true;
 _orig_send_attachment = wp.media.editor.send.attachment;
 $('#btn_upload').click(function(e) {
var send_attachment_bkp = wp.media.editor.send.attachment;
_custom_media = true;
wp.media.editor.send.attachment = function(props, attachment){
 if ( _custom_media ) {
 $("#txt_imageurl").val(attachment.url);
 } else {
 return _orig_send_attachment.apply( this, [props, attachment] ); }; }
 wp.media.editor.open(this); return false; }); });
 </script>

Enable following wordpress jqueries

<?php if(function_exists( 'wp_enqueue_media' )){
wp_enqueue_media();
 }else{
wp_enqueue_style('thickbox');
wp_enqueue_script('media-upload');
wp_enqueue_script('thickbox'); }?>

Create elements for uploading
<input type="text" name="txt_imageurl" id="txt_imageurl" />
<input type="button" class="button" name="btn_upload" id="btn_upload" value="Upload" />

Download Demo from GitHub Click Here