Flipbox
Et si un élément immobilier sur votre page pouvait raconter deux histoires Avec Master Addons Flipbox Element, il peut. Ce n'est pas seulement une carte « C'est une expérience dynamique à deux faces » Commencez par une face avant convaincante comportant une icône et un titre Ensuite, en vol stationnaire, il bascule élégamment pour révéler des descriptions détaillées, des appels à l'action ou des informations supplémentaires au dos Choisissez parmi plusieurs préréglages de style et plus d'une douzaine d'animations fluides C'est les éléments parfaits pour les faits saillants des fonctionnalités, les vitrines de service, les profils d'équipe ou les appels à l'action créatifs qui surprennent et s'engagent.
Plusieurs préréglages de conception et préréglage d'animation
Tout d'abord, choisissez votre look de base parmi quatre préréglages de style : l'icône classique par défaut, image avant, diagonale et avant. Chaque préréglage modifie la disposition visuelle initiale. Ensuite, donnez-lui vie en sélectionnant un style d'animation dans une immense bibliothèque. Optez pour un simple Flip Horizontal ou Vertical, un Flip 3 D sophistiqué, un Fade lisse ou des options créatives comme les rotations de cube, le Rollover ou les révélations diagonales. Cette combinaison vous permet de faire correspondre parfaitement le comportement de la boîte à feuilles à l'énergie subtile ou dramatique de votre site.
- Fondations à quatre styles : choisissez parmi les conceptions prédéfinies par défaut, image frontale, diagonale et icône avant.
- Bibliothèque d'animation étendue : sélectionnez parmi plus de 15 animations, notamment Flip, Fade, Cube, Rollover et Flip 3D.
- Contrôlez l'effet : les animations se déclenchent par défaut sur le survol, créant ainsi une expérience intuitive et interactive.
Générateur de contenu double face
Construisez deux faces complètes de contenu indépendamment Pour la Boîte de Front, ajoutez une Icône (choisissez Styles empilés ou encadrés), un Titre fort et un court teaser Description Définissez l'Alignement et le Titre HTML Tag pour le référencement Pour la Boîte de Retour, répétez le processus avec un contenu différent développez la description, ajoutez plus de détails, ou concentrez-vous entièrement sur un appel à l'action Cette approche en deux étapes vous permet de vous contenter du recto et de livrer avec le verso.
- Panneaux de contenu indépendants : contrôles entièrement séparés pour le contenu de la boîte avant et de la boîte arrière (icône, titre, description).
- Options de style d'icône : Présentez les icônes comme empilées (solides) ou encadrées (bordées) directement à partir de l'onglet contenu.
- Messagerie stratégique : utilisez le recto pour un avantage principal et le verso pour plus de détails, de fonctionnalités ou de preuves sociales.
- Contrôle structurel : définissez l'alignement (gauche, centre, droite) pour le contenu de chaque côté indépendamment.
Bouton CTA avec Hover
La boîte arrière n'est pas seulement pour l'information « c'est pour l'action » Incluez un bouton d'action clair avec un texte de bouton personnalisable (comme “Buy” ou “Learn More”) et un lien Ensuite, concevez-le à la perfection Stylez les états Normal et Hover séparément, en contrôlant la couleur du texte, la typographie, la couleur de l'arrière-plan, la bordure, le rayon de bordure et le rembourrage Cela transforme la révélation de la boîte à feuilles mobiles en une voie directe vers la conversion, le tout sans widget séparé.
- Appel direct à l'action : ajoutez un bouton avec du texte et un lien qui apparaît dans la zone arrière après le retournement.
- Style de bouton professionnel : utilisez les commandes Border Radius, Padding et Background pour un bouton poli.
Questions Fréquemment Posées Pour Flipbox
Que se passe-t-il sur les appareils mobiles où il n'y a pas de vol stationnaire ?
L'interaction flip est généralement déclenchée par une pression sur les appareils mobiles. L'utilisateur appuie sur la boîte avant pour la retourner vers l'arrière et peut appuyer à nouveau pour revenir en arrière. Cela le rend entièrement fonctionnel et intuitif sur les écrans tactiles.
Puis-je utiliser une image au lieu d'une icône sur le devant ?
Oui ! l'un des préréglages de style s'appelle “Front Image.” La sélection de ce préréglage changera le sélecteur d'icônes en téléchargeur d'images, vous permettant d'utiliser une photo, un logo ou un graphique comme visuel principal sur la boîte avant.
Le contenu de la boîte à feuilles mobiles est-il réactif ?
Absolument. Le texte, les icônes et le bouton à l'intérieur seront mis à l'échelle et enveloppés de manière appropriée sur différentes tailles d'écran. La hauteur de la boîte à retour que vous définissez est également réactive, mais vous pouvez l'ajuster spécifiquement pour les mobiles en utilisant le mode d'édition réactif d'Elementor si nécessaire.
Quelle est la bonne utilisation réelle de cet élément ?
- Boîtes de service : Front : Icône de service et nom (par exemple, “Web Design”). Retour : Description & “Obtenir un bouton Quote”.
- Profils d'équipe : Front : Photo & name Retour : Bio & liens sociaux.
- Caractéristiques du produit : Front : Icône de fonctionnalité et titre. Retour : Spécifications détaillées et “Voir Lien de” du produit.
- Statistiques : Front : Un grand nombre Retour : Ce que cela signifie et un lien source.
Puis-je lier l'intégralité de la boîte à feuilles à une page sans le bouton séparé ?
Par défaut, vous pouvez ajouter un lien vers le bouton uniquement. Mais avec l'aide de notre extension de lien Wrapper, vous pouvez lier la boîte à feuilles entier.
Comment choisir la bonne animation ?
Considérez le rythme de votre site Pour les sites corporatifs ou propres, utilisez Flip Horizontal/Vertical ou Fade Pour les sites créatifs, tech, ou de portefeuille, 3 D Flip, Cube, ou Rollover peut ajouter plus de personnalité Prévisualisez quelques-uns au mieux on se sent lisse et ne distrait pas de votre message.
Widgets et extensions d'éléments tendance
Construisez des sites Web sophistiqués en moins de temps.
Glassmorphisme
Extras de conteneurs
Modèles
Duplicateur de messages/pages
