Las imágenes y otros archivos multimedia son una parte importante de cualquier sitio web de WordPress. Para usarlos de manera efectiva, ayuda tener una idea firme de cómo funciona la biblioteca multimedia de WordPress.
Esta función de WordPress te permite almacenar y administrar tus imágenes y otros medios a lo largo del tiempo. Con un poco de conocimiento interno y algunos trucos simples, hay mucho que puedes hacer para mejorar tu sitio a través de tu biblioteca multimedia.
En esta completa guía, te guiaremos a través de todo lo que hay que saber sobre la biblioteca multimedia de WordPress, incluyendo cómo importar y descargar contenidos. También cubriremos la edición de imágenes, la administración de archivos a largo plazo y cuatro trucos para incorporar funcionalidad avanzada.
¡Empecemos!
Una Introducción a la biblioteca multimedia de WordPress
En el fondo, tu biblioteca multimedia de WordPress es exactamente lo que su nombre implica: un catálogo de todos los archivos de medios que has subido a tu sitio:
WordPress es capaz de albergar una variedad de tipos de medios, incluyendo:
- Imágenes (. jpg, . jpeg, . png, . gif, y . ico).
- Archivos de audio (.mp3, .m4a, . ogg, y . wav).
- Videos (.mp4, .m4v, . mov, . wmv, . avi, . mpg, . ogv, .3gp, y .3g2).
- PDFs.
- Documentos de Word.
- Hojas de cálculo de Excel.
- Presentaciones en PowerPoint.
- Documentos de Adobe Photoshop.
También tiene algunas capacidades limitadas de edición de fotos, por lo que puede hacer los ajustes necesarios directamente desde el panel de control.
Lamentablemente, WordPress no soporta imágenes webp por defecto.
Para acceder a tu biblioteca multimedia, simplemente haz clic en Medios en tu barra lateral de administración en cualquier momento:
Hay algunas opciones básicas disponibles aquí.
En primer lugar, puedes determinar si deseas ver tus archivos en una lista o en una vista de cuadrícula haciendo clic en los iconos correspondientes:
También puedes filtrar tus archivos mediante los menús desplegables:
El primer menú te permite ver tus medios por tipo, mientras que el segundo filtrará los contenidos de tu biblioteca por las fechas en que fueron subidos.
También puedes usar la barra de búsqueda para buscar archivos específicos por nombre:
Por último, también hay un botón de selección de volumen. Esta función te permite borrar varios archivos de tu instalación de WordPress de una sola vez:
Esto cubre toda la funcionalidad nativa disponible en la pantalla de la biblioteca multimedia de WordPress.
Como verás más tarde, hay muchas modificaciones que puedes hacer para mejorarlo. Primero, sin embargo, necesitamos discutir cómo agregar archivos a WordPress.
¿Cómo añadir archivos a tu biblioteca multimedia de WordPress?
Hay varias maneras diferentes de añadir archivos (por ejemplo, el favicon de tu sitio) a tu biblioteca multimedia de WordPress. La primera es navegar a Medios > Agregar Nuevo:
Aquí puedes subir archivos que se guardan en tu ordenador o en otro dispositivo:
También puedes añadir medios directamente desde el editor de WordPress. En el Block Editor, comienza agregando el bloque correspondiente al tipo de medio que quieres incorporar:
En el marcador de posición resultante, selecciona Subir y elige un archivo de tu ordenador:
Alternativamente, puede simplemente arrastrar y soltar el archivo desde tu escritorio en el bloque correspondiente.
En el Classic Editor, tendrás que hacer clic en el botón Agregar medios:
A continuación, navega hasta la pestaña de Subir y selecciona un archivo de tu ordenador:
También puedes arrastrar y soltar archivos desde tu escritorio directamente al editor en cualquier momento.
En algunos casos, puedes encontrar que necesitas subir manualmente los archivos de medios a tu sitio de WordPress vía FTP. Puedes hacer esto usando un cliente como FileZilla.
Una vez que te conectes a tu servidor, navega a wp-content > uploads:
Sube los archivos a este directorio para añadirlos a tu biblioteca multimedia.
Descarga de contenidos de la biblioteca multimedia de WordPress
En algunas circunstancias, es posible que necesites descargar archivos de tu biblioteca multimedia a tu computadora. WordPress te permite hacer esto de forma nativa al navegar a Herramientas > Exportar:
Luego selecciona la opción Medios. Si sólo necesitas los archivos que se subieron en un plazo determinado, puedes utilizar los menús desplegables para especificar tu solicitud:
Por último, haz clic en el botón Descargar archivo de exportación. Esto descargará los archivos de medios relevantes a tu computadora.
¿Cómo editar imágenes en la biblioteca multimedia de WordPress?
Como mencionamos antes, WordPress tiene algunas características de edición de imágenes nativas. Para acceder a ellas, navega a tu biblioteca multimedia de WordPress y selecciona el archivo que quieres editar. Luego, haz clic en el botón Editar imagen:
Esto abrirá el editor de imágenes:
Hay cinco ediciones básicas que puedes hacer:
El recorte te permite cortar secciones de la imagen:
Girando la imagen la girará 90 grados en sentido contrario a las agujas del reloj o en el sentido de las agujas del reloj:
Dar la vuelta a la imagen la reflejará vertical u horizontalmente:
Los otros tres ajustes están en la barra lateral. El primero permite cambiar el tamaño de la imagen al escalarla. Simplemente introduce su altura o anchura deseada, y el otro campo se rellenará automáticamente. Luego haz clic en el botón Escala:
Es importante señalar que el cambio de tamaño de las imágenes en WordPress a veces puede afectar negativamente a su calidad.
Además, sólo puedes tomar imágenes grandes y reducirlas. ¡No puedes escalar las imágenes a un tamaño mayor!
Para recortar tu imagen de manera que tenga una relación de aspecto o dimensiones específicas, puedes utilizar los campos Relación de aspecto y Selección en Recorte de imagen:
Por último, si deseas conservar la miniatura de la imagen existente, puedes hacerlo mediante los Ajustes de la miniatura. Sólo tienes que seleccionar el botón de selección de la versión de tu imagen a la que quieras aplicar los cambios:
La edición de imágenes por defecto de WordPress es útil pero limitada. No reemplazará ningún software que puedas usar para modificaciones más extensas, especialmente si tienes un sitio de fotografía o un fotoblog.
Entendiendo los errores de la biblioteca de multimedia de WordPress
Lamentablemente, se producen errores en WordPress. Y la biblioteca multimedia de WordPress no es una excepción.
Un problema que suele aparecer es un «error HTTP» no especificado que puede aparecer cuando se sube un nuevo archivo desde el editor:
Normalmente, puedes esperar a que este error desaparezca e intentar subirlo de nuevo después de unos minutos. Si el error HTTP se repite, puede ser que tu sesión de WordPress haya expirado. Tendrás que iniciar la sesión de nuevo y volver a intentar la subida.
Otro problema al que se enfrentan algunos usuarios es que la biblioteca multimedia no se carga. Esto se debe a menudo a un conflicto con tus plugins y/o tema. Para solucionar este error, intenta desactivar todos tus plugins y cambiar a un tema predeterminado de WordPress.
Si tu biblioteca multimedia vuelve a cargarse correctamente, tendrás que solucionar el conflicto del plugin más adelante para resolver el problema de forma permanente.
A veces puedes encontrarte con el error «Upload: Failed to Write File to Disk» cuando comienzas a subir tus archivos a través de la biblioteca multimedia. Normalmente, este problema se produce cuando su directorio de subida está configurado como No escribible. Puede comprobar los permisos de su sistema de archivos a través de la herramienta Site Health de WordPress.
Gestión de la biblioteca multimedia a largo plazo
Hasta ahora, nos hemos centrado exclusivamente en la funcionalidad nativa de WordPress en lo que se refiere a la biblioteca multimedia. Sin embargo, a medida que uses esta función con el tiempo, es probable que te encuentres con algún problema que requiera ayuda de soluciones externas.
Por ejemplo, cuantos más archivos añadas, más desorganizada se volverá tu biblioteca multimedia de WordPress. Aparte de las opciones de búsqueda y filtrado discutidas al principio de este post, WordPress no proporciona mucha ayuda para tratar con volúmenes de medios no controlados..
Sin embargo, existen algunos plugins que permiten organizar los archivos multimedia en carpetas.
El plugin de carpetas WordPress Media Library Folders es la opción más popular:
Además de permitirte crear carpetas de archivos multimedia, este plugin también se integra con MaxGalleria para permitirte crear galerías de imágenes directamente desde la biblioteca multimedia:
La actualización a WordPress Media Library Folders Pro proporciona una integración adicional con el plugin NextGEN Gallery y Advanced Custom Fields. También permite crear categorías y etiquetas para organizar mejor los archivos.
Otra funcionalidad de la que carece WordPress es la capacidad de reemplazar archivos multimedia con nuevas versiones. Dado que estos tipos de archivos pueden ser bastante grandes, no querrás simplemente seguir agregando nuevos cada vez que necesites actualizar tu contenido.
Esto significa que después de subir un nuevo archivo, tendrás que localizar la versión antigua y eliminarla. Puedes ahorrarte algo de tiempo reemplazando directamente las imágenes antiguas con Enable Media Replace.
Con este plugin, también puedes reemplazar todos los enlaces que apuntan al archivo antiguo. Esto es útil para evitar medios rotos en todo tu sitio.
Real Media Library es otro administrador de carpetas y archivos que vale la pena revisar para que tu administración de archivos sea muy sencilla.
Gracias a ello, puedes encargarte de muchos archivos como fotos, vídeos y documentos directamente en WordPress. Es bueno saberlo: La biblioteca de Real Media está disponible en 12 idiomas. Si la versión gratuita no es suficiente para tus necesidades, también proporcionan una opción para la compra de la versión PRO con más características.
4 trucos de la biblioteca de multimedia de WordPress
La biblioteca multimedia de WordPress puede manejar la mayoría de los requisitos comunes de un administrador de sitio. Sin embargo, WordPress proporciona una serie de funciones y ganchos que permiten a los usuarios mejorar características específicas de la biblioteca multimedia, sin el uso de plugins de terceros. Sumerjámonos en estas funciones y ganchos con cuatro ejemplos prácticos.
1. Agregar metadatos personalizados a los tipos de publicaciones adjuntas
Cada vez que subes un archivo de medios, WordPress genera un tipo de publicación de archivos adjuntos.
Al igual que cualquier otro tipo de correo, los archivos adjuntos se registran en la tabla wp_posts, y sus respectivos metadatos se pueden encontrar en la tabla wp_postmeta de tu base de datos:
La tabla wp_posts almacena datos que incluyen post_content (descripción del archivo adjunto), post_excerpt (título del archivo adjunto), post_author, post_title, post_status y post_mime_type.
La tabla wp_postmeta almacena cualquier tipo de metadatos, como la URL del archivo adjunto, las dimensiones de la imagen y los tipos de mímica, y los metadatos del formato de archivo de imagen intercambiable (EXIF) y del Consejo Internacional de Telecomunicaciones de Prensa (IPTC).
Ocasionalmente puede ser necesario añadir metadatos personalizados a los archivos adjuntos, como el nombre del autor de un documento, una URL asociada o la ubicación donde se tomó la foto. Agregar metadatos a los archivos adjuntos es un poco diferente a agregar metadatos a los mensajes, y requiere de ganchos y funciones específicas.
Primero, tendrás que añadir todos los campos personalizados necesarios a la pantalla de edición de medios. Puedes realizar esta tarea filtrando los campos de adjuntos disponibles a través del filtro attachment_fields_to_edit en wp-admin/includes/media.php:
function media_hacks_attachment_field_to_edit( $form_fields, $post ){
// https://codex.wordpress.org/Function_Reference/wp_get_attachment_metadata
$media_author = get_post_meta( $post->ID, 'media_author', true );
$form_fields['media_author'] = array(
'value' => $media_author ? $media_author : '',
'label' => __( 'Author' )
);
return $form_fields;
}
add_filter( 'attachment_fields_to_edit', 'media_hacks_attachment_field_to_edit', 10, 2 );La función tiene dos argumentos: la matriz $form_fields de campos de forma y el objeto $post. Primero, get_post_meta recupera el valor existente de ‘media_author’, luego se agrega un elemento ‘media_author’ a la matriz $form_fields.
Finalmente, la llamada devuelve $form_fields (ver el código en Gist).
Esto mostrará un nuevo campo en la página Editar medios, al que puedes acceder seleccionando la imagen relevante de tu biblioteca multimedia y haciendo clic en el enlace Editar más detalles:
En la pantalla resultante, verás tu nuevo campo de metadatos personalizado en la parte inferior:
El siguiente paso es guardar la entrada del usuario. Puedes lograrlo enganchando una nueva función a la acción edit_attachment:
function media_hacks_edit_attachment( $attachment_id ){
if ( isset( $_REQUEST['attachments'][$attachment_id]['media_author'] ) ) {
$media_author = $_REQUEST['attachments'][$attachment_id]['media_author'];
update_post_meta( $attachment_id, 'media_author', $media_author );
}
}
add_action( 'edit_attachment', 'media_hacks_edit_attachment' );
Esta función mantiene un solo argumento: el $attachment_id del archivo multimedia actual. Primero, la función comprueba si se ha enviado un valor válido para el metacampo personalizado. Luego registra el valor gracias a la función update_post_meta (ver el código en Gist).
Ahora, puedes recuperar el valor ‘media_author’ gracias a la función get_post_meta:
$media_author = get_post_meta( $post->ID, 'media_author', true );Después de eso, puedes exhibirlo en cualquier lugar del frente.
2. Mostrar los metadatos EXIF e IPTC en la pantalla de edición de Medios
WordPress almacena automáticamente metadatos extendidos para tipos de mímica JPEG y TIFF. Ahora que sabes cómo añadir campos a la pantalla de edición de medios a través de media.php, puedes mostrar estos datos.
Para llevar a cabo esta tarea, hay que cambiar la primera función de devolución de llamada de la siguiente manera:
function media_hacks_attachment_fields_to_edit( $form_fields, $post ){
// get post mime type
$type = get_post_mime_type( $post->ID );
// get the attachment path
$attachment_path = get_attached_file( $post->ID );
// get image metadata
$metadata = wp_read_image_metadata( $attachment_path );
if( 'image/jpeg' == $type ){
if( $metadata ) {
$exif_data = array(
'aperture' => 'Aperture',
'camera' => 'Camera',
'created_timestamp' => 'Timestamp',
'focal_length' => 'Focal Length',
'iso' => 'ISO',
'shutter_speed' => 'Exposure Time',
'orientation' => 'Orientation' );
foreach ( $exif_data as $key => $value ) {
$exif = $metadata[$key];
$form_fields[$key] = array(
'value' => $exif ? $exif : '',
'label' => __( $value ),
'input' => 'html',
'html' => "ID][$exif]' value='" . $exif . "' />
);
}
}
}
return $form_fields;
}
add_filter( 'attachment_fields_to_edit', 'media_hacks_attachment_fields_to_edit', 10, 2 );Este recorte utiliza las siguientes funciones de WordPress:
- get_post_mime_type recupera el tipo de mime de un archivo adjunto basado en el ID.
- get_attached_file recupera la ruta del archivo adjunto basado en el ID.
- wp_read_image_metadata obtiene los metadatos EXIF o IPTC, si están disponibles.
Si el tipo de mime de la imagen es «image/jpeg», y si existen metadatos, entonces se declara una matriz de metadatos requeridos y se crea un campo de formulario para cada elemento de la matriz:
Los campos de forma de este ejemplo son un poco más complejos, ya que estamos estableciendo un valor para el elemento de forma ‘html’ (ver el código en Gist). No es necesario guardar los metadatos EXIF e IPCT, ya que WordPress los almacena automáticamente en la tabla wp_postmeta cuando se suben imágenes.
3. Mostrar metadatos extendidos en el frontend
Tener toda esta información para ti en la parte de atrás es útil. Sin embargo, si también deseas mostrar metadatos ampliados para tus archivos de medios en la parte delantera, tendrás que hacer un poco más de ajustes.
Para ello, puedes adjuntar esta información a la descripción del archivo adjunto utilizando un filtro the_content en wp-admin/includes/post.php, de esta manera:
function media_hacks_the_content( $content ){
global $post;
if( is_attachment() && 'image/jpeg' == get_post_mime_type( $post->ID ) ) {
$fields = wp_get_attachment_metadata( $post->ID );
$meta = $fields['image_meta'];
if( ! empty( $meta['camera'] ) ){
$custom_content = "
<ul>
<li>Camera: {$meta['camera']}</li>
<li>Created timestamp: {$meta['created_timestamp']}</li>
<li>Aperture: {$meta['aperture']}</li>
<li>Focal length: {$meta['focal_length']}</li>
<li>ISO: {$meta['iso']}</li>
<li>Shutter speed: {$meta['shutter_speed']}</li>
<li>Orientation: {$meta['orientation']}</li>
</ul>";
$content .= $custom_content;
}
}
return $content;
}
add_filter( 'the_content', 'media_hacks_the_content' );Aquí se llama la función wp_get_attachment_metadata. Si el tipo de mensaje actual es «attachment», y si el tipo de mímica actual es «image/jpeg», entonces se recuperan los metadatos disponibles de la imagen y se utilizan para construir una lista no ordenada de campos, que se adjunta al contenido del mensaje.
La función de devolución de llamada devuelve $contenido (ver este código en el Gist):
Arriba se puede ver el nuevo post de adjuntos con los metadatos adjuntos a la descripción.
4. Publicar un archivo de fotos
Fuera de la caja, WordPress no muestra archivos de anexos adjuntos. Esto sucede porque la opción has_archive del tipo de publicación de archivos adjuntos está configurada como false.
Además, mientras que el parámetro post_status por defecto del objeto $query está establecido en «publicar», el adjunto por defecto post_status está establecido en «heredar». Esto significa que ningún archivo adjunto será mostrado en los archivos a menos que establezcamos explícitamente la consulta post_status en «heredar» o «cualquiera» (ver Parámetros de Tipo de Consulta WP_Query para más información).
Dicho esto, para mostrar los archivos de imágenes, hay que definir dos funciones. La primera función filtra los argumentos de un tipo de mensaje especificado, y establece la propiedad has_archive del archivo adjunto en true:
function media_hacks_register_post_type_args( $args, $post_type ){
if( $post_type == 'attachment' ){
$args['has_archive'] = true;
}
return $args;
}
add_filter( 'register_post_type_args', 'media_hacks_register_post_type_args', 10, 2 );La segunda función establece valores personalizados para las variables de consulta post_mime_type y post_status:
function media_hacks_pre_get_posts( $query ){
if ( !is_admin() && $query->is_main_query() ) {
if( is_post_type_archive('attachment') ){
$query->set('post_mime_type', 'image/jpeg');
$query->set( 'post_status', 'inherit' );
}
}
}
add_action( 'pre_get_posts', 'media_hacks_pre_get_posts' );
La función se engancha al gancho de acción pre_get_posts, que se dispara después de que se haya creado la consulta, pero antes de que se ejecute. El objeto $query se pasa por referencia, no por valor, lo que significa que cualquier cambio en la instancia actual de $query afectará al objeto $query original.
Por esta razón, es importante verificar qué consulta va a cambiar (ver este código en la lista). Entonces, si ingresas a https://yourdomain.com/?post_type=attachment en tu navegador, deberías ver un archivo de imágenes JPEG:
El código completo de todos estos trucos están disponibles como un plugin en un Gist público, al que hemos enlazado a través de esta sección. Puedes descargarlo como un archivo . zip y subirlo a tu sitio de WordPress para implementar estos cuatro trucos, sin tener que editar tus archivos manualmente.
Resumen
Las imágenes, los vídeos, los archivos de audio y los documentos pueden ser muy valiosos para los usuarios de su sitio. La biblioteca multimedia de WordPress es esencial para subir, publicar e incluso modificar estos archivos con el fin de satisfacer las necesidades de tu contenido.
¿Tienes alguna otra pregunta sobre la biblioteca multimedia de WordPress? Háznoslo saber en la sección de comentarios de abajo!
Deja una respuesta