Widget Flip Box (Pro)

los Widget Flip Box le ayuda a crear cuadros animados que se voltean hacia el otro lado, una vez que el visitante pasa sobre ellos.

Contenido

Frente

Contenido

Esta pestaña controla el contenido de la parte frontal de la caja plegable.

1. Elemento gráfico: Elija entre Ninguno, Imagen o Icono para mostrar un elemento gráfico en la parte frontal del cuadro desplegable
2. Si se selecciona Imagen como elemento gráfico:
   Elegir imagen: Seleccione o cargue una imagen
   Tamaño de la imagen: Establece el tamaño de la imagen, de miniatura a completa, o establece un tamaño personalizado
3. Si se selecciona Icono como elemento gráfico:
   Icono: Seleccione un icono de la biblioteca FontAwesome
   Ver: Elija la vista de icono predeterminada o seleccione Apilado o Enmarcado
   Forma: Si se elige Apilado o Enmarcado, elija Círculo o Cuadrado
4. Descripción del Título: Elija el título y la descripción que aparecen en el frente del cuadro desplegable

Antecedentes

Esta pestaña controla el fondo de la parte frontal de la caja plegable.

Tipo de fondo: Elija Color, Imagen o Degradado como fondo de la parte frontal del cuadro desplegable.

Si eliges un Fondo de imagen, las siguientes opciones estarán disponibles:

1. Posición: Seleccione la posición de la imagen, como Centro superior, Superior derecho, Centro central, etc.
2. Adjunto archivo: Seleccione entre Predeterminado, Desplazamiento o Fijo
3. Repetir: Elija entre Predeterminado, No repetir, Repetir, Repetir-x o Repetir-y
4. Talla: Seleccione entre Predeterminado, Automático, Cubierta o Contener
5. Superposición de fondo: Elija un color para la superposición

Si usted elige Fondo degradado, las siguientes opciones estarán disponibles:

1. Color: Seleccione el color primario del degradado
2. Ubicación: Seleccione la ubicación del color primario
3. Segundo Color: Seleccione el segundo color del degradado
4. Ubicación: Seleccione la ubicación del segundo color
5. Tipo: Elija Lineal o Radial
6. Ángulo: Establece el ángulo del degradado

Espalda

El reverso de la caja plegable tiene los mismos elementos que el anverso mencionado anteriormente, excepto por el elemento gráfico que solo aparece en el anverso. La parte trasera también incluye un botón.

1. Botón de texto: Elige el texto que aparece dentro del botón
2. Enlace: Elija a dónde apunta el botón. El enlace debe incluir la URL completa (incluido http / https)
3. Aplicar enlace en: Elija aplicar el enlace en el que se puede hacer clic solo al botón o al cuadro completo

Configuraciones

1. Altura: Controla la altura de la caja plegable
2. Radio de borde: Establezca el radio del borde de la caja plegable y redondee sus esquinas
3. Efecto Flip: Elija entre efectos de volteo, que incluyen voltear, deslizar, empujar, acercar, alejar o atenuar
4. Voltear dirección: Si elige los efectos de voltear o deslizar, puede hacer que el cuadro de volteo se voltee hacia la derecha, izquierda, arriba o abajo
5. Profundidad 3D: Desliza a Activado para darle al cuadro desplegable un efecto de animación 3D

Nota: El navegador 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 Responsive> Visibilidad.

Estilo

Lado delantero

1. Relleno: Agregue relleno al área de contenido del frente de la caja plegable
2. Alineación: Elija alinear el contenido del cuadro desplegable a la izquierda, a la derecha o al centro del cuadro desplegable
3. Posición vertical: Alinea el contenido del cuadro desplegable con la parte superior, central o inferior del cuadro desplegable
4. Tipo de borde: Establece un borde para todo el cuadro desplegable
5. Anchura: Si se elige un tipo de borde, establezca un ancho para el borde
6. Color: Si se elige un tipo de borde, seleccione un color para el borde

Icono

1. Espaciado: Controla el espacio entre el icono y el título
2. Color primario: Elija el color primario del icono
3. Color secundario: Elige el color secundario del icono
4. Tamaño de ícono: Elige el tamaño del icono
5. Relleno de iconos: Establece la cantidad de relleno alrededor del icono
6. Girar icono: Gira el icono en cualquier ángulo
7. Ancho del borde: Establece el ancho del borde del icono
8. Radio de borde: Establece el radio del borde del icono para controlar la redondez de las esquinas

Imagen

1. Espaciado: Controla el espacio entre la imagen y el título
2. Opacidad: Elige la opacidad de la imagen
3. Tipo de borde: Elija un borde para la imagen: Ninguno, Sólido, Doble, Punteado, Punteado o Surco
4. Radio de borde: Controla el radio del borde de la imagen

Título

1. Espaciado: Controla el espacio entre el título y la descripción
2. Color de texto: Elige el color del título
3. Tipografía: Establecer la configuración de tipografía del título

Descripción

1. Color de texto: Elige el color de la descripción
2. Tipografía: Establecer la configuración de tipografía de la descripción

Lado trasero

Para la parte posterior del cuadro desplegable, obtiene todas las opciones enumeradas anteriormente para la parte frontal, menos la configuración del elemento gráfico. También tienes control sobre la configuración de los botones.

Botón

1. Talla: Elija un tamaño para el botón (extra pequeño, pequeño, mediano grande y extra grande)
2. Tipografía: Personaliza la tipografía del texto del botón
3. Texto Color: Elige el color del texto del botón
4. Color de fondo: Elige el color del fondo del botón
5. Color del borde: Controla el color del borde del botón
6. Ancho del borde: Controla el ancho del borde del botón
7. Radio de borde: Controla el radio del borde del botón

Avanzado

Establecer las opciones avanzadas que son aplicables a este widget

Lea la publicación de lanzamiento completa sobre el widget Flip Box