--- title: "Tarjeta multicolumna" slug: "text-columns-block" description: "Add lists of features, an about section, or a contact section on your home page using the text columns block. Each column includes an icon, a title, and a space for the description text." tags: ["Body blocks", "Customization"] updated: 2026-06-22T08:47:53Z published: 2026-06-22T08:47:53Z canonical: "docs.document360.com/text-columns-block" --- > ## Documentation Index > Fetch the complete documentation index at: https://docs.document360.com/llms.txt > Use this file to discover all available pages before exploring further. # Tarjeta multicolumna La sección de tarjetas multicolumna te permite mostrar el contenido en una estructura estructurada, una al lado de la columna, en la página principal de tu base de conocimiento. Cada columna incluye un icono, un título y una descripción, lo que te permite escanear visualmente varias piezas de información relacionadas a la vez, sin depender de párrafos largos o listas anidadas. Esto lo hace especialmente eficaz para mostrar características de productos, ofertas de servicios o categorías clave de documentación, donde los lectores necesitan comparar o navegar por opciones de un vistazo en lugar de leerlas secuencialmente. --- ## Cuándo usar la sección de tarjetas multicolumna - **Características destacadas** - Úsalo para mostrar las características clave de tu producto, cada una con un icono, un título corto y una descripción de una línea. Los lectores pueden entender rápidamente lo que ofrece el producto sin necesidad de leer párrafos largos. - **Navegación por categorías** - Presenta las secciones principales de la base de conocimiento como tarjetas, ofreciendo a los lectores una visión visual rápida de lo que está disponible y a dónde acudir. - **Secciones sobre o equipo** - Introduce áreas de equipo, departamentos u ofertas de servicios con un icono y una breve descripción para cada uno. - **Niveles de soporte o opciones de contacto** - Mostrar múltiples canales de soporte (por ejemplo, correo electrónico, chat, documentos) uno al lado del otro con iconos relevantes y breves descripciones. --- ## Cómo añadir una sección de tarjetas multicolumna 1. Navega a Configuración () en la barra de navegación izquierda del portal de la Base de conocimiento. 2. En el panel de navegación izquierdo, navega al Sitio de la base de conocimientos > **Personalización del sitio**. 3. Haz clic en **el botón Personalizar sitio** . ![Site customization page showing the Customize site button](https://cdn.document360.io/860f9f88-412e-4570-8222-d5bf2f4b7dd1/Images/Documentation/Customizing_Rich_text_Block.png) 1. Desde el desplegable de la izquierda, selecciona la página **principal** . La sección Cuerpo muestra la lista de bloques corporales. 2. Haz clic **en Añadir sección** y **selecciona sección de tarjeta multicolumna**. El bloque se añade con tres elementos predeterminados. 3. Haz clic en el **encabezado de la sección de la tarjeta Multicolumn** para editar el título de la sección y el color general del icono. 4. Haz **clic en Añadir elemento** para añadir más elementos de columna más allá de los tres por defecto. 5. Utiliza el icono **de Reordenar** () para reorganizar los elementos dentro de la sección. 6. Haz clic en el icono **Ocultar** () para activar la visibilidad de los elementos individuales. ![Home page builder showing a Multicolumn card section with three column elements and reorder/hide controls](https://cdn.document360.io/860f9f88-412e-4570-8222-d5bf2f4b7dd1/Images/Documentation/Adding_multicolumn_card_section.png) --- ## Cómo configurar los elementos de columna Haz clic en cualquier elemento de la sección para editar sus atributos: | Atributo | Lo que puedes configurar | | --- | --- | | **Icono** | Haz clic en **Cambiar** para seleccionar un icono de Document360 o [Font Awesome](https://fontawesome.com/icons) desde la pestaña **Iconos**, o sube/introduce la URL de una imagen personalizada en la pestaña **Imagen** | | **Título** | Introduce el título de la columna. Haz clic en el icono **Ocultar** () para ocultar el título sin borrarlo | | **Color de iconos** | Elige un color para el icono | | **Texto del párrafo** | Introduce y formatea la descripción de la columna usando negrita (), cursiva (), URL/Enlace (), lista no ordenada () o lista ordenada () | ![Column element settings panel showing Icon, Title, Icon color, and Paragraph text options](https://cdn.document360.io/860f9f88-412e-4570-8222-d5bf2f4b7dd1/Images/Documentation/Adding_multicolumn_card_section_options_for_elements.png) --- ## Cómo guardar y publicar - Utiliza el interruptor **de Vista previa** a la derecha para revisar tus cambios. - Haz clic **en Guardar** para guardar tus cambios. - Haz clic **en Publicar** para hacer cambios en directo. --- ## Vista del sitio de la base de conocimiento Aquí tienes un ejemplo de una sección de tarjetas multicolumna tal y como aparece en la página de la base de conocimientos. ![Knowledge base site showing a Multicolumn card section with icons, titles, and descriptions in a three-column layout](https://cdn.document360.io/6a41a4ec-dfe1-4f2d-9818-4fc3e2c85382/Images/Documentation/multicolumn%20card%20preview.png) --- ## Cómo eliminar una sección de tarjeta Multicolumn 1. Haz clic en **la sección de cartas Multicolumna** en la lista de bloques del cuerpo. Aparece la barra de navegación por secciones. 2. Haz clic **en Borrar** () en la barra de navegación. 3. Haz clic en **Sí** en el prompt de confirmación de Eliminar. 4. Después de eliminar, haz clic **en Guardar** para guardar como borrador, **en Visualizar** para revisar y **en Publicar** para hacer cambios en directo. ![Delete confirmation prompt for removing a Multicolumn card section from the home page](https://cdn.document360.io/860f9f88-412e-4570-8222-d5bf2f4b7dd1/Images/Documentation/Remove_multicolumn_card_section.png) --- ## Mejores prácticas - **Mantén las descripciones de las columnas breves** : una o dos frases por columna son lo mejor. Las descripciones largas rompen el equilibrio visual de la disposición de las cartas. - **Usa estilos de iconos consistentes** : mezclar iconos rellenos, contorneados y personalizados en la misma sección parece inconsistente. Elige un estilo y mantente fiel a él. - **Usa tres o cuatro columnas** : más de cuatro columnas en una pantalla estándar hace que cada tarjeta sea demasiado estrecha para leerla cómodamente. - **Haz coincidir el color de los iconos con tu marca** : la configuración de color de iconos se aplica a todos los iconos de la sección, así que elige un color que complemente el color de marca de tu sitio. - **Utiliza imágenes cuadradas si subes iconos personalizados** : las imágenes que no son cuadradas pueden parecer distorsionadas. Las dimensiones recomendadas son 30×30px o 50×50px. --- ## Preguntas frecuentes **¿Cómo actualizo el icono de un elemento de columna usando Font Awesome?** Navega a {{variable. Configuración}} () > {{variable. Base de conocimiento sitio}} > **Personalización del sitio** y haz clic **en Personalizar sitio**. Desde el desplegable de la izquierda, selecciona la página **principal** . Haz clic en el elemento deseado en la **sección de tarjetas Multicolumna**. Haz clic **en Cambiar** en la configuración de iconos. Expande el **acordeón Font Awesome** e introduce el nombre de clase del icono deseado. Por ejemplo, para el código `<i class="fa-solid fa-files"></i>`icono , el nombre de clase a introducir es `fa-solid fa-files`.