Pregunta sobre Reykjavik de Wordpress:

Orden de columna inverso y alineaci贸n de imagen alterada para vista m贸vil

Un usuario pregunt贸 馃憞

Hola,

Estoy usando 芦Bloque de columna禄 con 芦Ancho ancho禄 dentro de la plantilla P谩gina predeterminada.

Mis materiales est谩n en la columna de la izquierda y tengo fotograf铆as a la derecha. De todos modos, cuando se apilan mis im谩genes se muestran sobre el tema, no sobre.

驴Existe alguna forma de invertir el orden de las columnas para la Vista m贸vil?

Adem谩s, tambi茅n necesito cambiar la alineaci贸n de mi imagen (Bloque de imagen) para Vista m贸vil. Parecen alineados en la Vista de escritorio, pero quiero cambiar la alineaci贸n a Centrado en la vista m贸vil. 驴Eso tambi茅n es posible?

隆Gracias! Kala

Autor del tema

(@webmandesign)

Hace 1 a帽o, 1 mes

Hola Kala,

Tenga en cuenta que este no es un problema tem谩tico.

El problema que realmente tiene es el comportamiento normal. Los elementos horizontales se apilan uno al lado del otro en las pantallas de los dispositivos m贸viles. Hasta donde yo s茅, no hay forma de controlar esto en la versi贸n actual de la implementaci贸n de columnas de WordPress. Quiz谩s pruebe el bloque 芦Medios y texto禄 en su lugar, aunque tampoco creo que la opci贸n est茅 ah铆.

Una nueva versi贸n de WordPress saldr谩 el pr贸ximo mes, creo, y eso deber铆a permitirle modificar esa opci贸n hasta donde yo s茅 (pero por favor no mencione esto;)).

Una soluci贸n alternativa ser铆a usar un creador de p谩ginas lo que le permitir谩 establecer el orden inverso de las columnas en las pantallas de los dispositivos m贸viles.

En cuanto a la alineaci贸n de im谩genes, no creo que sea posible sin un c贸digo CSS personalizado adicional.

Todo lo mejor,

Oliver

(@kalayanis)

Hace 1 a帽o, 1 mes

Hola oliver

隆Gracias por la r谩pida respuesta!

Hasta ahora he logrado la alineaci贸n de la imagen con el siguiente CSS:

@media (max-width: 671px) {
    .wp-block-image .alignright {
        float: none;
        margin-left: auto;
        margin-right: auto;
    }
}

Invierta las columnas configurando una clase CSS adicional para el bloque de columnas y luego agregando CSS adicional:

@media (max-width: 671px) {
	.reverse-columns {
		display: flex;
		flex-direction: column-reverse;
	}
}

Espero que no haya efectos secundarios no deseados 馃檪

隆Gracias! Kala

Autor del tema

(@webmandesign)

Hace 1 a帽o, 1 mes

Hola Kala,

Muy buena solucion! 馃檪 Claro, no puedo garantizarle ninguna prueba futura, ya que eso tambi茅n depende de los cambios que se introducir谩n en las futuras versiones de WordPress, pero dir铆a que deber铆a estar de acuerdo con este CSS.

Todo lo mejor,

Oliver

驴Solucion贸 tu problema??

0 / 0

Deja una respuesta 0

Tu direcci贸n de correo electr贸nico no ser谩 publicada.