Control de columna

Las columnas son uno de los elementos estructurales clave dentro del Blocs aplicación, junto con filas y Bloc contenedores forman la base sobre la que se construye el diseño de su sitio. Las columnas tienen varias opciones que le permiten personalizar sus tamaño, compensar, solicite y alineación de contenido. Todas las opciones se pueden ajustar por punto de interrupción, lo que significa que puede personalizar los diseños de las columnas según el tamaño de la pantalla en la que se ven, para una experiencia de usuario móvil óptima.

Consejo para principiantes

Una fila principal de columnas no puede existen sin contener al menos una columna, esto significa que es imposible eliminar la última columna dentro de una fila. Cuando se elimina la última columna dentro de una fila, se agrega automáticamente otra vacía.

Seleccionar una columna

Debido a que el contenido que está anidado dentro de una columna puede ocupar todo el espacio de una columna, puede ser complicado seleccionarlos directamente a través del lienzo de diseño. La forma más sencilla de seleccionar una columna es utilizando el árbol de capas.

Ancho de columna

Las columnas tienen varias configuraciones de ancho que se pueden aplicar usando los controles del lienzo o mediante los controles del inspector de la barra lateral. La forma más fácil de cambiar el tamaño de una columna es seleccionarla en el lienzo de diseño y simplemente arrastrar el controlador de cambio de tamaño ubicado en el derecha del marcador de selección de columna.

Tamaño fijo

La cuadrícula de diseño dentro Blocs se divide en 12 columnas que son de tamaño uniforme para llenar el disponible contenedor del sitio principal espacio. Una columna puede tener un tamaño fijo de 1 a 12, cuando una columna tiene un tamaño fijo, solo ocupará el espacio suficiente para llenar el porcentaje correcto de espacio permitido cuando este espacio se divide en 12 columnas. Por ejemplo, si una columna tiene un ancho de 6, ocupará la mitad de 12, lo que significa que ocupará 50% del espacio de la pantalla.

Tamaño heredado

Si una columna tiene su tamaño establecido en heredar ∞ en todos los puntos de interrupción, ya no será fijo y, en su lugar, establecerá automáticamente su tamaño en función del número de columnas dentro de la fila principal, para crear una cobertura uniforme del espacio disponible. Por ejemplo, si tiene 2 columnas establecido en heredar, cada columna ocupará 50% del espacio disponible.

Consejo para principiantes

Al usar la opción de heredar tamaño, es importante recordar que la columna no debe tener otros valores de ancho establecidos en los puntos de interrupción más bajos; de lo contrario, el ancho de la columna heredará el valor de ancho del punto de interrupción más bajo más cercano.

Desplazamiento de columna

El desplazamiento de columna le permite establecer el espacio de desplazamiento que se encuentra a la izquierda de la columna, se puede usar para centrar columnas horizontalmente o para crear espacio entre columnas. La forma más sencilla de establecer el desplazamiento de una columna es seleccionarla en el lienzo de diseño y arrastrar el controlador de desplazamiento ubicado en el lado izquierdo del marcador de selección de columna.

Consejo para principiantes

Cuando cambia el desplazamiento de una columna, también empujará o tirará de las columnas a la derecha de la misma y, en algunos casos (si no hay suficiente espacio horizontal disponible), las moverá a una nueva línea.

Orden de columna

Los controles de orden de las columnas pueden resultar un poco confusos cuando se utilizan por primera vez. Esto se debe a que puede parecer que la configuración no tiene ningún efecto si no se configura correctamente. Los controles de orden de las columnas le permiten establecer el orden de una columna dentro de la fila principal; por defecto, las columnas están ordenadas de izquierda a derecha en el orden en que existen físicamente (dentro del árbol DOM).

Comprender el orden de las columnas

Cuando una columna tiene su valor de orden personalizado, siempre se mostrará después de todas las columnas que no es necesario tener un pedido personalizado aplicado. Así que si tienes 2 columnas y establezca la primera columna en orden 1 se moverá detrás de la segunda columna en lugar de permanecer en la misma primera posición. Esto se debe a que, aunque la columna está configurada para colocarse primero, las otras columnas dentro de la fila principal no tienen una configuración de orden personalizada, por lo que se muestran antes que aquellas con valores personalizados. Si luego aplica un orden personalizado a lo que era la segunda columna, pero ahora es la primera y establece su posición de orden en 1, verá que ahora se mueve al final de las columnas y se ubica detrás de la columna con el orden personalizado de 2.

