Los recuadros de servicios suelen denominarse recuadros de características. Se utilizan para destacar los servicios clave que ofrecen su producto y su empresa. Los cuadros de servicios suelen incluir imágenes, iconos, títulos y breves descripciones para que tengan sentido.
Aunque Tableberg es un plugin constructor de tablas, puede utilizarlo para varios proyectos de diseño web, como cajas de servicio atractivas. Este post'll tutorial le mostrará cómo agregar cajas de servicio en WordPress con una guía fácil.
Si no tienes el plugin Tabelberg en tu sitio, consíguelo haciendo clic en los botones del banner de abajo.
Cree bonitas mesas
Con el editor de bloques
Paso 01: Crear filas y columnas
Añada el Bloque Tableberg al editor pulsando el botón icono más (+).
Next, establecer el número de filas y columnas para crear sus cuadros de servicio. Como vamos a crear cuatro cuadros de servicio, hemos seleccionado 2*2 filas y columnas.
Paso 02: Añadir contenido a una celda
Necesitamos tres tipos de elementos en nuestros cuadros de servicio. Son iconos, párrafos y botones. Empecemos a añadirlos.
Color de fondo de la tabla
Es bueno añadir un color de fondo para la tabla desde el principio. Porque hay que determinar el color de los demás elementos de la celda en función del color de fondo.
Seleccione el icono Tableberg en la barra de herramientas. Vaya al menú Ficha Estilos. Verá las opciones de Color de fondo en la sección Color. Elija los colores adecuados.
Icono a la celda
Tableberg te permite añadir varios bloques al igual que el editor Gutenberg. Haga clic en el botón icono más (+) y añada el Bloque de iconos a la célula.
Ven al Ficha Configuración. Tendrás opciones para cambiar el tamaño del icono, rotación, y icono. Ahora, seleccione un icono que va con su tipo de servicio para la celda en particular.
Ir a la Ficha Estilos. Verá las opciones para cambiar el color de su icono. Lo hemos hecho blanco.
Nombre del servicio
Necesita el Bloque de párrafos para escribir el nombre del servicio.
Después de añadir el bloque Párrafo, escribir un nombre de servicio para la celda. En la barra lateral derecha, colorear el nombre del servicio y fijar su tamaño.
Descripción del servicio
Al igual que en el método anterior, escriba una descripción del servicio utilizando el bloque Párrafo.
Botón CTA
Un servicio está incompleto sin un botón CTA. Así que.., añadir un botón CTA a la célula por pulsando el icono más (+).
Ahora, personaliza el color de fondo, color del texto, y efecto hover para el botón que desee.
Paso 03: Añadir espacio entre bloques
Debe añadir espacios entre los elementos de la celda para eliminar la congestión. Para ello, seleccionar toda la celda.
A continuación, vaya a la página Ficha Estilos. Desplazándose hacia abajo en la pestaña, llegar a la Relleno de celdas y Espacio entre celdas opciones.
Estableciendo valores en estas dos opciones, puede añadir espacio entre los elementos de la celda.
Paso 04: Añadir contenido a las otras celdas
Tableberg tiene una interesante función en la barra de herramientas que te permite duplicar al instante filas y columnas de la tabla.
Haga clic en el botón Icono [Pro] Editar tabla en la barra de herramientas. A continuación, seleccione el botón Duplicar esta fila opción.
Esto creará una columna en blanco. Borrar la columna ya que no es necesario.
Ahora, utilizando el Icono [Pro] Editar tablaseleccione Duplicar esta columna opción.
Entonces, las casillas de servicio están listas. Por lo tanto, puede duplicar celdas, filas y columnas de una tabla con el plugin Tableberg.
Paso 05: Añadir espacios entre cuadros de servicio
Seleccione todo el bloque de la tabla mediante pulsando el icono Tableberg en la barra de herramientas.
Ir a la Ficha Estilos. Desplácese por la pestaña y llegue a Espacio entre celdas. Con esta opción, puede crear huecos entre los cuadros de servicio.
Paso 06: Ocultar los bordes de los cuadros de servicio
Ahora, para ocultar los bordes de la caja, vaya a la pestaña Estilos. De nuevo, desplácese hacia abajo por la pestaña y llegue a la sección Sección fronteriza.
Desactivar las opciones [PRO] Borde sólo fila y Ocultar celda fuera de bordes.
Así, sus cajas de servicio están listas. Si lo desea, puede hacer que sus cuadros de servicio sean más atractivos con una mayor personalización. Para saber más sobre cómo personalizar los cuadros Tableberg, explore nuestra documentación.
Conclusión
Tableberg no es sólo un plugin constructor de tablas. Es una herramienta versátil que puede utilizar para sus diversos proyectos de diseño web y creación de contenidos. Espero que hayas disfrutado el tutorial de arriba a abajo.
Si hay alguna confusión en relación con el post de hoy, deja tu comentario a continuación. Nuestro equipo de asistencia le responderá muy pronto.
Lea también:
