Le guide complet de la bibliothèque de médias WordPress (4 astuces pratiques de la bibliothèque incluses)

Les images et autres fichiers médias constituent une partie importante de tout site web WordPress. Pour les utiliser efficacement, il est utile de bien comprendre le fonctionnement de la bibliothèque de médias WordPress.

Cette fonction pratique de WordPress vous permet de stocker et de gérer vos images et autres médias au fil du temps. Avec quelques connaissances d’initié et quelques astuces simples, vous pouvez faire beaucoup pour améliorer votre site via votre bibliothèque de médias.

Dans ce guide complet, nous vous expliquerons tout ce qu’il y a à savoir sur la bibliothèque de médias WordPress, y compris comment importer et téléverser du contenu. Nous aborderons également la modification d’images, la gestion de fichiers à long terme et quatre astuces pour intégrer des fonctionnalités avancées.

Commençons !

Une introduction à la bibliothèque de médias de WordPress

Au fond, votre bibliothèque de médias WordPress est exactement ce que son nom implique : un catalogue de tous les fichiers médias que vous avez téléversés sur votre site :

WordPress est capable d’héberger divers types de médias, notamment

• Images (.jpg, .jpeg, .png, .gif, et .ico).
• Fichiers audio (.mp3, .m4a, .ogg, et .wav).
• Vidéos (.mp4, .m4v, .mov, .wmv, .avi, .mpg, .ogv, .3gp, et .3g2).
• PDF.
• Documents Word.
• Feuilles de calcul Excel.
• Présentations PowerPoint.
• Documents Adobe Photoshop.

Il dispose également de capacités limitées de modification de photos, de sorte que vous pouvez effectuer les ajustements nécessaires directement depuis votre tableau de bord.

Malheureusement, WordPress ne prend pas encore en charge les images webp.

Pour accéder à votre bibliothèque de médias, il vous suffit de cliquer sur Médias dans votre colonne latérale d’administration à tout moment :

Quelques options de base sont disponibles ici.

Tout d’abord, vous pouvez déterminer si vous souhaitez voir vos dossiers dans une liste ou une grille en cliquant sur les icônes correspondantes :

Vous pouvez également filtrer vos fichiers à l’aide des menus déroulants :

Le premier menu vous permet de visualiser vos médias par type, tandis que le second filtrera les contenus de votre bibliothèque en fonction des dates auxquelles ils ont été mis en ligne.

Vous pouvez également utiliser la barre de recherche pour rechercher des fichiers spécifiques par nom :

Enfin, il y a aussi un bouton Sélection en masse. Cette fonction vous permet de supprimer plusieurs fichiers de votre installation WordPress en une seule fois :

Cela couvre toutes les fonctionnalités natives disponibles dans l’écran de la bibliothèque de médias de WordPress.

Comme vous le verrez plus tard, il y a de nombreuses modifications que vous pouvez apporter pour l’améliorer. Cependant, nous devons d’abord discuter de la manière d’ajouter des fichiers à WordPress.

Comment ajouter des fichiers dans votre bibliothèque de médias WordPress

Vous pouvez ajouter des fichiers (par exemple, le favicon de votre site.) dans votre bibliothèque de médias WordPress de différentes manières. La première consiste à vous rendre dans vers Médias > Ajouter :

Ici, vous pouvez téléverser des fichiers qui sont enregistrés sur votre ordinateur ou sur un autre appareil :

Vous pouvez également ajouter des médias directement à partir de l’éditeur WordPress. Dans l’éditeur de blocs, commencez par ajouter le bloc correspondant au type de média que vous voulez incorporer :

Dans la zone de recherche, sélectionnez Téléverser et choisissez un fichier sur votre ordinateur :

Vous pouvez aussi simplement glisser-déposer le fichier depuis votre ordinateur dans le bloc correspondant.

Dans l’éditeur classique, vous devez cliquer sur le bouton Ajouter un média :

Ensuite, rendez-vous dans l’onglet Téléverser et sélectionnez un fichier sur votre ordinateur :

Vous pouvez également à tout moment glisser-déposer des fichiers de votre ordinateur directement dans l’éditeur.

Dans certains cas, vous devrez peut-être téléverser manuellement des fichiers médias sur votre site WordPress via FTP. Vous pouvez le faire en utilisant un client tel que FileZilla.

Une fois connecté à votre serveur, rendez-vous dans wp-content > uploads :

Téléversez des fichiers dans ce répertoire pour les ajouter à votre bibliothèque de médias.

Téléchargement de contenu depuis la bibliothèque de médias WordPress

