Cómo crear un cuadro de imagen usando ElementsKit

¿Quiere deshacerse del estilo aburrido de mostrar imágenes en su sitio web de WordPress? Pruebe la plantilla de cuadro de imagen de ElementsKit. 

Ofertas de ElementsKit (un complemento completo de Elemetor) 19 plantillas de cuadros de imágenes diferentes para mostrar imágenes con varios efectos y animaciones. Además, puedes incluir texto, encabezados, botones, URL, íconos y muchos más. 

Todos estos elementos son totalmente personalizables. Además, puede eliminar o incluir cualquier elemento de Elementor con las plantillas de cuadros de imágenes de ElementsKit. 

✨✨ Complementos requeridos: 
👉👉 Elementor: Descargar el complemento Elementor 
👉👉Kit de elementos: Descargar el complemento ElementsKit 

Crear un cuadro de imagen usando ElementsKit #

  • Crea una nueva publicación/página o abre una interesante con Elementor 
  • Clickea en el Icono de ElementsKit 
  • Elegir el “Cuadro de imagen” de la categoría 
Seleccione la categoría del cuadro de imagen
  • Puedes ver 19 plantillas diferentes (11 gratis, 8 premium) para el cuadro de imágenes
  • Clickea en el signo más (+) para ver la vista previa 
insertar plantilla de cuadro de imagen
  • Hacer clic en "Insertar"
  • Aparecerá en tu página/publicación. 
  • Ahora puedes editar los estilos y otras propiedades de la plantilla del cuadro de imagen.
  • Después de la personalización, haga clic en "Publicar"
Cómo crear un cuadro de imagen usando ElementsKit

Personalice la plantilla de cuadro de imagen de ElementsKit #

Desde la barra lateral izquierda, puedes personalizar el diseño del cuadro de imagen, el contenido y los estilos de cada elemento. Además, puede realizar una personalización avanzada para un solo elemento o todo el diseño desde la configuración avanzada. 

Personalización del diseño  #

  • Seleccione el ancho del contenido (en caja o ancho completo)
  • Establecer ancho personalizado 
  • Personalice el espacio entre columnas, la altura, la alineación vertical y el desbordamiento 
  • Activar/desactivar la sección de estiramiento 
Personalización del diseño del cuadro de imagen de ElementsKit 

Personalización de contenido  #

👉 Imagen 

  • cambiar la imagen 
  • Personaliza el tamaño de la imagen
  • Establecer el área de contenido 
  • Activar o desactivar la misma altura 
  • Activar o desactivar URL 

👉 Cuerpo 

  • Cambiar el texto del título
  • Personaliza la etiqueta HTML del título
  • Establecer la alineación del título 

👉 Botón

  • Activar o desactivar el botón 
  • Personaliza el texto de la etiqueta del botón 
  • Agregar URL
  • Agregar/eliminar icono 
  • Establecer la posición del icono 
Personalización del contenido del cuadro de imagen de ElementsKit 

Personalización de estilo  #

👉 Línea de sombra 

  • Seleccione la línea de sombra izquierda o derecha
  • Establecer ancho personalizado 
  • Personaliza la sombra del cuadro 
  • Personaliza el tipo de fondo y el color. 
  • Establecer imagen de fondo 

👉 Imagen 

  • Establecer radio de borde personalizado, relleno 
  • Personaliza la opacidad de la imagen para un estilo normal o flotante 

👉 Cuerpo 

  • Establecer tipo de borde, radio de borde
  • Personaliza la imagen de fondo, el tipo y el color 
  • Establecer relleno personalizado, color de sombra del cuadro 
  • Establecer espacio entre títulos, tipografía y color. 

👉 Botón 

  • Personalizar el valor de relleno y el tamaño de fuente del icono 
  • Cambiar el texto del botón y el color de fondo 
  • Establecer propiedades normales o flotantes 
  • Establecer tipo de borde, radio de borde, sombra de cuadro 

Personalización avanzada  #

  • Personalice el margen, el relleno, el ancho, la posición y el índice z del diseño
  • Establezca efectos de movimiento para elementos (por ejemplo, aparición gradual, acercamiento hacia arriba, rebote, deslizamiento hacia la izquierda, etc.)
  • Personaliza la capacidad de respuesta y los atributos. 
  • Inserte CSS personalizado para modificaciones adicionales 

Con suerte, ahora puede mostrar las imágenes de su sitio web de formas más interesantes utilizando las plantillas de cuadros de imágenes de ElementsKit. Y no dudes en hacernos cualquier consulta o compartir tus sugerencias con nosotros.

cuales son tus sentimientos
Actualizado el 28 de enero de 2024