Passer au contenu principal




Les Boîte à flip de widget vous aide à créer des cadres animés qui se retournent une fois que le visiteur les passe.



Le contenu

De face

Le contenu

Cet onglet contrôle le contenu de l'avant de la boîte pliante.

  1. Élément graphique: Choisissez parmi Aucun, Image ou Icône pour afficher un élément graphique devant la liste déroulante
  2. Si Image est sélectionné comme élément graphique:
    Choisissez une image: Sélectionnez ou téléchargez une image
    Taille de l'image: Définir la taille de l'image, de la miniature à la pleine, ou définir une taille personnalisée
  3. Si Icon est sélectionné comme élément graphique:
    Icône: Sélectionnez une icône dans la bibliothèque FontAwesome
    Regarder: Choisissez la vue par icônes par défaut ou sélectionnez Empilé ou Encadrement
    Façonner: Si Empilé ou Encadré est choisi, choisissez Cercle ou Carré
  4. description du titre: Choisissez le titre et la description qui apparaissent au début de la liste déroulante

Antécédents

Cet onglet contrôle le bas de l'avant de la boîte pliante.

Type de fonds: Elija Color, Imagen o Dégradé como fondo de la parte frontal del cuadro desplegable.

Si vous choisissez un Arrière-plan, les options suivantes seront disponibles:

  1. Positionner: Sélectionnez la position de l'image, telle que En haut au centre, en haut à droite, au centre au centre, etc.
  2. Attachement: Sélectionnez par défaut, défilement ou fixe
  3. Répéter: Choisissez parmi Par défaut, Ne pas répéter, Répéter, Répéter-x ou Répéter-y
  4. Taille: Sélectionnez par défaut, Automatique, Couverture ou Contient
  5. Superposition d'arrière-plan: Choisissez une couleur pour la superposition

Si tu choisis Fond dégradé, les options suivantes seront disponibles:

  1. Couleur: Sélectionnez la couleur principale du dégradé
  2. Emplacement: Sélectionnez l'emplacement de la couleur primaire
  3. Deuxième Couleur: Sélectionnez la deuxième couleur du dégradé
  4. Emplacement: Sélectionnez l'emplacement de la deuxième couleur
  5. Type: Choisissez Linéaire ou Radial
  6. Angle: Définit l'angle du dégradé

Dos

Le dos de la boîte pliante présente les mêmes éléments que le devant mentionné ci-dessus, à l'exception de l'élément graphique qui n'apparaît que sur le devant. Le dos comprend également un bouton.

  1. Bouton de texte: Choisissez le texte qui apparaît à l'intérieur du bouton
  2. Relier: Elija a dónde apunta el botón. El enlace debe incluir la URL completa (incluido http / https)
  3. Appliquer le lien dans: Choisissez d'appliquer le lien cliquable au bouton uniquement ou au plein cadre

Paramètres

  1. Hauteur: Contrôlez la hauteur de la boîte pliante
  2. Rayon du bord: Définir le rayon du bord de la boîte pliante et arrondir ses coins
  3. Effet Flip: Choisissez parmi les effets de retournement, y compris les effets de retournement, de glissement, de déplacement, de zoom avant, de zoom arrière ou d'atténuation
  4. Inverser la direction: Si vous choisissez des effets de retournement ou de diapositive, vous pouvez faire basculer la boîte à bascule vers la droite, la gauche, le haut ou le bas
  5. Profondeur 3D: Faites glisser sur Activé pour donner à la liste déroulante un effet d'animation 3D

Nota: El le navigateur Safari es parcialmente incompatible con el efecto de profundidad 3D en dispositivos móviles. Si se utiliza la profundidad 3D, es posible que algunas partes del cuadro desplegable se muestren a través del menú desplegable de navegación. No es posible utilizar el widget 3D Flip Box y el widget Nav Menu con IOS debido a problemas con Safari que no admite esta opción. Aconsejamos modificar el contenido para móviles en este caso con la opción «ocultar sección» en la pestaña Avanzado de la sección en Réactif> Visibilité.


Style

Face avant

  1. Farci: Ajoutez un rembourrage à la zone de contenu à l'avant de la boîte pliante
  2. Alignement: Choisissez d'aligner le contenu de la liste déroulante à gauche, à droite ou au centre de la liste déroulante
  3. Position verticale: Aligne le contenu de la liste déroulante avec le haut, le centre ou le bas de la liste déroulante
  4. Type de bordure: Définit une bordure pour l'ensemble de la liste déroulante
  5. Largeur: Si un type de bordure est choisi, définissez une largeur pour la bordure
  6. Couleur: Si un type de bordure est choisi, sélectionnez une couleur de bordure

Icône

  1. Espacement: Contrôle l'espace entre l'icône et le titre
  2. Couleur primaire: Choisissez la couleur principale de l'icône
  3. Couleur secondaire: Choisissez la couleur secondaire de l'icône
  4. Taille de l'icône: Choisissez la taille de l'icône
  5. Remplissage d'icône: Définit la quantité de remplissage autour de l'icône
  6. Icône de rotation: Faire pivoter l'icône à n'importe quel angle
  7. Largeur de la bordure: Définit la largeur de la bordure de l'icône
  8. Rayon du bord: Définit le rayon de la bordure de l'icône pour contrôler l'arrondi des coins

Photo

  1. Espacement: Contrôle l'espace entre l'image et le titre
  2. Opacité: Choisissez l'opacité de l'image
  3. Type de bordure: Choisissez une bordure d'image: Aucune, Solide, Double, Pointillée, Pointillée ou Rainure
  4. Rayon du bord: Contrôle le rayon de la bordure de l'image

Qualification

  1. Espacement: Contrôlez l'espace entre le titre et la description
  2. Couleur du texte: Choisissez la couleur du titre
  3. Typographie: Définir les paramètres de police du titre

La description

  1. Couleur du texte: Choisissez la couleur de la description
  2. Typographie: Définissez les paramètres de police pour la description

Face arrière

Pour l'arrière de la liste déroulante, vous obtenez toutes les options répertoriées ci-dessus pour l'avant, moins les paramètres de l'élément graphique. Vous avez également le contrôle sur les paramètres des boutons.

Bouton

  1. Taille: Choisissez une taille de bouton (très petit, petit, moyen grand et très grand)
  2. Typographie: Personnalisez la police du texte du bouton
  3. Texte Couleur: Choisissez la couleur du texte du bouton
  4. Couleur de l'arrière plan: Choisissez la couleur d'arrière-plan du bouton
  5. Couleur de la bordure: Contrôle la couleur de la bordure du bouton
  6. Largeur de la bordure: Contrôle la largeur de la bordure du bouton
  7. Rayon du bord: Contrôle le rayon de la bordure du bouton

Avancée

Définissez les options avancées applicables à ce widget

Lire l'article de lancement complet sur le widget Flip Box