Icon Block 1.4.0 ajoute un contrôle de la hauteur, améliore la gestion des couleurs pour mieux prendre en charge les styles globaux

Nick Diego, défenseur des développeurs chez WP Engine, a publié version 1.4.0 de son Bloc d’icônes brancher. Diego l’a lancé en octobre 2021, après avoir lutté pour trouver un moyen efficace d’ajouter des icônes SVG à l’éditeur de blocs. Il vise à ce que ce plugin petit mais utile devienne « l’icône et le bloc graphique SVG définitifs ». Au cours de l’année écoulée, il a augmenté de 1 300 % pour atteindre plus de 7 000 installations actives, tout en restant concentré sur un ensemble restreint de fonctionnalités.

Les contributeurs WordPress ont été discuter de l’ajout du support SVG au cœur depuis plus d’une décennie, mais n’ont pas encore trouvé de voie claire qui réponde correctement aux problèmes de sécurité. En juillet 2022, l’équipe Performance a commencé travailler sur un module pour les téléchargements SVG mais c’est toujours en cours. En attendant, puisque le format SVG a prise en charge presque universelle sur le Webles utilisateurs se sont appuyés sur des plugins comme Prise en charge SVG (plus de 1 million d’installations) ou SVG sécurisé (plus de 700 000 installations) pour télécharger des fichiers SVG dans la médiathèque et les utiliser comme n’importe quel autre fichier image.

Le plugin de Diego est différent en ce sens qu’il a été conçu pour être utilisé avec les éditeurs de blocs et de sites. Le bloc d’icônes enregistre un seul bloc qui permet aux utilisateurs d’ajouter des icônes et des graphiques SVG personnalisés. Il permet également d’accéder à la bibliothèque d’icônes WordPress, qui contient plus de 270 icônes SVG.

L’un des avantages du plugin est que les utilisateurs n’ont pas besoin d’installer une bibliothèque de blocs entière s’ils ont juste besoin d’icônes SVG. Dans la version 1.2.0, Icon Block a ajouté la possibilité pour les développeurs de enregistrer leurs propres bibliothèques d’icônes personnalisées.

La dernière version étend le contrôle de la largeur au-delà de ce qui est offert dans le bloc Image principal pour prendre en charge %, px, em, rem, vh, vw, ou toutes les unités définies dans theme.json. Ces unités sont également disponibles dans les styles globaux, afin que les utilisateurs puissent contrôler la largeur en fonction de la volonté de l’auteur du thème. Diego, qui a déclaré qu’il préférait utiliser des composants WordPress natifs dans la mesure du possible, a mis à jour les contrôles de largeur à l’aide de Gutenberg HauteurContrôlequi n’est pas encore disponible dans core.

« Heureusement, il est construit à partir de composants présents dans WordPress depuis la version 6.0. J’ai porté le code du HeightControl vers une coutume DimensionControl dans le bloc d’icônes et j’ai apporté quelques modifications pour répondre à mes besoins spécifiques », a déclaré Diego.

La prise en charge de la hauteur des icônes est une nouvelle fonctionnalité de la dernière version 1.4.0, une autre demande de fonctionnalité de la communauté d’utilisateurs du plugin.

« Une chose à noter est que je choisis d’exclure % à partir des options d’unité de hauteur », a déclaré Diego dans le message de publication. « En utilisant % peut avoir des résultats inattendus en fonction de la hauteur du conteneur de l’icône et n’est pas du tout intuitif. »

La version 1.4.0 améliore également la prise en charge des couleurs pour mieux prendre en charge les styles globaux. Lorsque les thèmes définissent un primary et secondary couleurs dans theme.json, les icônes définies pour les utiliser fonctionneront de manière transparente avec le changement de variation de style. Il s’agit d’une belle démonstration de la façon dont les développeurs de blocs peuvent faire fonctionner leurs plugins en harmonie avec les styles globaux pour améliorer l’expérience de l’édition complète du site.

Dans les prochaines versions, Diego a déclaré qu’il prévoyait de travailler sur un moyen de permettre aux utilisateurs d’insérer des icônes SVG personnalisées à partir d’un fichier SVG « téléchargé », ainsi que d’explorer des moyens d’intégration avec des bibliothèques d’icônes tierces. L’accès à Font Awesome, aux icônes Boostrap, aux Ionicons et à d’autres bibliothèques SVG offrirait aux utilisateurs une sélection beaucoup plus large au-delà de la bibliothèque d’icônes WordPress lors de la conception de leurs sites.

Les utilisateurs peuvent soumettre des demandes de fonctionnalités via le problèmes file d’attente dans le référentiel GitHub du plugin. Étant donné que Diego développe le plugin en utilisant autant que possible des composants WordPress natifs, les utilisateurs peuvent également s’attendre à ce que des fonctionnalités supplémentaires soient disponibles au fur et à mesure de leur ajout au cœur de WordPress.

« Il existe des tonnes d’excellents plugins d’icônes dans l’écosystème WordPress, gratuits et premium », a déclaré Diego. « La plupart ont plus de fonctionnalités et de fonctionnalités que le bloc d’icônes. Cependant, ce qui rend ce bloc différent, c’est son engagement fort envers les principes de conception de base de WordPress.

« L’objectif était toujours de donner l’impression que le bloc appartenait à WordPress lui-même. Je me suis efforcé d’utiliser autant de cœurs bloc prend en charge et composants que possible. La version 1.4.0 reste fidèle à cet effort avec des améliorations indispensables.