Mettez le téléchargeur de média dans une metabox
Je trouve très inutile d'avoir un bouton "ajouter une image" qui m'amène à un autre écran qui me permet de télécharger du contenu sur mon message.
Idéalement, j'aimerais disposer d'une méta-boîte avec la possibilité d'ajouter des images directement dans une méta-boîte.
J'ai réussi à obtenir certaines fonctionnalités en copiant le code source du formulaire de téléchargement de média et en le collant dans une boîte méta. L'image que je choisis est téléchargée, mais je ne présente aucune barre de progression et je dois trouver un moyen de répertorier les images jointes ci-dessous pour obtenir une meilleure vue d'ensemble.
Quelqu'un a réussi à faire ça?
Code:
function add_image_test() {
?>
<script type="text/javascript">
//<![CDATA[
addLoadEvent = function(func){if(typeof jQuery!="undefined")jQuery(document).ready(func);else if(typeof wpOnload!='function'){wpOnload=func;}else{var oldonload=wpOnload;wpOnload=function(){oldonload();func();}}};
var userSettings = {'url':'/','uid':'2','time':'1300489693'};
var ajaxurl = 'http://xxx.com/wp-admin/admin-ajax.php', pagenow = 'media-upload-popup', adminpage = 'media-upload-popup',
isRtl = 0;
//]]>
</script>
<script type='text/javascript'>
/* <![CDATA[ */
var swfuploadL10n = {
queue_limit_exceeded: "You have attempted to queue too many files.",
file_exceeds_size_limit: "This file exceeds the maximum upload size for this site.",
zero_byte_file: "This file is empty. Please try another.",
invalid_filetype: "This file type is not allowed. Please try another.",
default_error: "An error occurred in the upload. Please try again later.",
missing_upload_url: "There was a configuration error. Please contact the server administrator.",
upload_limit_exceeded: "You may only upload 1 file.",
http_error: "HTTP error.",
upload_failed: "Upload failed.",
io_error: "IO error.",
security_error: "Security error.",
file_cancelled: "File canceled.",
upload_stopped: "Upload stopped.",
dismiss: "Dismiss",
crunching: "Crunching…",
deleted: "moved to the trash.",
error_uploading: "“%s” has failed to upload due to an error"
};
try{convertEntities(swfuploadL10n);}catch(e){};
/* ]]> */
</script>
<script type='text/javascript' src='http://xxx.com/wp-admin/load-scripts.php?c=1&load=jquery,utils,swfupload-all,swfupload-handlers,json2&ver=2af6dbb1e89d69a2363895fac893188d'></script>
<script type="text/javascript">
jQuery(document).ready(function(){
jQuery('form#post').attr('enctype','multipart/form-data');
jQuery('form#post').attr('encoding','multipart/form-data');
});
</script>
<form enctype="multipart/form-data" method="post" action="http://xxx.com/wp-admin/media-upload.php?type=image&tab=type&post_id=1622" class="media-upload-form type-form validate" id="image-form">
<input type="submit" name="save" id="save" class="hidden" value="Save Changes" /><input type="hidden" name="post_id" id="post_id" value="1622" />
<input type="hidden" id="_wpnonce" name="_wpnonce" value="2460ab002a" /><input type="hidden" name="_wp_http_referer" value="/wp-admin/media-upload.php?post_id=1622&type=image&" />
<script type="text/javascript">
//<![CDATA[
var uploaderMode = 0;
jQuery(document).ready(function($){
uploaderMode = getUserSetting('uploader');
$('.upload-html-bypass a').click(function(){deleteUserSetting('uploader');uploaderMode=0;swfuploadPreLoad();return false;});
$('.upload-flash-bypass a').click(function(){setUserSetting('uploader', '1');uploaderMode=1;swfuploadPreLoad();return false;});
});
//]]>
</script>
<div id="media-upload-notice">
</div>
<div id="media-upload-error">
</div>
<script type="text/javascript">
var swfu;
SWFUpload.onload = function() {
var settings = {
button_text: '<span class="button">Select Files<\/span>',
button_text_style: '.button { text-align: center; font-weight: bold; font-family:"Lucida Grande",Verdana,Arial,"Bitstream Vera Sans",sans-serif; font-size: 11px; text-shadow: 0 1px 0 #FFFFFF; color:#464646; }',
button_height: "23",
button_width: "132",
button_text_top_padding: 3,
button_image_url: 'xxx.com/wp-includes/images/upload.png?ver=20100531',
button_placeholder_id: "flash-browse-button",
upload_url : "xxx.com/wp-admin/async-upload.php",
flash_url : "http://xxx.com/wp-includes/js/swfupload/swfupload.swf",
file_post_name: "async-upload",
file_types: "*.*",
post_params : {
'post_id' : '1622',
'auth_cookie' : 'admin|1301439526|5e5e63158e880597c782656a719f1738',
'logged_in_cookie' : 'admin|1301439526|e01206ec12b5cee4a605f9abff385cc0',
'_wpnonce' : '2460ab002a',
'type' : 'image',
'tab' : 'type',
'short' : '1' },
file_size_limit : "4194304b",
file_dialog_start_handler : fileDialogStart,
file_queued_handler : fileQueued,
upload_start_handler : uploadStart,
upload_progress_handler : uploadProgress,
upload_error_handler : uploadError,
upload_success_handler : uploadSuccess,
upload_complete_handler : uploadComplete,
file_queue_error_handler : fileQueueError,
file_dialog_complete_handler : fileDialogComplete,
swfupload_pre_load_handler: swfuploadPreLoad,
swfupload_load_failed_handler: swfuploadLoadFailed,
custom_settings : {
degraded_element_id : "html-upload-ui", // id of the element displayed when swfupload is unavailable
swfupload_element_id : "flash-upload-ui" // id of the element displayed when swfupload is available
},
debug: false
};
swfu = new SWFUpload(settings);
};
//]]>
</script>
<div id="flash-upload-ui" class="hide-if-no-js">
<div>
Choose files to upload <div id="flash-browse-button"></div>
<span><input id="cancel-upload" disabled="disabled" onclick="cancelUpload()" type="button" value="Cancel Upload" class="button" /></span>
</div>
<p class="media-upload-size">Maximum upload file size: 4MB</p>
</div>
<div id="html-upload-ui">
<p id="async-upload-wrap">
<label class="screen-reader-text" for="async-upload">Upload</label>
<input type="file" name="async-upload" id="async-upload" />
<input type="submit" name="html-upload" id="html-upload" class="button" value="Upload" /> <a href="#" onclick="try{top.tb_remove();}catch(e){}; return false;">Cancel</a>
</p>
<div class="clear"></div>
<p class="media-upload-size">Maximum upload file size: 4MB</p>
</div>
<script type="text/javascript">
//<![CDATA[
jQuery(function($){
var preloaded = $(".media-item.preloaded");
if ( preloaded.length > 0 ) {
preloaded.each(function(){prepareMediaItem({id:this.id.replace(/[^0-9]/g, '')},'');});
}
updateMediaForm();
});
//]]>
</script>
<div id="media-items">
</div>
<p class="savebutton ml-submit">
<input type="submit" name="save" id="save" class="button" value="Save all changes" /></p>
</form>
<script type='text/javascript'>
/* <![CDATA[ */
var commonL10n = {
warnDelete: "You are about to permanently delete the selected items.\n \'Cancel\' to stop, \'OK\' to delete."
};
try{convertEntities(commonL10n);}catch(e){};
var setPostThumbnailL10n = {
setThumbnail: "Use as featured image",
saving: "Saving...",
error: "Could not set that as the thumbnail image. Try a different attachment.",
done: "Done"
};
try{convertEntities(setPostThumbnailL10n);}catch(e){};
/* ]]> */
</script>
<script type='text/javascript' src='http://xxx.com/wp-admin/load-scripts.php?c=1&load=hoverIntent,common,jquery-color,imgareaselect,image-edit,set-post-thumbnail&ver=6356b0bc2df931d1f1d78f0d91f6539d'></script>
<script type="text/javascript">if(typeof wpOnload=='function')wpOnload();</script>
<?php
}
Comme Apple l’a peut-être dit " Il existe un plugin pour cela " :)