Skip to content

Tout pour WordPress, le développement web — et plus encore

🖼 Comment télécharger un SVG sur WordPress : 3 méthodes sécurisées

🖼 Comment télécharger un SVG sur WordPress : 3 méthodes sécurisées

Vous avez téléchargé une icône SVG sur votre site et WordPress refuse silencieusement de l’accepter. Cela vous semble familier? Par défaut, le moteur bloque les fichiers .svg pour des raisons de sécurité et toute tentative de téléverser un logo dans la médiathèque se solde par l’erreur «Désolé, ce type de fichier n’est pas autorisé.»

Erreur WordPress lors de la tentative de téléversement d'un fichier SVG via la médiathèque

Le problème ne vient ni d’une installation défectueuse ni des droits d’accès aux fichiers. WordPress exclut délibérément le SVG de sa liste blanche car la structure XML du fichier peut véhiculer du code malveillant. Mais vous n’avez pas à renoncer aux images vectorielles: voici trois méthodes sûres pour téléverser des SVG sans mettre votre site en danger.

💡 Aperçu rapide:

  • Comprendre ce qu’est le SVG et pourquoi WordPress le bloque
  • Choisir l’une des trois extensions sécurisées pour le téléversement
  • Configurer l’extension selon vos besoins en quelques minutes
  • Comparer les fonctionnalités et obtenir une recommandation finale

Qu’est-ce que le SVG et en quoi diffère-t-il du JPEG et du PNG

Le SVG (Scalable Vector Graphics) est un format vectoriel basé sur XML. Contrairement aux formats matriciels JPEG et PNG, composés de pixels, le SVG décrit les images de manière mathématique à l’aide de lignes, de courbes et de formes. Le résultat est une image qui reste nette sur un écran 4K comme sur une bannière publicitaire de la taille d’un mur.

Pour un propriétaire de site, cela signifie trois choses. Premièrement, votre logo et vos icônes sont parfaitement nets sur tous les appareils, du téléphone à l’écran de bureau. Deuxièmement, un fichier .svg pèse plusieurs fois moins lourd que son équivalent PNG: une icône type occupe 1 à 3 Ko au lieu de 15 à 30 Ko. Troisièmement, le SVG peut être animé via CSS et JavaScript sans bibliothèque tierce.

Mais il y a un inconvénient. La structure XML est lue par le navigateur comme du code et un attaquant peut y intégrer un script. C’est précisément la raison pour laquelle WordPress n’inclut pas le SVG dans la liste des formats autorisés par défaut. Lorsque vous essayez d’en téléverser un, vous voyez cette même erreur que sur la capture d’écran ci-dessus.

Sécurité du SVG: ce que vous devez savoir avant de téléverser

Un fichier .svg est un document texte contenant des balises telles que <svg>, <path> et <circle>. Le navigateur l’analyse presque comme du HTML. Si une balise <script> ou un gestionnaire onload est dissimulé dans le fichier, le navigateur exécutera ce code. On appelle cela du XSS stocké: un script malveillant est conservé sur le serveur et se déclenche à chaque fois qu’un visiteur ouvre la page.

En pratique, aucune attaque de masse via SVG sur WordPress n’a été enregistrée; la vulnérabilité est connue et les développeurs ont appris depuis longtemps à la combler. Les extensions SVG modernes font passer le fichier téléversé par un assainisseur: une bibliothèque qui supprime toutes les balises et tous les attributs dangereux, ne conservant que le graphisme «propre».

La règle est simple: ne téléversez jamais un SVG provenant d’une source non fiable. Si le fichier a été créé par votre designer ou téléchargé depuis un site d’icônes officiel, les risques sont minimes. Si le fichier provient d’un client inconnu par email, ouvrez-le d’abord dans un éditeur de texte et assurez-vous qu’il ne contient aucune balise <script> ni aucun attribut on*.

Voici trois extensions qui résolvent le problème du téléversement de SVG avec différents niveaux de contrôle et de paramétrage.

Résultats de recherche pour les extensions SVG dans l'annuaire WordPress

Méthode 1: SVG Support, le maximum de possibilités

Page de réglages de l'extension SVG Support avec options de sécurité et mode avancé

SVG Support est l’extension la plus populaire pour téléverser des images vectorielles sur WordPress. Plus d’un million d’installations actives, une note de 4,5 sur WordPress.org et des mises à jour régulières (la dernière en mai 2026) parlent d’elles-mêmes.

L’installation est standard: Extensions → Ajouter, tapez «SVG Support» dans la barre de recherche, cliquez sur Installer, puis sur Activer. Après l’activation, allez dans Réglages → SVG Support.

Le réglage principal que vous devez activer immédiatement est Restreindre aux administrateurs. Il empêche quiconque, hormis les administrateurs, de téléverser des SVG. Si vous êtes le seul à gérer le site, cette case protège contre le téléversement accidentel d’un fichier dangereux par un éditeur ou un spécialiste SEO.

Le Mode avancé active l’animation CSS et le rendu en ligne du SVG. Vous en avez besoin si vous prévoyez d’animer des icônes ou de changer leur couleur via les styles du thème. Sans cette case cochée, l’extension supprime automatiquement les attributs potentiellement dangereux et l’animation peut être cassée.

SVG Support sait également envelopper les fichiers téléversés dans une balise <img> avec les dimensions correctes; cela est important pour les Core Web Vitals car le navigateur réserve l’espace pour l’image avant son chargement et la page ne «saute» pas.

  • Avantages: contrôle d’accès fin, mode avancé pour les animations, dimensionnement automatique des images, mises à jour régulières
  • Inconvénients: paramètres disponibles uniquement dans un onglet séparé (pas d’intégration avec la médiathèque)
  • Prix: gratuit
  • Téléchargement: 🔗 SVG Support sur WordPress.org

Méthode 2: Safe SVG, le minimalisme signé 10up

Page d'installation de l'extension Safe SVG depuis le panneau WordPress

Safe SVG est développée par l’agence 10up, à qui Microsoft, Adobe et la Maison-Blanche font confiance. C’est la meilleure recommandation qu’une extension de sécurité puisse avoir.

Contrairement à SVG Support, Safe SVG ne nécessite aucune configuration. Installez, activez et c’est terminé; vous pouvez commencer à téléverser des SVG. L’extension utilise la même bibliothèque d’assainissement que le cœur de WordPress (enshrined/svg-sanitize) et y fait passer chaque fichier au moment du téléversement. Pas d’interface supplémentaire, pas de réglages; cela fonctionne simplement.

Safe SVG autorise le téléversement de SVG pour tous les utilisateurs disposant de la capacité upload_files. Si votre site compte plusieurs auteurs, vous devez restreindre le groupe, par exemple via une extension de gestion des rôles. Mais pour un administrateur seul, c’est la voie la plus simple et la plus sûre.

L’extension existe depuis des années, compte plus d’un million d’installations actives et une note de 4,4. Elle est mise à jour moins fréquemment que SVG Support (la dernière en avril 2026), mais c’est en réalité un signe de stabilité: il n’y a rien à casser.

  • Avantages: aucune configuration nécessaire, fonctionne immédiatement, assainissement au niveau du cœur de WordPress, développeur à la réputation irréprochable
  • Inconvénients: pas de paramètres de contrôle d’accès, pas de mode avancé pour les animations, pas de rendu en ligne
  • Prix: gratuit
  • Téléchargement: 🔗 Safe SVG sur WordPress.org

Méthode 3: WP SVG Images, l’assainissement avec contrôle des rôles

Bannière de l'extension WP SVG Images pour le téléversement sécurisé de fichiers SVG dans WordPress

WP SVG Images est développée par l’équipe de ShortPixel, connue pour ses outils d’optimisation d’images. L’extension occupe un juste milieu entre SVG Support et Safe SVG: les paramètres de rôles sont présents, mais il n’y a pas d’écrans superflus.

Après activation, l’extension autorise immédiatement le téléversement de SVG pour tous les administrateurs et éditeurs. Dans Réglages → WP SVG Images, vous pouvez affiner les rôles autorisés à téléverser et activer l’assainissement individuellement pour chaque rôle. Par exemple: les administrateurs téléversent sans vérification, les éditeurs téléversent avec assainissement obligatoire, les auteurs ne peuvent pas téléverser du tout.

Un plus supplémentaire est l’aperçu du SVG directement dans la médiathèque. Le WordPress standard affiche une icône de substitution à la place du fichier vectoriel. WP SVG Images génère une vignette, vous voyez donc exactement ce que vous avez téléversé sans ouvrir le fichier dans un nouvel onglet.

L’extension fournit également des filtres pour les développeurs: WPSVG_setAllowedTags et WPSVG_setAllowedAttrs vous permettent d’ajouter des balises et attributs personnalisés à la liste blanche de l’assainisseur.

  • Avantages: aperçu SVG dans la médiathèque, paramètres d’assainissement flexibles par rôle, filtres pour les développeurs, support actif
  • Inconvénients: pas de mode d’animation avancé, nécessite PHP 5.6.40+
  • Prix: gratuit
  • Téléchargement: 🔗 WP SVG Images sur WordPress.org

Tableau comparatif: quelle extension choisir

Extension

Installations actives

Note

Paramètres de rôles

Aperçu dans la médiathèque

Animations SVG

SVG Support

1M+

4,5 ★

✅ (admin / tous)

✅ (Mode avancé)

Safe SVG

1M+

4,4 ★

❌ (seulement upload_files)

WP SVG Images

30K+

5,0 ★