Dans certaines circonstances, vous pouvez avoir besoin de télécharger des fichiers de votre bibliothèque de médias sur votre ordinateur. WordPress vous permet de le faire nativement en vous rendant dans Outils > Exporter :

Sélectionnez ensuite l’option Médias. Si vous n’avez besoin que des fichiers qui ont été téléversés dans un délai précis, vous pouvez utiliser les menus déroulants pour préciser votre demande :

Enfin, cliquez sur le bouton Télécharger le fichier d’exportation. Cela permettra de télécharger les fichiers médias pertinents sur votre ordinateur.

Comment modifier les images dans la bibliothèque de médias WordPress

Comme nous l’avons déjà mentionné, WordPress dispose nativement de quelques fonctions de modification d’images en natif. Pour y accéder, rendez-vous dans votre bibliothèque de médias WordPress et sélectionnez le fichier que vous souhaitez modifier. Ensuite, cliquez sur le bouton Modifier l’image :

Cela ouvrira l’éditeur d’image :

Vous pouvez effectuer cinq modifications basiques :

Le recadrage vous permet de couper des parties de l’image :

En tournant l’image, on peut la faire pivoter de 90 degrés dans le sens inverse des aiguilles d’une montre ou dans le sens des aiguilles d’une montre :

En retournant l’image, on peut la réfléchir soit verticalement, soit horizontalement :

Les trois autres réglages se trouvent dans la colonne latérale. Le premier vous permet de modifier la taille de l’image en la mettant à l’échelle. Il vous suffit de saisir la hauteur ou la largeur souhaitée, et l’autre champ se remplit automatiquement. Cliquez ensuite sur le bouton Redimensionner :

Il est important de noter que le redimensionnement des images dans WordPress peut parfois affecter négativement leur qualité.

De plus, vous ne pouvez prendre que des images de grande taille et les réduire. Vous ne pouvez pas mettre les redimensionner pour les agrandir !

Pour recadrer votre image afin qu’elle ait un rapport d’aspect ou des dimensions spécifiques, vous pouvez utiliser les champs Proportion de taille et Sélection sous Recadrage de l’image :

Enfin, si vous souhaitez préserver la miniature existante de l’image, vous pouvez le faire en utilisant les réglages de la miniature. Il vous suffit de sélectionner le bouton radio correspondant à la version de l’image à laquelle vous souhaitez appliquer les modifications :

La modification d’images par défaut de WordPress est utile mais limitée. Cela ne remplacera pas les logiciels que vous pourriez utiliser pour des modifications plus importantes, surtout si vous gérez un site ou un blog de photographie.

Comprendre les erreurs de la bibliothèque de médias WordPress

Malheureusement, des erreurs WordPress se produisent. Et la médiathèque de WordPress ne fait pas exception à la règle.

Un problème qui apparaît fréquemment est une « erreur HTTP » non spécifiée qui peut apparaître lorsque vous téléchargez un nouveau fichier depuis l’éditeur :

En général, vous pouvez simplement attendre que cette erreur disparaisse et réessayer de télécharger après quelques minutes. Si l’erreur HTTP se reproduit, il se peut que votre session WordPress ait expiré. Vous devrez alors vous reconnecter et réessayer de télécharger.

Un autre problème auquel certains utilisateurs sont confrontés est l’impossibilité de charger la médiathèque. Cela est souvent dû à un conflit avec vos plugins et/ou votre thème. Pour résoudre cette erreur, essayez de désactiver tous vos plugins et de passer à un thème par défaut de WordPress.

Si votre médiathèque se charge à nouveau correctement, vous devrez résoudre le conflit de plugin de manière plus approfondie afin de résoudre le problème de manière permanente.

Parfois, vous pouvez rencontrer l’erreur « Upload: Failed to Write File to Disk » lorsque vous commencez à téléverser vos fichiers via la médiathèque. En général, ce problème survient lorsque votre répertoire de téléversement est réglé sur Non inscriptible. Vous pouvez vérifier les permissions de votre système de fichiers via l’outil de santé du site de WordPress.

 

Gestion à long terme de la médiathèque

Jusqu’à présent, nous nous sommes concentrés exclusivement sur les fonctionnalités natives de WordPress en ce qui concerne la médiathèque. Cependant, au fur et à mesure que vous utiliserez cette fonctionnalité, vous rencontrerez probablement des problèmes qui nécessiteront l’aide de solutions externes.

Par exemple, plus vous ajoutez de fichiers, plus votre médiathèque WordPress sera désorganisée. Hormis les options de recherche et de filtrage dont nous avons parlé au début de ce billet, WordPress ne fournit pas beaucoup d’aide pour gérer les volumes de médias indisciplinés.

