Cómo agregar contenido a múltiples columnas en WordPress (no se requiere HTML)

¿Quiere agregar contenido de varias columnas en sus publicaciones de WordPress? Las columnas se pueden utilizar para crear diseños llamativos para sus publicaciones y páginas.

Los medios impresos tradicionales, como periódicos y revistas, han utilizado diseños de varias columnas desde los albores de la impresión. Su objetivo era facilitar a los usuarios la lectura de textos más pequeños mientras utilizaban el espacio disponible de forma económica.

Los diseños de una sola columna se utilizan con mayor frecuencia en la Web. Sin embargo, las cuadrículas de varias columnas siguen siendo útiles para resaltar el contenido y facilitar su lectura y escaneo.

En este artículo, le mostraremos cómo agregar fácilmente contenido de varias columnas a sus publicaciones de WordPress sin escribir ningún código HTML.

Agregar contenido a múltiples columnas en WordPress: la forma más fácil

Crear contenido de varias columnas, también conocido como contenido de columna de cuadrícula en WordPress, ahora es fácil porque está disponible como característica predeterminada. El nuevo editor de bloques de WordPress Gutenberg incluye un bloque de columnas.

Para agregar un diseño de varias columnas, debe crear un artículo nuevo o editar uno existente. Una vez que esté en el área de edición de publicaciones, haga clic en el icono “Agregar” en la parte superior para agregar un bloque.

A continuación, debe seleccionar el bloque “Columnas” ubicado en la pestaña “Elementos de diseño”.

Agregue un bloque de columnas en su publicación de WordPress

Ahora verá que el cursor del mouse salta a la columna de la izquierda y aparecerá un marcador de posición de texto en la columna de la derecha.

Las columnas bloquean WordPress en WordPress agregado a la publicación

Como puede ver en la captura de pantalla anterior, el bloque Columnas al principio parece un área en blanco. Si desplaza el mouse hacia la izquierda, puede ver el borde del bloque resaltado.

También podrá ver la configuración del bloque en la columna derecha de la pantalla de edición de publicaciones.

Bloque de columnas de WordPress - 2 columnas

De forma predeterminada, el bloque de columnas agrega dos columnas. Puede aumentar la cantidad de columnas que desea agregar desde la configuración del bloque a la derecha. Le permite agregar hasta seis columnas en una sola fila.

Agregue más columnas a sus columnas

Simplemente haga clic en una columna y comience a escribir para agregar contenido. Puede utilizar la tecla Tab de su teclado para pasar a la siguiente columna.

Agregue texto en sus columnas de WordPress

Agregar medios y otro contenido a las columnas

Además del contenido de texto, también puede agregar imágenes e incrustar videos en columnas de WordPress.

El bloque de columna le permite agregar bloques dentro de cada columna. Simplemente pase el mouse sobre una columna y verá el ícono “Agregar nuevo bloque” dentro de ella. También puede agregar un bloque escribiendo / seguido del nombre del bloque.

Agregar un nuevo bloque en las columnas de WordPress

El bloque seleccionado ahora se mostrará dentro de la columna. Ahora puede continuar y agregarle contenido.

Bloque de imagen agregado a WordPress

Así es como podría verse su nueva columna en el tema predeterminado Twenty Nineteen. En este ejemplo, estamos usando tres columnas y la última columna contiene una imagen.

3 columnas en la publicación de WordPress - Vista previa

Si solo desea agregar una imagen y algo de texto junto a ella, también puede usar el bloque “Medios y texto” en lugar de columnas. Este bloque en particular fue creado específicamente para mostrar contenido multimedia como imágenes y videos junto con un texto.

Agregue soporte y bloque de texto en WordPress

Agregar más columnas en el antiguo editor clásico de WordPress

En caso de que no haya actualizado su WordPress a Gutenberg y todavía esté usando el editor clásico, deberá instalar un plugin por separado para crear un diseño de columna de cuadrícula.

Primero, instale y active el archivo Columnas de cuadrícula ligeras conectar. Para obtener instrucciones detalladas, siga nuestra guía paso a paso sobre cómo instalar un plugin en WordPress.

Después de la activación, puede crear un mensaje nuevo o abrir un mensaje antiguo para editarlo. Luego, haga clic en el botón “Agregar columnas” de la barra de herramientas del editor visual.

Agregar icono de columnas

Ahora verá una ventana emergente para agregar su primera columna. Puede elegir la cantidad de área que puede cubrir su columna, en computadoras de escritorio, tabletas y dispositivos móviles de manera diferente.

Por ejemplo, si establece el porcentaje de cuadrícula del escritorio en 50%, su columna cubrirá la mitad de la fila.

Porcentaje de ancho de cuadrícula: columnas de cuadrícula ligeras

Hay muchas opciones para configurar el ancho de la columna, del 5% al ​​100% en el rango de 5. Puede elegir una haciendo clic en el menú desplegable.

Opciones de ancho de columna: porcentajes de cuadrícula

A continuación, debe agregar el contenido de la columna al cuadro “Contenido” y luego hacer clic en el botón “Aceptar” para insertarlo en el mensaje.

Agregue contenido a su columna: plugin Lightweight Grid Columns

El plugin ahora generará el código corto requerido con su contenido y lo agregará a su editor de publicaciones.

Código corto y contenido agregado a la columna de WordPress

Ahora que ha agregado su primera columna, puede repetir el proceso para agregar más columnas. Para la última columna de la fila, no olvide marcar la casilla “Última columna de la fila”.

Código corto y contenido para 2 columnas en WordPress

Después de eso, puede guardar su publicación y obtener una vista previa. Así es como se veía en nuestro sitio de prueba usando el tema Twenty Seventeen.

Dos columnas de WordPress en el tema Twenty Seventeen

Esperamos que este artículo le haya ayudado a aprender cómo agregar columnas a sus publicaciones y páginas de WordPress. También puede consultar nuestra guía sencilla sobre cómo alinear fácilmente imágenes en publicaciones de WordPress.

¿Te ha resultado útil??

0 / 0

Deja una respuesta 0

Tu dirección de correo electrónico no será publicado. Required fields are marked *