Nos lecteurs nous demandent souvent s'il est possible d'afficher des icônes de fichiers joints dans WordPress. L'ajout d'icônes de fichiers aide les utilisateurs à identifier le type de fichier qu'ils téléchargent d'un coup d'œil, ce qui est idéal pour les aider à mieux comprendre votre contenu.
J'ai testé différentes méthodes pour ajouter des icônes de fichiers, et elles font une différence notable dans l'expérience utilisateur. Les visiteurs peuvent repérer instantanément s'ils téléchargent un fichier PDF, un document Word ou un fichier ZIP.
Dans ce guide, nous vous montrerons comment ajouter facilement des icônes de fichiers joints dans WordPress. Avec nos étapes, vous pouvez afficher des icônes de fichiers qui correspondent au type de fichiers sur votre site.
Réponse rapide : Comment ajouter des icônes de fichiers joints dans WordPress
Vous pouvez ajouter des icônes de fichiers joints dans WordPress à l'aide d'un plugin comme MimeTypes Link Icons (méthode la plus simple) ou en ajoutant manuellement des polices d'icônes avec Font Awesome. Les deux méthodes affichent des indicateurs visuels à côté des liens de téléchargement de fichiers, aidant les visiteurs à reconnaître instantanément les types de fichiers.
La méthode du plugin fonctionne automatiquement pour tous les types de fichiers pris en charge. La méthode Font Awesome vous donne plus de contrôle sur le style et la personnalisation des icônes.
Que sont les icônes de fichiers joints ?
Les icônes de fichiers joints sont de petits indicateurs visuels (comme des symboles PDF, DOC ou ZIP) qui apparaissent à côté des liens de téléchargement. Ils aident les visiteurs à reconnaître instantanément le type de fichier qu'ils sont sur le point de télécharger sans avoir à lire l'extension du fichier.
Par défaut, WordPress vous permet de télécharger des images, de l'audio, de la vidéo et d'autres documents. Vous pouvez également activer d'autres types de fichiers à télécharger dans WordPress.
Lorsque vous téléchargez un fichier via le téléchargeur de médias et que vous l'ajoutez à un article ou à une page, WordPress intègre les formats pris en charge comme les images, l'audio et la vidéo. Cela signifie qu'il affiche automatiquement un aperçu ou un lecteur multimédia au lieu d'un simple lien.
Pour tous les autres fichiers, il ajoutera simplement un nom de fichier sous forme de texte brut et le liera à la page de téléchargement ou de pièce jointe.
Dans la capture d'écran ci-dessus, nous avons ajouté un fichier PDF et un fichier Docx. Cependant, il est difficile pour un utilisateur de deviner quel type de fichier il téléchargera.
Si vous téléchargez régulièrement différents types de fichiers, l'affichage d'une icône à côté du lien permet à vos utilisateurs de trouver plus facilement le type de fichier qu'ils recherchent.
C'est ce que nous allons vous montrer comment faire ensuite.
Quelle méthode devriez-vous utiliser ?
Avant de commencer les tutoriels, voici une comparaison rapide des deux méthodes afin que vous puissiez choisir celle qui convient à votre site :
| Fonctionnalité | Méthode 1 : Plugin | Méthode 2 : Font Awesome |
|---|---|---|
| Facilité d'utilisation | Très facile | Intermédiaire |
| Temps de configuration | Secondes | Manuel par article |
| Personnalisation | Limité | Élevé |
| Idéal pour | Débutants | Utilisateurs avancés |
- Méthode 1 : Ajouter des icônes de fichiers joints dans WordPress à l'aide d'un plugin
- Méthode 2 : Utiliser des polices d'icônes pour les fichiers joints dans WordPress
- Bonus : Vendez des fichiers numériques pour gagner de l'argent en ligne
- Foire aux questions sur les icônes de fichiers dans WordPress
- Ressources bonus
Je recommande la méthode 1 pour la plupart des utilisateurs car elle est plus rapide et fonctionne sur l'ensemble du site. Commençons par celle-ci.
Méthode 1 : Ajouter des icônes de fichiers joints dans WordPress à l'aide d'un plugin
La manière la plus simple d'ajouter des icônes de types de fichiers est d'utiliser un plugin WordPress comme MimeTypes Link Icons. C'est un plugin gratuit, très facile à utiliser, qui vous permet d'ajouter des icônes pour différents types de fichiers.
La première chose à faire est d'installer et d'activer le plugin MimeTypes Link Icons. Pour plus de détails, consultez notre guide étape par étape sur comment installer un plugin WordPress.
Après activation, vous devez visiter la page Paramètres » Icônes MimeType pour configurer les paramètres du plugin.
Le plugin vous permet de choisir la taille de l'icône, ainsi qu'entre les formats d'image PNG et GIF. Nous recommandons d'utiliser des icônes PNG car elles offrent une meilleure qualité pour les indicateurs de type de fichier.
Ensuite, vous devez choisir l'alignement de l'icône et les types de fichiers qui afficheront l'icône.
Après cela, vous pouvez faire défiler vers le bas et sélectionner les icônes à afficher sur votre site web. Par exemple, il existe des icônes pour des types de fichiers comme PDF, PPT, CSV, AVI, RPM, TXT, et plus encore.
J'ai testé ce plugin sur notre site de démonstration avec des fichiers PDF, DOCX et ZIP. Les icônes sont apparues automatiquement en quelques secondes après l'activation, sans aucune configuration supplémentaire nécessaire.
Ensuite, vous pouvez faire défiler vers le bas jusqu'à la section Paramètres avancés.
Ici, vous trouverez l'option pour afficher la taille du fichier à côté du lien de téléchargement. Elle est désactivée par défaut, car elle pourrait être gourmande en ressources.
Une fois que vous avez terminé, n'oubliez pas de cliquer sur le bouton « Enregistrer les modifications » pour sauvegarder vos paramètres.
Vous pouvez maintenant modifier un article ou une page et ajouter un lien de téléchargement de fichier à l'aide de l'outil de téléchargement de médias. Prévisualisez simplement votre article, et vous verrez l'icône du fichier à côté du lien de téléchargement.
Méthode 2 : Utiliser des polices d'icônes pour les fichiers joints dans WordPress
Dans cette méthode, nous utiliserons une police d'icônes pour afficher une icône à côté du lien du fichier joint. Cette méthode vous donne plus de contrôle sur le style des icônes et fonctionne bien si vous utilisez déjà Font Awesome sur votre site.
Font Awesome est une bibliothèque d'icônes populaire qui fournit des milliers d'icônes vectorielles évolutives. Ce sont des graphiques qui restent nets et clairs, quelle que soit la taille à laquelle vous les redimensionnez.
Cette méthode consiste à installer le plugin Font Awesome, puis à ajouter manuellement le code de l'icône à vos articles.
La première chose à faire est d'installer et d'activer le plugin Font Awesome. Si vous avez besoin d'aide, veuillez consulter notre guide sur comment installer un plugin WordPress.
Après l'activation, vous pouvez accéder à la page Paramètres » Font Awesome depuis votre tableau de bord WordPress. Ici, vous pouvez modifier les paramètres généraux du plugin, comme choisir s'il doit utiliser des icônes pro ou gratuites.
Ensuite, vous pouvez modifier un article ou une page où vous souhaitez ajouter un lien de pièce jointe.
Dans l'éditeur de contenu, vous ajouterez le code HTML de l'icône avant votre lien de téléchargement. Cela affichera l'icône à côté du nom du fichier.
Remarque : Chaque fois que vous ajoutez du code personnalisé ou des extraits HTML à votre site, il est conseillé de créer une sauvegarde au préalable. Pour des extraits plus complexes, nous recommandons d'utiliser le plugin WPCode pour une mise en œuvre sécurisée.
Pour trouver ce code HTML, vous pouvez visiter le site web de la bibliothèque d'icônes Font Awesome. Recherchez simplement une icône dans la barre de recherche, puis cliquez sur l'image.
Ensuite, vous verrez différentes variations de l'icône et son code HTML.
Allez-y et cliquez sur le code pour le copier.
Après cela, vous pouvez retourner dans l'éditeur de contenu WordPress de votre site et cliquer sur le signe « + » pour ajouter un bloc HTML personnalisé.
À partir de là, collez simplement le code de votre icône dans le bloc.
Une fois que vous avez terminé, allez-y et publiez ou mettez à jour votre page.
Vous pouvez maintenant visiter votre site web pour voir la nouvelle icône ajoutée pour le type de fichier de pièce jointe.
Bonus : Vendez des fichiers numériques pour gagner de l'argent en ligne
Maintenant que vous savez comment ajouter des icônes de types de fichiers joints, vous pouvez aller plus loin et vendre différents fichiers en tant que téléchargements numériques. Cela vous permet de gagner de l'argent en ligne ou d'encourager les utilisateurs à s'inscrire à votre newsletter en échange d'une ressource gratuite.
La meilleure façon de vendre des produits numériques est d'utiliser Easy Digital Downloads. C'est l'une des meilleures plateformes eCommerce pour WordPress, et elle est très facile à utiliser et à configurer.
Easy Digital Downloads s'intègre facilement avec différents services de paiement comme PayPal, Stripe, Apple Pay et Google Pay.
En plus de cela, vous pouvez simplement télécharger les fichiers numériques que vous souhaitez vendre et commencer à gagner de l'argent en ligne.
Le plugin vous permet d'ajouter des détails tels qu'un titre et une description, de définir le prix du téléchargement, de choisir une image de téléchargement, et plus encore.
Pour plus de détails, veuillez consulter notre guide sur comment vendre des téléchargements numériques dans WordPress.
Foire aux questions sur les icônes de fichiers dans WordPress
Les icônes de fichiers ralentissent-elles mon site ?
Non, les icônes de fichiers sont de très petits fichiers image qui ont un impact minimal sur la vitesse du site. Le plugin MimeTypes Link Icons utilise des fichiers PNG ou GIF légers, et les icônes Font Awesome sont basées sur des vecteurs, ce qui signifie qu'elles sont optimisées pour les performances.
Puis-je personnaliser les couleurs et les styles des icônes ?
Oui, si vous utilisez Font Awesome, vous pouvez personnaliser les couleurs, les tailles et les styles des icônes à l'aide de CSS (Cascading Style Sheets). C'est le code utilisé pour styliser votre site Web. La méthode du plugin (Méthode 1) utilise des conceptions d'icônes prédéfinies qui correspondent aux types de fichiers courants.
Les icônes de fichiers fonctionnent-elles sur les appareils mobiles ?
Oui, les icônes de fichiers s'affichent correctement sur les appareils mobiles. Les icônes sont réactives, ce qui signifie qu'elles s'ajustent automatiquement pour avoir un bon rendu sur différentes tailles d'écran.
Quels types de fichiers peuvent afficher des icônes ?
Le plugin MimeTypes Link Icons prend en charge de nombreux types de fichiers courants, notamment :
- PDF, DOC et DOCX
- XLS et XLSX
- PPT et PPTX
- ZIP, MP3 et AVI
Vous pouvez sélectionner exactement quels types de fichiers activer sur la page des paramètres du plugin.
Ressources bonus
Voici quelques ressources utiles supplémentaires qui pourraient vous aider à gérer votre site web et vos médias WordPress :
- Comment utiliser WordPress pour la gestion de documents ou de fichiers
- Comment trouver vos brouillons enregistrés dans WordPress (Guide pour débutants)
- Comment téléverser des fichiers PDF sur votre site WordPress
- Comment connecter plusieurs sites WordPress ensemble (3 méthodes)
Nous espérons que cet article vous a aidé à apprendre comment ajouter des icônes de fichiers joints dans WordPress. Vous voudrez peut-être aussi consulter notre guide sur comment intégrer des PDF, des feuilles de calcul et d'autres fichiers dans les articles de blog WordPress et notre sélection d'experts des meilleurs plugins de journal d'activité et de suivi WordPress.
Si vous avez aimé cet article, abonnez-vous à notre Chaîne YouTube pour des tutoriels vidéo WordPress. Vous pouvez également nous trouver sur Twitter et Facebook.
Mrteesurez
Ce tutoriel est utile ! L'ajout d'icônes de type de fichier améliore vraiment l'expérience utilisateur, permettant aux visiteurs d'identifier plus facilement les pièces jointes avant de les télécharger.
J'ai fait cela sur mon site, et cela a instantanément rendu mon contenu plus professionnel. Votre guide étape par étape rend le processus si simple. Je veux demander comment l'ajout d'icônes affecte le temps de chargement des pages de mon site ?
Support WPBeginner
Cela ne devrait pas avoir d'impact majeur sur la vitesse de votre site.
Admin
Mrteesurez
Merci pour votre réponse. J'ai posé la question car l'utilisation d'icônes nécessite souvent le téléchargement ou le chargement de bibliothèques de polices comme Font Awesome ou Google Fonts, ce qui peut affecter la vitesse d'un site Web. J'apprécie que vous me fassiez savoir que cela n'a pas d'impact majeur sur la vitesse de mon site.
Isha Singh
Je ne connais pas WordPress. Mais en parcourant votre article, il semble que je sache tout sur WordPress.
Fin
Vous recommandez sérieusement un plugin qui n'a pas été mis à jour depuis un an ?
Support WPBeginner
Oui, nous le sommes. Veuillez consulter notre article faut-il installer des plugins non testés avec votre version de WordPress pour en savoir plus sur ce sujet.
Admin