Boîte à rabat

Le widget Flip Box vous aide à créer des boîtes animées qui se retournent de l’autre côté une fois que les utilisateurs agissent. Vous pouvez créer une boîte à bascule Elementor en cliquant et en survolant les deux. Vous pouvez personnaliser les deux côtés de la flip box à l'aide de ce widget.

Note: Vous devrez installer Elementor et ElementsKit pour suivre le processus. Si vous avez besoin d'aide pour installer et activer ElementsKit Pro, consultez le Guide d'installation d'ElementsKit.

Comment ajouter la flip box au site WordPress à l'aide d'ElementsKit #

Suivez les étapes décrites ci-dessous pour ajouter facilement une flip box à votre site WordPress à l'aide d'ElementsKit et Élémentor:

Étape 1 : Activer le widget Flip Box #

Aller vers ElementsKit ⇒ widgets ⇒ widget flip box, allumer le widget, et cliquez sur Enregistrer les modifications.

activer le widget flip box d'elementskit

Étape 2 : Faites glisser et déposez le widget  #

Modifiez la page avec l’option Modifier avec Elementor. Alors recherche pour le widget flip box avec l'icône Ekit et simplement faites glisser et déposez le widget sur la page.

glisser-déposer le widget flip box d'elementskit

Étape 3. Personnalisez les paramètres  #

Développez le menu Flip box pour modifier les paramètres suivants :

  • Retourner: Vous disposez de quatre options pour retourner : retourner, zoomer, glisser et 3D.
  • Direction de retournement : Plusieurs options sont disponibles pour la direction d'inversion. Cependant, l'option apparaîtra en fonction de la valeur que vous sélectionnez pour l'option Retourner.
  • Déclencheur à bascule : Ici, vous pouvez choisir l'option qui déclenchera le flip. Trois options sont disponibles : survol, clic sur la boîte et clic sur un bouton.
  • Hauteur de la boîte rabattable : Vous pouvez ajuster la hauteur de la flip box à l’aide de cette option.
kit d'éléments de paramètres de boîte à rabat

Sous Flip box height, vous trouverez deux onglets FRONT et BACK. Sélectionnez l’une des options pour personnaliser les éléments de la flip box pour chaque côté. Vous retrouverez la même option des deux côtés. 

Les options que vous pouvez personnaliser pour chaque côté de la flip box incluent : 

  • Type de support: Vous pouvez choisir une icône ou une image. Vous pouvez également choisir l'option Aucun si vous ne souhaitez ajouter aucun fichier multimédia..
  • Icône/Choisir le fichier : En fonction de l'option que vous choisissez pour le type de média, vous pouvez choisir l'icône/l'image ici
  • Titre: Donnez un titre.
  • Sous-titre: Vous pouvez ajouter un sous-titre ici.
  • Description à retourner : Rédigez une description pertinente en utilisant cette option.
  • Alignement: Vous pouvez définir l’alignement à gauche, au centre ou à droite.
face avant de la boîte à rabat

Une fois que vous avez fini de préparer le contenu des deux côtés de votre flip box, il est temps de modifier le style. 

Étape 4 : Stylisez votre flip box #

Passez maintenant à l'onglet Style et développez chacune des sections pour modifier les options de style associées :

Emballage : Sous le wrapper, vous pouvez personnaliser le type d'arrière-plan, la couleur, l'emplacement, la deuxième couleur, l'emplacement, le type, l'angle, etc. Vous pouvez personnaliser les options pour le recto et le verso de la flip box.

paramètres d'emballage de la flip box

Icône: Si vous développez cette option, vous pouvez modifier la couleur, le type d'arrière-plan, l'ombre de la boîte, le type de bordure, etc. pour la vue normale et la vue survolée. Vous pouvez personnaliser le style de l’icône à la fois pour l’avant et l’arrière de la flip box.

Paramètres de la boîte à rabat de style d'icône

Titre: Ici, vous pouvez personnaliser la typographie, la couleur du titre et la marge du titre des deux côtés de la flip box.

paramètres de la zone d'inversion du style de titre

Sous-titre: Développez cette option pour personnaliser la typographie, la couleur du titre et la marge du sous-titre des deux côtés de la flip box.

Description: Ici, vous pouvez personnaliser la typographie, la couleur de la description et la marge de la description des deux côtés de la flip box.

paramètres de la boîte à rabat du style de description

Bouton: Développez la section des boutons pour personnaliser la couleur du texte, la couleur d'arrière-plan, le type de bordure, le rayon de bordure, la zone de bordure et bien d'autres options. Vous pouvez styliser le bouton pour les vues normales et survolées.

paramètres de la boîte à rabat de style de bouton

Enfin, cliquez sur publier/mettre à jour pour enregistrer les modifications et prévisualiser votre flip box Elementor :

aperçu du kit d'éléments de boîte à rabat
Quels sont tes sentiments
Mis à jour le 29 novembre 2022