Comment créer et utiliser des graphiques vectoriels extensibles (SVG) dans WordPress
Ils sont généralement beaucoup plus petits parce que vous avez moins d’informations à conserver. Cela, à son tour, rendra votre site plus rapide. Pris en charge par tous les navigateurs – tous les navigateurs principaux et mobiles savent comment gérer SVG. Cela signifie que la plupart des visiteurs n’ont aucun problème à les voir. Si vous voulez toujours supporter les cas limites, vous pouvez le faire en fournissant une image de secours. Google reconnaît: Si vous craignez que l’utilisation de SVG ne nuise à votre référencement (après tout, l’utilisation d’images fait partie de l’optimisation de page), ne vous inquiétez pas. Google indexe les graphiques vectoriels extensibles de la même manière que les autres images et les intègre dans sa recherche d’images. Vous pouvez animer – utilisez css pour ajouter de l’animation à un dessin vectoriel. Cela crée des applications intéressantes. Nous ne le présenterons pas ici, mais vous pouvez lire cet article pour plus d’informations. Ainsi, comme vous pouvez le voir, il y a de nombreux avantages à utiliser des graphiques vectoriels extensibles sur les sites WordPress. Mais y a – t – il aussi des arguments contre cela?
Les inconvénients de SVG bien sûr, tout n’est pas exceptionnel dans ce format d’image, mais il y a aussi quelques défis: difficile à créer – comme nous le verrons ci – dessous, sans fond graphique, vous pourriez avoir du mal à créer vos propres fichiers SVG. Pas pour les images complexes – le format SVG est idéal pour les logos et les icônes, mais pas pour les images complexes comme les photos. Lorsque les SVG deviennent trop complexes, ils ont tendance à être plus grands que les pixels correspondants. Problème de sécurité: c’est la principale raison pour laquelle wordpress ne supporte pas immédiatement les graphiques vectoriels extensibles. En fait, il y a une longue discussion sur make WordPress Channel. Comme les SVG sont basés sur XML, ils peuvent provoquer des injections de logiciels malveillants, c’est pourquoi
Ces grandes collections d’icônes vectorielles gratuites sont disponibles sur votre site Web:
Icônes sèches icônes maléfiques icônes planes universelles de cette façon, vous n’avez pas besoin de créer votre propre SVG, mais vous pouvez toujours utiliser le format d’image sur le site. Comment as – tu fait? On en reparlera plus tard. Comment utiliser SVG en toute sécurité dans WordPress comme mentionné précédemment, wordpress ne prend pas en charge SVG immédiatement. Mais ne soyez pas déçu, nous avons plusieurs façons de le changer: manuellement et par plug – in. Cependant, comme le titre de cette section l’indique, nous cherchons le moyen le plus sûr d’utiliser SVG dans WordPress. Rappelez – vous qu’ils peuvent contenir du Code malveillant? Comme nous ne voulons aider personne à envahir notre site, nous avons besoin d’un moyen de désinfecter le SVG téléchargé. Cela signifie nettoyer le Code du fichier pour éliminer les injections, les conflits de code et les erreurs.
Maintenant, regardons comment, et nous allons commencer par le chemin du plug – in. Méthode 1: l’une des façons les plus simples d’activer le support SVG dans WordPress via le plugin est d’utiliser le plugin. Nous avons plusieurs options, y compris le support SVG le plus populaire et les graphiques vectoriels extensibles (SVG). Cependant, nous utiliserons un SVG sécurisé. C’est le seul fichier de la liste qui Désinfecte explicitement les fichiers SVG lorsqu’ils sont téléchargés. Il prend également en charge les formats d’images WordPress et ajoute un support pour la médiathèque.
Le plug – in est également livré avec une version professionnelle. Il contient des options importantes telles que la possibilité de limiter le chargement SVG à un compte Administrateur. Cela est significatif, en particulier pour les sites Web de grandes équipes d’édition ayant des connaissances techniques différentes. Cependant, à mon avis, les versions avancées sont assez coûteuses. Support SVG
Vous devez également limiter immédiatement les téléchargements de groupes d’utilisateurs. Par conséquent, si c’est un réglage critique pour vous, il est préférable d’utiliser le plug – in. Méthode 2: activez manuellement le support SVG dans WordPress la deuxième méthode consiste à prendre en charge les graphiques vectoriels extensibles via les paramètres de fonction. Php. Malheureusement, ce n’est pas aussi sûr que d’utiliser le plug – in ci – dessus, car il n’inclut pas le nettoyage des fichiers et permet le téléchargement non sélectif de SVG.
Si vous voulez toujours suivre ce chemin, trouvez la fonction fichier. PHP est dans le dossier du sujet actif. Télécharger, modifier et ajouter le code suivant: activer _ SVG upload ($upload mimes) {
$upload _ mimes [‘SVG’] = \
$upload _ mimes [‘svgz’] = \
Renvoie $upload _ mimes;
}
Ajouter un filtre (‘upload _ mimes’,’ enable SVG upload ‘, 10, 1); Enregistrez vos modifications et rechargez le fichier. Terminé. Comme indiqué précédemment, ce n’est pas l’option la plus sûre, mais pour des raisons d’achèvement, je voudrais l’inclure ici. Enfin, il est temps de vérifier que tout fonctionne correctement. Que vous utilisiez un plug – in ou manuellement, vous devriez maintenant être en mesure de charger des fichiers SVG.
Pour le tester, obtenez une icône SVG gratuite ou quelque chose comme ça de l’une des sources ci – dessus. Ensuite, connectez – vous à votre site et allez aux médias. Ici, essayez de télécharger un nouveau fichier SVG. Si tout se passe bien, ça devrait être comme ça:
Urezza dans WordPress et activer le chargement. Ainsi, même si WordPress Native ne supporte pas de tels fichiers, vous pouvez les utiliser sur votre site Web. Cela laisse la question de savoir si le support SVG le fera dans le noyau. Cela semble peu probable tant qu’il n’y a pas de solution aux problèmes de sécurité. Cependant, avec la popularité croissante des graphiques vectoriels extensibles dans la conception web, la communauté trouvera tôt ou tard une solution. D’ici là, vous avez un tutoriel comme celui – ci pour le faire fonctionner. Comment gérer les fichiers SVG sur les sites WordPress? D’autres suggestions? Veuillez nous le dire dans la section commentaires ci – dessous!