Cómo implementar un cargador de imágenes básico en la página de perfil de usuario
Estoy intentando agregar un cargador de imágenes a las páginas de perfil de usuario. Tengo uno funcionando en una página de registro básica, pero el mismo código ligeramente modificado no funciona cuando lo agrego a functions.php. El campo se carga y WordPress permite la actualización, pero en la vista de perfil no se muestra ninguna imagen. Para obtener y almacenar la imagen uso:
/********************************************************************
Código para campo de carga de imagen de perfil
*********************************************************************/
require_once( STYLESHEETPATH . '/img_upload_resize_crop.php' );
add_action( 'init', 'custom_img_uploader' );
function custom_img_uploader () {
if (isset($_FILES['profilePicture']['name'])!= "" ) {
if ( $_FILES['profilePicture']['name']!="" ) {
$your_image = new _image;
$upload_dir = wp_upload_dir();
//Para cargar
$your_image->uploadTo = $upload_dir['basedir'].'/';
$upload = $your_image->upload($_FILES['profilePicture']);
//Para redimensionar
$your_image->newPath = $upload_dir['basedir'].'/thumbs/';
$your_image->newWidth = 150;
$your_image->newHeight = 200;
$resized = $your_image->resize();
$profilePicture=str_replace($upload_dir['basedir'].'/thumbs/', "", $resized );
unlink($upload);
}else{
$profilePicture='';
}
}
}
Para mostrar el campo en HTML tengo:
<!-- inicio del campo de carga de imagen -->
<tr>
<th><label for="profilePicture"><?php _e("Imagen de perfil"); ?></label></th>
<td>
<input type="file" name="profilePicture" id="profilePicture" style="float:left;" />
</td>
</tr>
Y para guardarlo uso esto:
update_user_meta( $user_id, 'userphoto_thumb_height', 59);
update_user_meta( $user_id, 'userphoto_thumb_width', 80 );
update_user_meta( $user_id, 'userphoto_thumb_file', $profilePicture );
¿Alguien puede ver por qué en la Vista de Perfil este código:
<?php if(get_the_author_meta( 'userphoto_thumb_file', $getId )!=""){?>
<img src="<?=$uploads['baseurl'];?>/thumbs/<?=get_the_author_meta( 'userphoto_thumb_file', $getId );?>" />
no carga una imagen almacenada?
Actualización I y II
Depuración básica
Actualización III
Después de agregar un isset()
avancé un poco:
[28-Mar-2012 07:14:46] PHP Notice: Variable indefinida: profilePicture in /home/user/public_html/wp-content/themes/theme-name/functions.php on line 346
En esa línea tengo update_user_meta( $user_id, 'userphoto_thumb_file', $profilePicture );
Parece que aunque tengo definida la variable Era solo un aviso y no parece relevante ni causar el problema de carga.profilePicture
, no se captura
Actualización IV
Envolví el código del cargador de imágenes en una función y lo agregué como una acción. Ver código con actualizaciones arriba. Todavía tengo una variable indefinida profilePicture
y tampoco se carga la imagen. El archivo functions.php completo está aquí http://pastebin.com/YGYz3Qnv
Actualización V
Me di cuenta de que no tengo una buena opción $_POST para profilePicture. Mirando el plugin mencionado por @brasofilo en http://plugins.svn.wordpress.org/user-avatar/trunk/user-avatar.php veo este código que podría usar, pero necesito ajustarlo mucho:
<form enctype="multipart/form-data" id="uploadForm" method="POST" action="<?php echo admin_url('admin-ajax.php'); ?>?action=user_avatar_add_photo&step=2&uid=<?php echo $uid; ?>" >
<label for="upload"><?php _e('Selecciona una imagen de tu computadora:','user-avatar'); ?></label><br /><input type="file" id="upload" name="uploadedfile" />
<input type="hidden" name="action" value="save" />
<?php wp_nonce_field('user-avatar') ?>
<p class="submit"><input type="submit" value="<?php esc_attr_e('Subir'); ?>" /></p>
</form>
Me pregunto si se necesita un formulario ya que no fue necesario para los otros campos de texto y cómo debo agregar $user_id
y ajustar update_user_meta
Actualización VI
Hice $profilePicture
global como recomendó un colaborador
Actualización VII
Estoy considerando usar la opción de Unrelated Media aquí. Pero como aún me tomará bastante tiempo integrar esto a mi functions.php actual, mantendré este hilo abierto hasta que lo haya logrado.

Revisa este plugin: User Avatar. Puedes usarlo o revisar sus funciones para adaptar las tuyas.

$profilePicture
se define fuera del alcance del código de guardado y nunca se declara ni se usa en el ámbito global.
Como resultado, tan pronto como la función de carga devuelve, la variable es recolectada como basura o estás tratando con una variable completamente diferente que comparte el mismo nombre.
Yo la declararía como global y agregaría más validación, como verificar si la variable está vacía antes de intentar usarla.

He actualizado el código -ver http://pastebin.com/YGYz3Qnv - y he hecho $profilePicture
global. ¡Gracias por el aviso! ¿Cómo puedo añadir más validación para comprobar si la variable está vacía? Ya he añadido isset()
... Y creo que todavía tengo un problema con $_POST también..

Prefiero usar if(empty()){ ya que también comprueba arrays vacíos, también puede que necesites hacer que el formulario use codificación multipart, aunque no recuerdo un sitio/respuesta que lo explique, así que publicaré pronto, pero consulta el plugin User Photo

Mirando el pastebin, no has hecho la variable global en absoluto, viendo la función relevante se ve idéntica, no hay global $profilePicture; en la función custom_img_uploader

Al ver todo tu código, no estoy seguro de por qué el proceso de carga está en una función separada en un hook init, ¿no sería mejor justo encima de las llamadas a update_usermeta?

Creo que sería mejor usar algo como el plugin UserPhoto en su lugar, funciona y tiene más características y opciones

Revisando http://wordpress.org/extend/plugins/user-photo/ ahora. Podría ser una buena idea. Solo necesito ajustar mi formulario de registro para almacenar la imagen de la misma manera y que las actualizaciones funcionen después. Para cargar la imagen en la vista de perfil no debería ser muy difícil siempre que pueda obtener el ID de usuario para que se cargue la foto de perfil correcta. Como todos estos factores cuentan, esperaba poder quedarme con el código que tengo para solo necesitar cambiar functions.php, no el formulario de registro y la vista de perfil también. No soy un completo novato en PHP, pero aún tengo muuucho que aprender

Pregunté al desarrollador de UserPhoto si ya había una implementación del formulario de registro aquí: http://wordpress.org/support/topic/plugin-user-photo-registration-usage?replies=1#post-2721403. Quién sabe...

Cambiaría de usar los datos FILES y post, para en su lugar confiar en las APIs de WordPress para tus archivos. De esta manera, en lugar de una ruta de archivo, obtienes el ID de un tipo de post adjunto, y puedes reducir todo tu código de carga a un puñado de llamadas a funciones que hacen todo automáticamente. Luego, cuando quieras mostrar tu 'avatar', solo usa las funciones de imagen adjunta que se usan en todas partes

continuemos esta discusión en el chat

Bueno, gracias a todos por sus sugerencias. Al final opté por la integración del Cargador de Medios de Woothemes como pueden ver aquí en Github: https://github.com/devinsays/options-framework-plugin/blob/master/options-medialibrary-uploader.php Está integrado en un framework de temas que estoy integrando en mi propio tema, así que de esta manera mato dos pájaros de un tiro.
