¿Desea agregar contenido de varias columnas a sus publicaciones de WordPress?
Las columnas se pueden usar para crear Diseños atractivos para sus publicaciones y páginas..
Los medios impresos tradicionales, como periódicos y revistas, han utilizado un diseño de varias columnas desde los primeros días de la impresión. Su objetivo era permitir usuarios Es más fácil leer un texto más pequeño mientras se utiliza el espacio disponible de forma económica.
Si aún no has creado un sitio web o un blog en WordPress, te invitamos a consultar Cómo instalar un blog en WordPress en 7 pasos a continuación, ¿Cómo encontrar, instalar y activar un tema de WordPress en tu blog
Los diseños de una sola columna se utilizan con más frecuencia en la web. sin embargo, el rejillas con varias columnas siguen siendo útiles para resaltar el contenido y facilitar la lectura y el análisis.
En este tutorial, 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 de varias columnas en WordPress: la solución fácil
Crear contenido de varias columnas, también conocido como contenido de cuadrícula en WordPress, ahora es fácil porque es una característica predeterminada. los nuevo editor de bloques de WordPress Gutenberg propone un bloque de columnas.
Para agregar un diseño de varias columnas, debe crear una nueva publicación o editar una. Una vez en el área de edición, haga clic en " Añadir En la parte superior para agregar un bloque.
Luego tienes que seleccionar el bloque Columnas "Ubicado en la pestaña" Elementos de diseño ".
Verá que el puntero del mouse salta en la columna izquierda y aparecerá un marcador de posición para el texto en la columna derecha.
Como puede ver en la captura de pantalla anterior, el bloque Columnas al principio parece ser un área vacía. Si desplaza el mouse hacia la izquierda, puede ver el borde del bloque resaltado.
También podrá ver los parámetros del bloque en la columna derecha de la pantalla.
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. Esto le permite agregar hasta seis columnas en una sola fila.
Simplemente haga clic en una columna y comience a escribir para agregar contenido. Puede usar la tecla Tab de su teclado para pasar a la siguiente columna.
Agregar contenido multimedia y otro contenido a sus 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 coloque el mouse sobre una columna y verá el "Agregar un nuevo bloque" al interior. También puede agregar un bloque ingresando el nombre del bloque.
Su bloque seleccionado aparecerá en la columna. Puedes ir allí y agregar contenido.
Para cargar - cargar - sus medios, descubra nuestro artículo sobre Cómo cargar tus medios masivos en WordPress
Así es como se vería su nueva columna en el tema de WordPress por defecto veinte diecinueve. En este ejemplo estamos usando tres columnas y la última columna contiene una imagen.
Si solo desea agregar una imagen y texto a un lado, también puede usar el bloque Medios y texto En lugar de columnas. Este bloque está diseñado específicamente para mostrar medios como imágenes y videos al lado del texto.
Adición de varias columnas en el editor clásico de WordPress
Si no ha actualizado WordPress a Gutenberg y todavía está usando eleditor clásiconecesita instalar un complemento separado para crear un diseño de cuadrícula de columnas.
Comience instalando y activando el complemento Columnas de rejilla ligeras.
Para obtener instrucciones detalladas, siga nuestra guía paso a paso sobre cómo instalar un complemento en WordPress.
Tras la activación, puede crear un mensaje nuevo o abrir un mensaje antiguo para editarlo. Luego haga clic en " Agregar columnas En la barra de herramientas del editor visual.
Ahora verá una ventana emergente que le permite 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.
Ve más allá descubriendo Cómo crear un ancho de página completa en WordPress
Por ejemplo, si establece el porcentaje de cuadrícula de escritorio 50%, su columna cubrirá la mitad de la línea.
Tiene muchas opciones para establecer el ancho de su columna, desde 5% a 100% con un intervalo 5. Puede elegir uno haciendo clic en el menú desplegable.
Luego, debe agregar el contenido de su columna en el área "Contenido", luego haga clic en el botón "Aceptar" para insertarlo en su publicación.
El complemento generará el código corto requerido con su contenido y lo agregará a su editor de publicaciones.
Descubre en este tutorial Cómo instalar y configurar el plugin WP Super Cache para mejorar el rendimiento de tu blog.
Ahora que ha agregado su primera columna, puede repetir el proceso para agregar más columnas. Para la última columna, no olvide marcar la casilla 'Última columna de la línea'.
Después de eso, podrá guardar su vista previa y vista previa. Así es como se ve en nuestro sitio web de prueba Twenty Seventeen.
Si también desea encontrar temas de WordPress que pueden ayudarlo a crear columnas en sus páginas o publicación, aquí hay temas de 3 WordPress producto de más alta calidad. Perfecto para esta tarea.
1. TheGem
Hay una gran cantidad de Temas de WordPress que puede afirmar que ofrece un diseño de OnePage, pero ninguno puede ofrecer la gran cantidad de opciones y características que tiene la plantilla de TheGem WordPress.
Todos los elementos de diseño que asocia con un buen sitio web de OnePage están presentes en este tema de WordPress : un control deslizante de pantalla completa (que se puede crear utilizando el complemento Revolution Slider que se entrega con el tema de WordPress), una selección de seis estilos de encabezado y la capacidad de crear secciones de ancho completo utilizando el complemento Visual Composer incluido en el paquete.
Además, tiene una serie de opciones de personalización para elementos como fuentes, colores e íconos. Es algo raro, pero también hay detalles que no nos gustan de TheGem. Pero, básicamente, es un tema de WordPress que, por supuesto, se adaptará a usted, dada la cantidad de puntos positivos que tiene. Es un fuerte competidor, lo que facilitaría la creación de un sitio web de OnePage.
Descargar | Demo | alojamiento web
2. Estocolmo
Estocolmo es un tema de WordPress diseñado para ayudarte a crear el sitio web de una empresa de construcción, ingeniería civil o cualquier empresa relacionada con el mundo de la renovación de edificios. Este Plantilla de WordPress está orientado a profesionales que se preocupan por la calidad y el detalle.
Viene con un panel de opciones y un backend fácil de usar, que le permitirán administrar fácilmente su contenido. Hay alrededor de 20 demostraciones de esta plantilla que presentan una amplia gama de actividades en las que se puede utilizar este tema de WordPress. Y estos también se pueden utilizar como base para la personalización futura para que su sitio web tenga un aspecto único.
Muy sensible, se muestra perfectamente en cualquier tipo de pantalla. Si durante la personalización o instalación de esta plantilla, encuentra dificultades, la documentación completa incluida en el paquete puede servir como guía. Y si aún no puede, el soporte dedicado a este tema de WordPress queda a su disposición.
Descargar | Demo | alojamiento web
3. Júpiter
Júpiter es otro tema muy popular de WordPress. Tiene demostraciones de 25 que cubren 6 de nuestras categorías: agencia, creatividad, educación, alimentación, salud y comercio electrónico, y se agregarán más en futuras actualizaciones. La mayoría de sus diseños tienen un diseño minimalista, con una tipografía agradable.
Uno de los principales puntos de venta de Júpiter es su Creative Header Customizer, que le permite personalizar rápida y fácilmente el diseño de los encabezados de su sitio web. Visual Composer, controles deslizantes 3 (Layer, Revolution e iCarousel), nuevos códigos cortos 10, más de iconos 1800 y tipos de publicaciones personalizadas 10 están incluidos en la entrega.
Sus tiempos de carga de página también son excelentes. Este es un producto excelente, y será difícil encontrar tantos Temas de WordPress teniendo sus características.
Descargar | Demo | alojamiento web
Otros recursos recomendados
Para ir más allá en la optimización de tu blog o tu web, también te sugerimos que consultes algunos enlaces que te sumergirán en el mundo de Gutenberg
- Cómo preparar su sitio web para Gutenberg
- ¿Cómo sé si tu complemento es compatible con Gutenberg?
- ¿Gutenberg mejorará o romperá WordPress?
Conclusión
Listo ! Eso es todo por este tutorial. Esperamos que este artículo le haya ayudado a aprender cómo agregar columnas a sus publicaciones y páginas de WordPress. no dude en comparte este tutorial con tus amigos en tus redes sociales.
Si tiene sugerencias o comentarios, serán bienvenidos. Pero si eres un novato, te invitamos a consultar nuestro Recursos.
...
Hola, tengo este complemento…. pero no funciona bien, sucede:
Estoy creando dos columnas, una más pequeña para la foto, otra más grande para el texto, por lo que el texto tiene solo 2 filas, no en la altura completa de la columna, al guardar el texto JUMP debajo de la foto, en lugar de quedate accano, mira que una columna desaparece… ..
¿Que hago? ¿Por qué sucede esto? ¿Hay otro plg-in mejor y más simple que este aquí?
Gracias, ¡estaría agradecido por la ayuda!
Hola Irina,
Intente activar el tema predeterminado de WordPress, si todo funciona bien, entonces el problema está en su tema actual de WordPress.
También verifique que haya realizado actualizaciones de complementos.
Todo lo que puedo decir es que esto es Geniale.
funciona muy bien y ca responde a todas mis expectativas.
gracias nombreu (BCP)
Hola,
Muchas gracias, es genial
Cómo añadir color a mi columna?
Mercii
Hola,
puede hacerlo utilizando un CSS personalizado.
Hola,
No pude pegar texto en una columna. Es eso posible ?
Hola,
¿Cómo se procede?
Copié un texto y probé un pegado con CRTL + V, sin éxito. El menú contextual con el clic derecho no ofrece pegar.
No encontré otra solución que volver a escribir todo ...
Lo siento por la respuesta tardía.
¿Puede asegurarse de que al hacer clic con el botón derecho en otro elemento de la página se muestre el menú contextual? Si es así, probablemente haya un problema de JavaScript con su alojamiento.
Si está en Google Chrome, vaya a la página en cuestión donde tiene el problema, luego presione la tecla "F12" (se abrirá una ventana o se adjuntará a la página) y luego elija la pestaña "Consola" . Tome una captura de pantalla de esta pestaña y le diré si hay algún problema.
Hola,
Merci pour votre réponse.
Mi sitio está alojado en Free, puede haber un problema de JavaScript.
¿Puedes decirme cómo reenvías la captura de pantalla que hice?
cordialmente
Queremos Mireille pero el tipo de servicio que necesita es, por desgracia pagando y le invitamos a ponerse en contacto con nuestro equipo técnico blogpascher.com
Como instalé una versión restringida de forma gratuita, creo que el problema está ahí.
Intentaré instalar otra versión ...
Copié algo de texto e intenté pegarlo en una columna del complemento. Imposible, ni con el atajo de teclado CTRL + V, ni en el menú contextual del clic derecho que no ofrece esta función.
¿Hay alguna alternativa que volver a escribir todo?
Solo tengo una palabra para decir ¡Impresionante! Lo instalé y después de dos o tres arreglos logré hacer columnas, ¡gracias!
Gracias Ronnie por estos comentarios.
hola instalé columnas wp avanzadas.
pero cuando miro en la página, tengo un cuadrado blanco en la parte superior izquierda de cada columna. puede ayudarme. Gracias
Bonsoir,
¿Ha intentado utilizar el tema predeterminado de wordpress para ver si el problema persiste?
Hola,
En realidad no podemos ayudarle si usted no da detalles sobre cómo hacer para tener un cuadrado blanco.
Merci.