Créer votre premier bouton

conclusion

Insérez Button Basic à partir du bouton “+” et appliquez le préréglage pour créer un joli bouton en quelques clics. Configurez simplement votre texte et votre lien et publiez pour commencer.

Étape 1 : Insérez le bloc

Ouvrir l'écran de modification de la publication ou de la page
Cliquez sur le bouton **** à l'endroit où vous souhaitez ajouter un bloc.
Saisissez "Button Basic" dans le champ de recherche
Cliquez sur le bloc Button Basic affiché pour l'insérer

Point : Vous pouvez également le trouver en recherchant « zen » ou « bouton ».

Étape 2 : Appliquer le préréglage de conception

Sélectionnez le bloc inséré
Cliquez sur l'icône Préréglage dans la barre d'outils en haut du bloc.
Sélectionnez votre design préféré dans la liste prédéfinie affichée

Conseils d'ajustement : Utilisez les préréglages comme base et n'hésitez pas à ajuster la couleur et la taille ultérieurement. Nous vous recommandons de choisir d’abord un préréglage proche de votre direction générale.

Étape 3 : Modifier le texte

Cliquez directement sur le texte dans le bloc
Saisissez le texte du bouton que vous souhaitez afficher (par exemple "Contactez-nous", "Démarrez gratuitement")

Point : Le texte peut être modifié directement dans l'éditeur. La taille et l'épaisseur de la police peuvent être ajustées à partir du panneau « Paramètres du texte » dans la barre latérale.

Étape 4 : Configurer le lien

Une fois le bloc sélectionné, cliquez sur l'icône de lien dans la barre d'outils.
Saisissez l'URL de destination du lien
Activez "Ouvrir dans un nouvel onglet" si nécessaire
Confirmez avec la touche Entrée

Remarque : Vous pouvez basculer entre a (lien)/button (élément de bouton)/div (élément de bloc) en sélectionnant la balise dans la barre d'outils. Il n'y a aucun problème avec les boutons de lien normaux comme c'est le cas avec la balise a.

Étape 5 : Ajuster les couleurs

Ouvrez chaque panneau de paramètres dans la barre latérale
Pour modifier la couleur d'arrière-plan Ouvrez le panneau Paramètres d'arrière-plan
Pour modifier la couleur du texte, ouvrez le panneau Paramètres du texte.
Spécifiez la couleur à l'aide du sélecteur de couleur ou du code couleur

Conseil de réglage : Garantir un bon rapport de contraste entre la couleur d'arrière-plan du bouton et la couleur du texte améliore la visibilité et l'accessibilité.

Étape 6 : Vérifiez avec l'aperçu

Cliquez sur le bouton Aperçu en haut de l'éditeur.
Sélectionnez "Aperçu dans un nouvel onglet"
Vérifier la visibilité des boutons sur le devant
Vérifiez également les modifications lors du survol et la transition vers la destination du lien.

Point : L'affichage sur l'éditeur et l'affichage sur le front-end correspondent fondamentalement, mais le thème CSS peut l'affecter. Veuillez effectuer la confirmation finale sur le front-end.

Étape 7 : Publiez votre page

Une fois que vous êtes satisfait de l'apparence et du lien du bouton, cliquez sur Publier ou Mettre à jour en haut de l'éditeur.
Accédez à la page d'accueil pour la confirmation finale

Si vous souhaitez effectuer des réglages plus détaillés

Button Basic dispose de 18 types de panneaux de configuration. Pour la méthode de réglage détaillée, veuillez vous référer au [Guide de réglage de base du bouton] (../../buttonbasic/).

Panneau de paramètres principal :

panneau	Ce que tu peux faire
paramètres de texte	Ajustez la taille de la police, l'épaisseur, l'espacement des lignes et l'espacement des caractères
Paramètres de mise en page	Ajustement de la largeur, de la hauteur et des marges (marges et remplissage)
paramètres d'arrière-plan	Paramètres de couleur/gradation/image/motif
Paramètres de bordure	Ajustez la largeur, le style, la couleur et les coins arrondis des lignes
paramètres d'icône	Ajout d'icônes, définition de la taille et de la couleur
Paramètres d'animation	Animation au survol ou à l'affichage (fonction Pro)

prochaine étape

Si vous êtes intéressé par la version Pro, vous pouvez vérifier la méthode d'activation sur [Activation de la version Pro] (../pro-activation/).