Il existe cependant quelques plugins qui vous permettent de classer vos fichiers multimédia dans des dossiers.

Le plugin WordPress Media Library Folders est l’option la plus populaire :

En plus de vous permettre de créer des dossiers de fichiers média, ce plugin s’intègre également à MaxGalleria pour vous permettre de créer des galeries d’images directement à partir de la médiathèque :

La mise à niveau vers WordPress Media Library Folders Pro offre une intégration supplémentaire avec le plugin NextGEN Gallery et les champs personnalisés avancés. Il vous permet également de créer des catégories et des balises pour mieux organiser vos fichiers.

Une autre fonctionnalité qui manque à WordPress est la possibilité de remplacer les fichiers médias par de nouvelles versions. Comme ces types de fichiers peuvent être assez volumineux, vous ne voulez pas simplement en ajouter de nouveaux chaque fois que vous devez mettre à jour votre contenu.

Cela signifie qu’après avoir téléchargé un nouveau fichier, vous devrez localiser l’ancienne version et la supprimer. Vous pouvez gagner du temps en remplaçant directement les anciennes images par Enable Media Replace.

Avec ce plugin, vous pouvez également remplacer tous les liens pointant vers l’ancien fichier. Ceci est utile pour éviter les supports cassés sur votre site.

Real Media Library est un autre gestionnaire de dossiers et de fichiers qui vaut la peine d’être vérifié pour faire de votre gestion de fichiers un jeu d’enfant.

Grâce à elle, vous êtes en mesure de prendre soin de beaucoup de fichiers tels que des images, des vidéos et des documents directement dans WordPress. Chose agréable à savoir : Real Media Library est disponible en 12 langues. Si la version gratuite n’est pas suffisante pour vos besoins, ils fournissent également un achat de la version PRO avec plus de fonctionnalités.

4 Hacks pratiques de la bibliothèque de médias WordPress

La médiathèque WordPress peut prendre en charge la plupart des exigences courantes d’un administrateur de site. Cependant, WordPress offre un certain nombre de fonctions et de raccourcis qui permettent aux utilisateurs d’améliorer des caractéristiques spécifiques de la médiathèque, sans avoir recours à des plugins tiers. Plongeons dans ces fonctions et accroches à l’aide de quatre exemples pratiques.

1. Ajout de métadonnées personnalisées aux types de messages de pièces jointes

Chaque fois que vous téléchargez un fichier média, WordPress génère un message de type pièce jointe.

Comme tout autre type de message, les pièces jointes sont enregistrées dans la table wp_posts, et leurs métadonnées respectives peuvent être trouvées dans la table wp_postmeta de votre base de données :

La table wp_posts stocke des données qui comprennent post_content (description de la pièce jointe), post_excerpt (légende de la pièce jointe), post_author, post_title, post_status et post_mime_type.

La table wp_postmeta stocke tout type de métadonnées, telles que l’URL du fichier joint, les dimensions de l’image et les types de mime, ainsi que les métadonnées du format EXIF (Exchangeable Image File Format) et de l’IPTC (International Press Telecommunications Council).

Vous pouvez occasionnellement avoir besoin d’ajouter des métadonnées personnalisées aux pièces jointes, telles que le nom de l’auteur d’un document, une URL associée ou l’endroit où une photo a été prise. L’ajout de méta-champs aux pièces jointes est un peu différent de l’ajout de méta-champs aux messages, et nécessite des accroches et des fonctions spécifiques.

Tout d’abord, vous devez ajouter tous les champs personnalisés nécessaires à l’écran Modifier le média. Vous pouvez accomplir cette tâche en filtrant les champs de pièces jointes disponibles grâce au filtre attachment_fields_to_edit dans 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 fonction a deux arguments : le tableau $form_fields des champs de formulaire et l’objet $post. Tout d’abord, get_post_meta récupère la valeur « media_author » existante, puis un élément « media_author » est ajouté au tableau $form_fields.

Enfin, le callback renvoie $form_fields (voir le code sur Gist).

Un nouveau champ s’affichera alors sur la page Modifier le média, auquel vous pouvez accéder en sélectionnant l’image correspondante dans votre médiathèque et en cliquant sur le lien Modifier plus de détails :

Dans l’écran qui s’affiche, vous verrez votre nouveau champ de métadonnées personnalisé en bas :

L’étape suivante consiste à enregistrer les données saisies par l’utilisateur. Vous pouvez y parvenir en associant une nouvelle fonction à l’action 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' );

Cette fonction ne conserve qu’un seul argument : le $attachment_id du fichier média actuel. Tout d’abord, la fonction vérifie si une valeur valide pour le champ méta personnalisé a été envoyée. Ensuite, elle enregistre la valeur grâce à la fonction update_post_meta (voir le code sur Gist).