Puede obtener más información sobre el orden de las columnas y cómo funciona en Bootstrap 4 esta página.

Alineación de columnas

Los controles de alineación de columnas le permiten alinear rápida y fácilmente una columna al parte superior, medio or fondo de la fila principal. Estos controles también le permiten forzar a todos los elementos dentro de una columna a estirarse a la altura completa de la columna principal, esto puede ser útil cuando desee una tarjeta Brics tener un tamaño uniforme en altura.

Alineación de contenido

Los controles de alineación del contenido de la columna le permiten alinear rápida y fácilmente el contenido de una columna con el izquierda, centro or Derecho.

Consejo para principiantes

Los controles de columna segmentados que se encuentran dentro del inspector de la barra lateral se pueden ajustar rápidamente simplemente colocando el mouse sobre la sección de dígitos que se encuentra entre las flechas izquierda y derecha y deslizando hacia la izquierda o hacia la derecha en su mouse mágico (x1 dedo) o trackpad (x2 dedos).

WordPress Loop

Cuando un proyecto tiene su Opción CMS configurado en WordPress, un conjunto adicional de controles estará disponible en el inspector de la barra lateral que permitirá la configuración de los bucles de contenido de WordPress.

Tipo de Propiedad

Esta opción se utiliza para establecer la variable de tipo para el bucle:

Publicación

Esta columna se convertirá en la plantilla para el elemento de bucle de publicación, cualquier elemento dentro de los feeds de datos de publicación de WordPress se completará en consecuencia.

Páginas

Esta columna se convertirá en la plantilla para el elemento de bucle de página, cualquier elemento dentro de los feeds de datos de la página de WordPress se completará en consecuencia.

Contenido

Esta columna se convertirá en la plantilla para el elemento de bucle de contenido (los elementos de bucle de contenido generalmente se encuentran en las plantillas de página de archivo, autor, categoría, etiqueta y resultados de búsqueda), cualquier elemento dentro de los feeds de datos de publicación de WordPress se completará en consecuencia.

Todos

Esta columna se convertirá en la plantilla para la publicación estándar, la página y todos los elementos de bucle de tipo de publicación personalizada, cualquier elemento dentro de los feeds de datos de publicación de WordPress se completará en consecuencia. Esto generará todos los tipos de publicaciones y el tipo de página estándar.

Todos los tipos de publicaciones

Esta columna se convertirá en la plantilla para la publicación estándar y todos los elementos de bucle de tipo de publicación personalizada, cualquier elemento dentro de los feeds de datos de publicación de WordPress se completará en consecuencia. Esto generará todos los tipos de publicaciones que admite el tema.

Todos los tipos de publicaciones personalizadas

Esta columna se convertirá en la plantilla para todos los elementos de bucle de tipo de publicación personalizada, cualquier elemento dentro de las fuentes de datos de publicación de WordPress se completará en consecuencia. Esto generará todos los tipos de publicaciones personalizadas que admite el tema.

Custom Pon Tipos

Esta columna se convertirá en la plantilla para el elemento de bucle de tipo de publicación personalizada relevante, cualquier elemento dentro de los feeds de datos de publicación de WordPress se completará en consecuencia.

Consejo para principiantes

Tipos de publicaciones personalizadas adicionales agregadas a través del Administrador de datos personalizados de WordPress se agregará a las opciones de tipo.

Autor

Esta opción se usa para establecer la variable de autor para el bucle:

Todos

El bucle devolverá publicaciones de todos los autores.

Autor de publicación

El bucle devolverá publicaciones del autor de la publicación actual.

Usuario actual

El bucle solo devolverá publicaciones para el usuario actualmente conectado.

Publicaciones por página

El número ingresado en este campo se utilizará como límite máximo de bucle. Si ingresa 6, los resultados del bucle de publicación se paginarán en grupos de 6 elementos por página.

ID de categoría

El bucle se filtrará para incluir publicaciones con estos ID de categoría (separe los valores múltiples con comas).

Etiquetas de categoría

El bucle se filtrará para incluir publicaciones con estas etiquetas de categoría (separe los valores múltiples con comas).

Excluir ID de publicación

El bucle se filtrará para excluir las publicaciones con estos ID (separe los valores múltiples con comas).

Actualizado el 26 de abril de 2022

¿Le resultó útil este artículo?

Artículos Relacionados