✅ (individuellement par rôle)

Les trois extensions sont gratuites et utilisent des bibliothèques d’assainissement éprouvées. SVG Support est le choix pour ceux qui ont besoin d’animation et d’un contrôle maximal. Safe SVG est pour ceux qui privilégient la simplicité et ne veulent pas toucher aux réglages. WP SVG Images est un compromis avec un aperçu pratique et une distribution flexible des droits.

Comment installer une extension SVG et téléverser un fichier: pas à pas

Quelle que soit l’extension que vous choisissez, le processus d’installation est le même:

Étape 1. Dans le panneau d’administration WordPress, ouvrez Extensions → Ajouter.

Étape 2. Dans la barre de recherche, saisissez le nom de l’extension: SVG Support, Safe SVG ou WP SVG Images.

Étape 3. Cliquez sur Installer sur la fiche de l’extension souhaitée, puis sur Activer.

Étape 4. Si l’extension possède des paramètres (SVG Support ou WP SVG Images), allez dans l’onglet correspondant et activez les restrictions de rôles. Pour Safe SVG, cette étape n’est pas nécessaire.

Étape 5. Ouvrez l’éditeur d’article ou de page. Dans le bloc Image, cliquez sur «Téléverser»; le format .svg fait désormais partie de la liste blanche.

Avant de téléverser un fichier SVG, assurez-vous de faire confiance à sa source. Dans l’idéal, utilisez des fichiers créés par votre designer dans Illustrator, Figma ou Inkscape. Si vous avez reçu un SVG d’un prestataire tiers, ouvrez-le dans le Bloc-notes et parcourez-le rapidement: il ne doit contenir ni <script> ni onload=.

En pratique, une vérification manuelle de trois secondes associée à l’assainisseur de l’extension offre une double marge de sécurité. En plusieurs années de travail avec WordPress, nous n’avons rencontré aucun incident réel avec un SVG téléversé via l’une des trois extensions décrites.

Si vous préférez le format vidéo, le clip ci-dessus montre l’ensemble du processus, de l’installation de l’extension à l’insertion du SVG sur une page.

⁉️🤔 Foire aux questions

Puis-je téléverser un SVG sans extension?

Ajoutez un extrait de code avec le filtre upload_mimes qui enregistre le type MIME image/svg+xml. Cependant, nous déconseillons cette approche: sans assainisseur, vous exposez votre site à du XSS stocké. Une extension résout le problème de sécurité automatiquement; quelques clics contre une brèche potentielle dans vos défenses.

Pourquoi l’extension Enable SVG n’est-elle plus disponible?

Raison: «Demande de l’auteur». L’extension n’a pas été mise à jour depuis 4 ans et a été définitivement retirée de WordPress.org. Si vous l’avez installée, remplacez-la par l’une des trois extensions ci-dessus. Elles sont activement maintenues et compatibles avec WordPress 7.0.

Comment vérifier qu’un SVG téléversé est sûr?

Un SVG sûr se compose de primitives graphiques telles que svg, g et path. Aucune balise script, aucun foreignObject et aucun attribut onload ou onclick n’apparaissent dans un fichier propre. Les trois extensions de cet article suppriment automatiquement les éléments dangereux lors du téléversement.

Quel format est le mieux pour un logo, SVG ou PNG?

Le SVG est le bon choix pour la plupart des sites. Un logo vectoriel ne pèse que quelques kilo-octets, ne floute pas sur les écrans retina et peut changer de couleur via CSS. Le PNG n’est nécessaire que si le logo contient une photographie ou un dégradé complexe qui rend mal en vectoriel.

WP SVG Images ou Safe SVG: laquelle est la plus fiable?

La différence réside dans le confort d’utilisation. Safe SVG, c’est «installez et oubliez», par une agence d’élite. WP SVG Images vous offre des aperçus dans la médiathèque et des paramètres de rôles individuels. En matière de sécurité, elles sont équivalentes.

Conclusion: quoi installer en 2026

Les trois extensions résolvent la problématique du téléversement sécurisé de SVG; le choix dépend de votre cas d’usage.

Besoin d’animer des icônes vectorielles et de rendu en ligne? Optez pour SVG Support; c’est la seule extension avec un mode avancé.

Vous voulez simplement téléverser un logo et ne plus y penser? Safe SVG est votre option. Installez, activez, terminé.

Besoin d’aperçus dans la médiathèque et d’un contrôle d’accès fin pour votre équipe? Choisissez WP SVG Images; ShortPixel a conçu un outil pratique avec la meilleure note parmi les extensions SVG.

En résumé: installez Safe SVG pour le minimalisme ou SVG Support pour un contrôle total. Les deux options sont gratuites et testées sur des millions de sites. Et surtout, après avoir installé l’une des trois extensions, l’erreur «type de fichier non autorisé» disparaît définitivement.