Maintenant, vous pouvez récupérer la valeur « media_author » grâce à la fonction get_post_meta :

$media_author = get_post_meta( $post->ID, 'media_author', true );

Après cela, vous pouvez l’afficher n’importe où dans le frontend.

2. Afficher les métadonnées EXIF et IPTC dans l’écran “Modifier le Media”

WordPress stocke automatiquement des métadonnées étendues pour les types de mime JPEG et TIFF. Maintenant que vous savez comment ajouter des champs à l’écran Modifier le média via media.php, vous pouvez afficher ces données.

Pour accomplir cette tâche, vous devez modifier la première fonction de rappel comme suit :

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 );

Cet extrait utilise les fonctions suivantes de WordPress :

• get_post_mime_type récupère le type mime d’une pièce jointe sur la base de l’ID.
• get_attached_file récupère le chemin d’accès au fichier joint en fonction de l’ID.
• wp_read_image_metadata obtient les métadonnées EXIF ou IPTC, si elles sont disponibles.

Si le type d’image mime est « image/jpeg », et si des métadonnées existent, alors un tableau de métadonnées requises est déclaré, et un champ de formulaire est créé pour chaque élément du tableau :

Les champs de formulaire de cet exemple sont un peu plus complexes, car nous définissons une valeur pour l’élément de formulaire « html » (voir le code sur Gist). Il n’est pas nécessaire d’enregistrer les métadonnées EXIF et IPCT, car WordPress les stocke automatiquement dans le tableau wp_postmeta lors du téléchargement des images.

3. Afficher les métadonnées étendues sur le frontend

Il est utile de disposer de toutes ces informations en fin de parcours. Toutefois, si vous souhaitez également afficher des métadonnées étendues pour vos fichiers multimédia en amont, vous devrez faire quelques retouches.

Pour ce faire, vous pouvez ajouter ces informations à la description de la pièce jointe en utilisant un filtre the_content dans wp-admin/includes/post.php, comme ceci :

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' );

Ici, la fonction wp_get_attachment_metadata est appelée. Si le type de message courant est « attachment », et si le type de mime courant est « image/jpeg », les métadonnées d’image disponibles sont alors récupérées et utilisées pour construire une liste non ordonnée de champs, qui est annexée au contenu du message.

La fonction de rappel renvoie $content (voir ce code sur Gist) :

Ci-dessus, vous pouvez voir le nouveau message de pièce jointe avec les métadonnées annexées à la description.

4. Publier une archive de photos

WordPress n’affiche pas les archives des pièces jointes. Cela se produit parce que l’option has_archive du type de message de pièce jointe est définie sur false.

De plus, alors que le paramètre post_status par défaut de l’objet $query est défini sur « publish », la pièce jointe post_status par défaut est définie sur « inherit ». Cela signifie qu’aucune pièce jointe ne sera affichée dans les archives à moins que nous ne définissions explicitement la requête post_status sur « inherit » ou « any » (voir WP_Query Type Parameters pour plus d’informations).

Cela dit, pour montrer des archives d’images, il faut définir deux fonctions. La première fonction filtre les arguments d’un type de message spécifié, et définit la propriété has_archive de la pièce jointe à 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 deuxième fonction définit des valeurs personnalisées pour les variables d’interrogation post_mime_type et 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 fonction est reliée au hook d’action pre_get_posts, qui est lancé après la création de la requête, mais avant son exécution. L’objet $query est transmis par référence, et non par valeur, ce qui signifie que toute modification de l’instance actuelle de $query affectera l’objet $query original.

C’est pourquoi il est important de vérifier quelle requête vous allez changer (voir ce code sur Gist). Ensuite, si vous entrez https://yourdomain.com/?post_type=attachment dans votre navigateur, vous devriez voir une archive d’images JPEG :

Le code complet de tous ces hacks est disponible sous forme de plugin dans un Gist public, auquel nous avons renvoyé par cette section. Vous pouvez le télécharger sous forme de fichier .zip et l’envoyer sur votre site WordPress pour mettre en œuvre ces quatre piratages, sans avoir à modifier vos fichiers manuellement.

Résumé

Les images, vidéos, fichiers audio et documents peuvent être extrêmement précieux pour les utilisateurs de votre site. La médiathèque WordPress est essentielle pour télécharger, publier et même modifier ces fichiers afin de répondre aux besoins de votre contenu.

Vous avez d’autres questions sur la médiathèque WordPress ? Faites-le nous savoir dans la section commentaires ci-dessous !