de WordPress sont utiles pour les propriétaires de sites car ils permettent de stocker des données supplémentaires et d'améliorer les fonctionnalités des plugins et des thèmes . Les champs personnalisés avancés vous permettent d'ajouter des informations uniques. Par exemple, un plugin WooCommerce utilise des champs pour les détails du produit comme le prix et la couleur. Un plugin d'événements utilise des champs pour le lieu et l'heure de l'événement. Les champs personnalisés vous offrent la flexibilité de stocker des données pertinentes.
Les champs personnalisés WordPress permettent aux utilisateurs d'inclure, de stocker et d'afficher des données supplémentaires liées au contenu. Fonctionnant comme des conteneurs de métadonnées, ils alimentent diverses fonctionnalités des plugins et des thèmes. De plus, les utilisateurs peuvent créer des champs personnalisés adaptés à leurs besoins spécifiques, facilitant ainsi la gestion personnalisée des données dans WordPress.
Dans ce blog, nous explorerons comment intégrer des champs personnalisés avancés dans la conception WordPress à différentes étapes du développement WordPress .
Pourquoi avez-vous besoin de champs personnalisés dans WordPress ?
Qu'il s'agisse de gérer une boutique de commerce électronique avec WooCommerce ou de planifier des événements avec un plugin de calendrier, les champs personnalisés offrent une solution polyvalente pour adapter votre site Web en fonction de vos besoins uniques. Ils vous permettent de stocker des données supplémentaires au-delà des champs de publication ou de page standard, vous permettant ainsi de créer des mises en page de contenu plus dynamiques et visuellement attrayantes.
Lisez aussi : 40+ meilleurs plugins WooCommerce
Les principaux avantages de l’utilisation des champs personnalisés incluent :
Stockage des métadonnées : stockez les métadonnées pertinentes pour les publications, les pages ou les types de publication personnalisés.
Affichage de contenu amélioré : présentez le contenu de manière organisée et esthétique.
Intégration des plugins : intégration transparente avec les plugins populaires pour le référencement , le commerce électronique, la mise en cache , les événements, la sécurité , la recherche WordPress et plus encore.
Expérience utilisateur personnalisée : adaptez l'UX au site Web de votre petite entreprise en affichant un contenu spécifique basé sur des champs personnalisés.
Flexibilité évolutive : Adaptez-vous facilement aux exigences changeantes du contenu sans modifier la structure principale de WordPress.
Vous avez un site WordPress encombré qui fait fuir votre entreprise ?
Nos concepteurs expérimentés peuvent réorganiser la conception de votre site avec des champs personnalisés avancés pour WordPress
Que sont les champs personnalisés intégrés à WordPress ?
L'ajout de champs personnalisés dans WordPress est un processus simple et efficace, améliorant l'organisation et les fonctionnalités du contenu. Avec les options disponibles dans les éditeurs classiques et de blocs, l’activation des champs personnalisés intégrés dans WordPress est simple, permettant une saisie transparente de paires clé/valeur pour une personnalisation améliorée.
Voici comment procéder :
Configuration de l'éditeur classique : accédez aux options d'écran et activez les champs personnalisés pour l'interface de l'éditeur classique.
En savoir plus : WordPress 6.2 : éditeur de site remanié, mode d'écriture sans distraction et insertion de blocs mis à jour
Configuration de l'éditeur de blocs : accédez à la zone Options et activez les champs personnalisés pour l'éditeur de blocs.
Accéder aux champs personnalisés : localisez la section des champs personnalisés sous votre contenu une fois activée.
Saisir des données : saisissez les informations de votre champ personnalisé à l'aide de paires clé/valeur.
Fonctionnalité intégrée : bien que fonctionnelle, la méthode native peut manquer de convivialité. Vérifiez pour optimiser,
Pensez aux plugins : beaucoup optent pour le plugin Advanced Custom Fields pour une expérience plus intuitive.
Ajout de vos champs sur les champs personnalisés avancés : guide étape par étape
Advanced Custom Fields (ACF) propose une version premium accessible et abordable. La version gratuite couvre la plupart des besoins de base avec différents types de champs et fonctionnalités conviviales.
Cependant, la version Pro introduit des fonctionnalités pratiques telles que des champs de répéteur pour gérer plusieurs instances de données par publication, des blocs ACF pour Gutenberg , des champs de contenu flexibles pour des mises en page personnalisées et des champs de galerie pour télécharger plusieurs images. ACF PRO commence à 49 $ par an pour une utilisation sur un seul site, offrant une flexibilité de mise à niveau selon les besoins.
Que vous utilisiez la version gratuite ou la version pro, l'ajout de vos champs suivra cette méthode –
Créer un nouveau groupe de champs
Après avoir installé et activé la version accessible de Advanced Custom Fields depuis WordPress.org, accédez à Custom Fields > Add New pour créer votre premier groupe de champs.
Un « groupe de champs » est un ensemble de champs personnalisés affichés ensemble dans votre tableau de bord WordPress.
Dans cet exemple, nous allons créer un groupe de champs avec cinq champs personnalisés.
Nommez votre groupe de champs et choisissez où il doit apparaître. Pour les articles de blog, conservez-le comme article par défaut. Mais si vous le souhaitez ailleurs, comme avec un type de publication personnalisé, vous pouvez le modifier. Vous pouvez également ajouter des règles pour afficher vos champs à différents endroits.
Lire la suite : Comment développer un site Web WordPress personnalisé ?
Ajouter des champs personnalisés
Pour continuer, sélectionnez le bouton + Ajouter un champ pour incorporer votre champ personnalisé initial. Bien qu'une multitude d'options soient présentées, il est facultatif de remplir chaque champ.
Les deux sélections principales sont :
Libellé du champ : il s'agit du nom visible dans l'éditeur et sert de base au nom du champ utilisé dans le code. La modification du nom du champ est facultative.
Type de champ : choisissez le type de données que vous souhaitez collecter, tel que Numéro pour les données numériques ou Email pour les adresses e-mail.
Pour le premier champ, optez pour le type de champ Bouton Radio. Ci-dessous, entrez les options disponibles pour la sélection du bouton radio dans la zone Choix. De plus, ajustez les paramètres tels que les exigences de champ et la valeur par défaut comme vous le souhaitez.
Pour un autre scénario, envisagez un champ personnalisé pour capturer la distance d'une course. Dans ce cas, sélectionnez le type de champ Numéro. Vous pouvez inclure l'unité de distance pour plus de convivialité et définir des valeurs minimales et maximales à des fins de validation.
Répétez ces étapes pour tous les champs personnalisés supplémentaires que vous souhaitez inclure. Une fois terminée, votre configuration devrait ressembler à l'exemple fourni.
Configurer et publier
Pour terminer le processus, faites défiler jusqu'à la zone Paramètres. Ici, vous pouvez ajuster la façon dont vos champs apparaissent dans l'éditeur WordPress.
Habituellement, vous pouvez vous en tenir aux valeurs par défaut, mais n'hésitez pas à les personnaliser si nécessaire. Par exemple, vous pouvez afficher vos champs personnalisés au-dessus de l’éditeur WordPress standard. Une fois que vous êtes satisfait de vos paramètres, cliquez sur Publier pour activer votre groupe de champs.
Lisez aussi : Correction de « Échec de la publication » de WordPress. La réponse n'est pas une réponse JSON valide. Problème
Développer les informations dans l'éditeur WordPress
Après avoir publié votre groupe de champs, vos champs personnalisés seront facilement disponibles lors de la création d'une nouvelle publication. Ils s'intégreront de manière transparente sous l'éditeur, à la fois dans l'éditeur TinyMCE classique et dans le nouvel éditeur de blocs.
Champs personnalisés avancés sur le front-end
Félicitations! Vous êtes à mi-chemin de votre parcours vers les champs personnalisés avancés. Passons maintenant à une étape cruciale : présenter vos données de champs personnalisés sur le front-end de votre site Web.
Malgré l'ajout de champs personnalisés à vos articles de blog, ils apparaissent toujours comme des articles frontaux normaux.
Changeons ça !
Voici trois méthodes pour afficher vos données de champs personnalisés avancés :
Fichiers modèles du thème : idéal pour ceux qui sont à l'aise avec les aspects techniques et qui travaillent avec des fichiers modèles. Vous pouvez également consulter des modèles d’IA à ce sujet.
Shortcode : simple et adapté à l'insertion de données de terrain sur des publications spécifiques, mais nécessite un effort manuel.
Elementor Pro : Une option premium qui élimine le travail PHP, idéale si vous préférez un éditeur visuel.
Choisissez la méthode qui correspond à vos besoins ou explorez-les toutes, à vous de choisir !
Lire aussi : Gutenberg contre. Elementor : qui gagne en 2024 ?
Champs personnalisés avancés avec modèle de thèmes
La première méthode pour présenter les informations de votre champ personnalisé consiste à ajouter les fonctions PHP de Advanced Custom Fields directement aux fichiers modèles de votre thème enfant. Bien qu'un peu avancé, il garantit un affichage cohérent des champs personnalisés.
Localisez et modifiez le fichier de modèle unique pour votre type de publication (par exemple, single.php ou content-single.php pour le thème TwentyNineteen).
Utilisez la fonction the_field() pour afficher les informations sur le champ, en combinant le balisage HTML avec PHP.
Placez-le au-dessus du contenu habituel de la publication dans votre fichier de modèle de thème, et le tour est joué ! Vos données de champ personnalisé apparaîtront de manière transparente au-dessus du contenu WordPress.
Lire la suite : Comment convertir du HTML en thème WordPress ?
Champs personnalisés avancés avec un shortcode
Vous recherchez un moyen plus simple de présenter vos données de champs personnalisés ? Pensez à utiliser des shortcodes. Insérez simplement le shortcode chaque fois que vous souhaitez afficher un champ personnalisé. Bien que pratique, cela nécessite un effort manuel sans automatisation.
Voici un exemple de shortcode :
L’insérer dans l’éditeur WordPress produira la même apparence frontale que la méthode de modèle de thème.
Conclusion
La maîtrise des champs personnalisés avancés ouvre des possibilités infinies pour améliorer les fonctionnalités et la présentation du contenu de votre site Web WordPress. Que vous soyez propriétaire d'une boutique de commerce électronique, organisateur d'événements ou toute personne cherchant à personnaliser son site, les champs personnalisés vous permettent de stocker et d'afficher des données uniques de manière transparente.
En tirant parti de l'interface intuitive, des types de champs et des options d'intégration du plugin, vous pouvez créer des mises en page visuellement attrayantes, rationaliser la gestion de contenu et offrir des expériences utilisateur personnalisées. Les champs personnalisés offrent la flexibilité de s'adapter à mesure que votre site Web évolue sans remanier la structure de base. Profitez de la puissance des champs personnalisés avancés et débloquez un monde de personnalisation qui élève votre site WordPress vers de nouveaux sommets de professionnalisme et de sophistication.
