6 septembre 2023
Zero Block In Pop-Up : Nouveau bloc dans la bibliothèque T1093
Ce bloc transforme n'importe quel bloc zéro en une fenêtre contextuelle. Le modificateur est le bloc Т1093 "Pop-up : Bloc zéro en pop-up" dans la catégorie "Autres" de la bibliothèque des blocs.
Pourquoi utiliser le bloc de modificateurs
Vous souhaitez concevoir une fenêtre contextuelle personnalisée et les solutions standard de la bibliothèque ne vous conviennent pas. Par exemple, vous voulez créer un menu dynamique, une info-bulle personnalisée qui apparaît au clic, une fenêtre contextuelle de promotion, et bien d'autres choses encore.
Comment utiliser le bloc modificateur T1093 ?
1
Ajoutez un bloc zéro à la page et concevez la mise en page de la fenêtre contextuelle.
2
Ajouter le bloc modificateur T1093 de la catégorie "Autres" à la page.
3
Dans l'onglet Contenu du bloc T1093, indiquez l'ID du bloc zéro de la première étape. Spécifiez un lien contextuel dans le même onglet.
4
Réfléchissez à l'élément de la page qui peut être utilisé comme déclencheur de l'ouverture de la fenêtre contextuelle. Il peut s'agir d'un bouton ou d'un texte dans n'importe quel bloc. Pour cet élément, spécifiez le lien de la fenêtre contextuelle de l'étape 3.
Si vous souhaitez que la fenêtre contextuelle s'ouvre automatiquement dès le chargement de la page, cochez la case correspondante dans l'onglet Paramètres du bloc. Dans le même onglet, vous pouvez personnaliser l'apparence de la fenêtre contextuelle : Alignement, arrière-plan flou, fonctions d'animation , , etc.
Les paramètres du bloc Т1093 "Pop-up : Zero Block in pop-up" de la catégorie "Autres".
Conseils pour tirer le meilleur parti du bloc
Lors de la conception d'un menu personnaliséLe bloc T1093 est configuré de la manière suivante :
Lors de la conception d'un pop-upvous pouvez vérifier ces paramètres :
- Sélectionnez le positionnement (l'option la plus courante est l'alignement par le haut) ;
- Masquer ou modifier la couleur de l'icône de fermeture du menu.
- Si vous n'avez pas besoin de la couleur d'arrière-plan ou de l'effet de flou, vous pouvez supprimer les valeurs de ces champs.
Lors de la conception d'un pop-upvous pouvez vérifier ces paramètres :
- Sélectionnez une couleur d'arrière-plan sombre dans les paramètres du bloc T1093 ;
- Spécifiez une couleur claire pour l'icône de fermeture afin qu'elle ne se confonde pas avec l'arrière-plan ;
- Ajustez la largeur et la hauteur de la fenêtre contextuelle dans les paramètres du bloc zéro.
Exemples d'utilisation du bloc
Consultez les guides étape par étape sur l'ajout d'un menu sur le site Web à l'aide du bloc T1093. Vous pouvez également inclure ces mises en page dans votre projet : Il vous suffit de créer une nouvelle page et de l'ajouter à l'aide de son ID de modèle.
Menu plein écran
Comment recréer l'animation
Ouvrez les paramètres du bloc T1093 et définissez les paramètres suivants :- Animation de l'apparition - Apparition de la droite
- Animation de l'apparition sur mobile - Apparition par le haut
- Animation easing - Quart : Ease In Out
- Vitesse d'animation de l'apparition, en secondes - 0,6
Menu en demi-écran avec effet de flou
Comment recréer l'animation
Ouvrez les paramètres du bloc T1093 et définissez les paramètres suivants :- Flou d'arrière-plan - 10px
- Animation de l'apparition - Apparition par le haut
- Animation easing - Quart : Ease In Out
- Vitesse d'animation de l'apparition, en secondes - 0,5
Menu de deuxième niveau
Comment recréer l'animation
Ouvrez les paramètres du bloc T1093 et définissez les paramètres suivants :
Vous pouvez importer le modèle de page avec cette animation dans votre projet en utilisant l'ID du modèle 39206715. En savoir plus dans le centre d'aide.
Ouvrez les paramètres du bloc T1093 et définissez les paramètres suivants :
- Pop-up : Couleur d'arrière-plan - #000000
- Pop-up : Opacité de l'arrière-plan - 40%
- Animation de l'apparition - Apparition par le haut
- Animation easing - Quart : Ease In Out
- Vitesse d'animation de l'apparition, en secondes - 0,6
- Z-index - 9998 (la valeur doit être inférieure à celle du menu principal)
Vous pouvez importer le modèle de page avec cette animation dans votre projet en utilisant l'ID du modèle 39206715. En savoir plus dans le centre d'aide.
Voir aussi
Vous pouvez désormais créer et modifier des éléments vectoriels dans l'éditeur Zero Block du constructeur de sites web Tilda.
Il est désormais plus facile d'utiliser la palette de couleurs et de choisir plus rapidement la bonne couleur pour votre site web.
