Home > Blog > Comment intégrer des fichiers SVG en toute sécurité sur WordPress

Les images SVG sont fréquemment utilisées sur le web, notamment pour les logos et les icônes. Cependant, WordPress n'autorise pas par défaut leur téléchargement.

Dans cet article, nous allons voir ce qu'est le format SVG, pourquoi il est avantageux, et comment vous pouvez l'utiliser en toute sécurité sur WordPress.

Qu’est-ce que le SVG et pourquoi l’utiliser sur WordPress ?

Le SVG, ou Scalable Vector Graphics (Graphiques Vectoriels Adaptables en français) est un format d'image vectorielle. Une image vectorielle peut être agrandie à l'infini sans aucune perte de qualité.

Si vous effectuez un zoom sur un fichier SVG, l’image restera nette et précise. En revanche, les formats JPG ou PNG deviennent flous et pixelisés à mesure qu'ils sont agrandis.

Une autre caractéristique attrayante du format SVG est sa légèreté. Les images lourdes sont souvent responsables des pages web qui se chargent lentement, ce qui peut nuire à l'expérience utilisateur. Une page rapide à charger est également favorisée par les moteurs de recherche, améliorant ainsi votre référencement naturel.

Mais alors, avec de tels avantages, pourquoi WordPress ne permet-il pas par défaut l'utilisation du format SVG ?

Pourquoi WordPress n'autorise-t-il pas par défaut les fichiers SVG ?

WordPress n'autorise pas par défaut les images SVG en raison de la sécurité. Les fichiers SVG peuvent contenir des scripts malveillants qui pourraient mettre en danger la sécurité de votre site internet.

Les fichiers SVG sont écrits en XML, un langage proche du HTML utilisé pour afficher les sites web.

D’ailleurs, contrairement aux images JPG ou PNG, qui s'ouvrent avec un logiciel d'édition d'images, les fichiers SVG s'ouvrent dans votre navigateur.

Une personne mal intentionnée peut insérer du code malveillant dans le langage XML. Si un fichier SVG compromis est téléchargé sur votre site WordPress, cela pourrait compromettre la sécurité de votre site.

Mais rassurez-vous, il est tout à fait possible de sécuriser facilement un fichier SVG… et de le téléverser sur WordPress.

Comment télécharger les fichiers SVG sur WordPress ?

Comme nous l’avions mentionné, les fichiers SVG offrent des avantages, mais WordPress n'autorise pas par défaut leur téléchargement pour des raisons de sécurité. Dans cette section, nous allons partager trois méthodes pour contourner cette limitation.

Ajouter du code dans le fichier functions.php

Avant de commencer, il est important de préciser que cette méthode autorisera le téléchargement de fichiers SVG dans la bibliothèque WordPress, mais elle n'éliminera pas les risques de sécurité.

Le code inséré indique à WordPress d'inclure le format SVG parmi les formats d'image acceptés (comme JPG et PNG). Aucune mesure de sécurité n’est prise pour les fichiers SVG.

Ouvrez le fichier functions.php et insérez le code suivant :

  function my_mime_types( $mimes ) {
    $mimes['svg'] = 'image/svg+xml';
    return $mimes;
}

add_filter('upload_mimes', 'my_mime_types');

Nous vous déconseillons vivement cette méthode. Nous l'avons incluse ici car elle est souvent mentionnée sur internet. Notre but est de vous alerter des risques de sécurité qu'elle pourrait poser à votre site WordPress.

Utiliser des fichiers SVG sur WordPress avec le plugin SVG Support

Pour commencer, installez le plugin SVG Support et activez-le.

Si vous ne savez pas comment faire, suivez ces étapes :

  1. Allez dans votre tableau de bord WordPress.
  2. Dans le menu latéral gauche, cliquez sur "Extensions" puis sur "Ajouter".
  3. Recherchez "SVG Support" dans la barre de recherche.
  4. Cliquez sur "Installer" puis sur "Activer" une fois l'installation terminée.

Après avoir téléchargé et activé le plugin, vous pouvez ajuster quelques paramètres, bien que cela ne soit pas obligatoire. Allez dans la barre latérale gauche, sous l’onglet "Réglages", puis sélectionnez "SVG Support". Sur la page qui s’affiche, vous pouvez cocher :

  • "Restrict to administrators" pour restreindre l'utilisation des fichiers SVG aux administrateurs.
  • "Advanced mode" pour activer des fonctionnalités avancées comme les animations en CSS.

Enregistrez vos paramètres et voilà, c’est terminé ! Vous pouvez maintenant ajouter des images SVG à votre site WordPress.

Intégrer des fichiers SVG sur WordPress avec le plugin Safe SVG

Pour commencer, téléchargez et activez le plugin Safe SVG. Si vous ne savez pas comment procéder, consultez la section précédente.

La version gratuite du plugin ne permet pas de réglages. Si vous souhaitez avoir plus de contrôle et accéder à des options de configuration supplémentaires, il vous faudra opter pour la version payante.

Nous espérons que cet article vous a été utile pour apprendre à ajouter des fichiers SVG en toute sécurité sur WordPress.

Si vous avez aimé cet article, vous pouvez trouver d’autres articles pour vous aider à améliorer votre site internet sur Refined web.

par Admin | 04-08-2024 | Mots clés : Wordpress