Il est très facile d’autoriser le téléchargement de fichiers SVGs dans votre médiathèque WordPress. Il existe de nombreuses ressources sur le Web expliquant comment procéder. Ajoutez simplement ces lignes de code à votre fichier functions.php :
function add_svg_to_upload_mimes( $upload_mimes ) {
$upload_mimes['svg'] = 'image/svg+xml';
return $upload_mimes;
}
add_filter( 'upload_mimes', 'add_svg_to_upload_mimes', 10, 1 );Supporté par quel navigateur ?
Aujourd’hui, cette technologie est plus que jamais prise en charge par différents systèmes d’exploitation et navigateurs Web :
Autre manière d’intégrer les SVGs : pluggin SAFE SVG
Si vous ne voulez pas prendre le risque de toucher votre fichier function.php, le plugin Safe SVG est l’une des meilleures alternatives, il permet de télécharger des fichiers SVGs dans WordPress. Safe SVG nettoie vos fichiers pour éviter les vulnérabilités pouvant affecter votre site Web.
Remarque : Si vous décidez de récupérer des svgs sur le net, il est important de connaitre la source de vos fichiers pour éviter tout problème de sécurité ( fichiers svgs affectés… )
Utiliser manuellement les SVGs dans les modèles de page
Voici comment appeler manuellement le fichier SVG dans les modèles de page WordPress :
<?php echo file_get_contents( get_stylesheet_directory_uri() . '/img/home.svg' ); ?>Rappel : vous avez la possibilité de créer vos fichiers SVGs avec Illustrator. Il est également possible et recommandé de formater votre SVG grâce aux outils SVG Sanitizer ou SVG minifier
FLATICON : des SVGs libres de droit (une référence fiable)
Flaticon référence plus de 1,6 million de fichiers vectoriels regroupés dans plus de 30 000 packs thématiques. Sur le site, les fichiers sont téléchargeables aux formats PNG, SVG, EPS, PSD et BASE64. Le service propose également un « icon editor » qui permet d’éditer la taille, la position ou les couleurs afin de se confectionner une icône parfaite pour son projet.
En conclusion
Les SVGs sont un très bon moyen d’améliorer l’apparence et les performances de votre site !
Veillez à ne pas laisser de côté les images PNG et JPG. Elles jouent un rôle capital dans la performance et le référencement de votre site.
Il est également important de ne pas négliger la qualité et la source de vos fichiers SVGs
Vous avez aimé l'article ? Partagez-le autour de vous !
Vous aimerez aussi...
