Configuración de alineación de imagen de WordPress – ¡Explicado!

El tema de alinear imágenes es uno que los novatos de WordPress no suelen entender. Cuando vaya a agregar una imagen a su contenido (dentro de publicaciones o páginas) WordPress le ofrece cuatro formas predeterminadas para alinear dicha imagen: alinear “Izquierda”, alinear “Centro”, alinear “Derecha” y alinear “Ninguno” *.


Echemos un vistazo a cada uno de estos a su vez:

1. Alinear a la izquierda

Una imagen a la que se le ha asignado una alineación izquierda se empujará efectivamente a la izquierda de la sección de la página dentro de la cual se encuentra (como el límite izquierdo de la publicación de WordPress del contenido de la página), y cualquier otro contenido (como texto) envuelva sus otros tres bordes, llenando el área a la derecha de donde se encuentra la imagen.

Ejemplo:

Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Alinear a la izquierda Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepcional sint occasionecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum. Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor en reprehenderit en voluptate velit esse cillum dolore eu fugiat nulla pariatur.

2. Alinear centro

Si desea que su imagen esté centralizada dentro de la sección de la página en la que se encuentra (es decir, con una cantidad igual de espacio entre el borde del área de contenido y su borde izquierdo y derecho), elija una alineación ‘Central’. A diferencia de la alineación ‘Izquierda’ mencionada anteriormente, cualquier contenido adyacente (como el texto) no se ajustará alrededor de la imagen; en su lugar, se colocará encima o debajo de la imagen (dependiendo de en qué parte del texto haya elegido insertar) dicha imagen).

Ejemplo:

Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Alinear al centro Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occasionecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.

3. Alinear a la derecha

La alineación correcta de una imagen es, como era de esperar, prácticamente el reverso exacto de la alineación izquierda de una imagen: la imagen se empujará a la derecha de la sección de la página en la que se encuentra (es decir, el límite derecho de su Publicación de WordPress del contenido de la página), y cualquier otro contenido (como texto, etc.) se ajustará a sus otros tres bordes: llenando así el área a la izquierda de la misma.

Ejemplo:

Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Imagen alineada a la derecha Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepcional sint occasionecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum. Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor en reprehenderit en voluptate velit esse cillum dolore eu fugiat nulla pariatur.

4. No alinear ninguno

Las imágenes que no tienen una alineación asignada (al asignarles una alineación de ‘Ninguna’), se ubicarán exactamente en el lugar donde las ubique, es decir, si elige colocar una imagen asignada a una alineación de ‘Ninguna’ dentro de un párrafo de texto (vea el siguiente ejemplo a continuación), se colocará en línea con ese texto, lo que dará como resultado que haya texto tanto a la izquierda como a la derecha de la imagen (suponiendo que la imagen no tenga el mismo ancho, o más ancho, que el área en el que se sienta **). Sin embargo, de manera confusa, una imagen a la que se le haya asignado AMBOS una alineación de ‘Ninguno’ Y se encuentra dentro de su propio párrafo (es decir, en una nueva línea en el editor de WordPress y / o específicamente dentro de las etiquetas ‘p’ de HTML) se colocará a la izquierda del área dentro de la cual reside (de una manera similar a la que tendría si se hubiera dejado alineado) pero sin ningún texto a la derecha del mismo. ¿Por qué? Debido a que una imagen no tiene una alineación específica (o, en términos de tecnología: no hay un ‘flotador’ izquierdo o derecho específico) que se encuentre dentro de su propio párrafo (sin otros elementos en el mismo párrafo), se separará de sus dos precedentes y siguiendo el contenido por líneas de espacios en blanco predefinidos, de la misma manera que cualquier otro párrafo!

Ejemplo:

Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Alinear ninguno Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occasionecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.

Entonces, ¿qué está pasando realmente aquí??

¿Por qué sucede todo esto? En realidad, todo se debe a un lenguaje informático utilizado para expresar la presentación (diseño, dimensiones, colores, etc.) de elementos web, conocidos como hojas de estilo en cascada, o “CSS” para abreviar. En esencia, cada vez que asigna, por ejemplo, una alineación izquierda a una imagen en una publicación o página, por ejemplo, WordPress agrega un nombre de clase HTML de “alinear a la izquierda” a dicha imagen, que luego obliga efectivamente a la imagen a hacer referencia a un conjunto específico de comandos CSS predefinidos que le indican dónde debe ubicarse en la página, ¡simple! Del mismo modo, para cada una de las otras alineaciones mencionadas, WordPress asigna diferentes nombres de clase, como ‘aligncenter’ (para que las imágenes estén alineadas centralmente), ‘alignright’ (para que las imágenes estén alineadas a la derecha) y ‘alignnone’ (para imágenes que están no tener una alineación particular asignada) – que cada referencia haga referencia a diferentes conjuntos de comandos CSS.

Es cierto (desafortunadamente) que la idea de comprender el mundo de los comandos CSS puede ser algo desalentador para el usuario promedio de WordPress; sin embargo, si tiene interés en aprender más sobre ellos, le permitirán obtener rápidamente un nuevo grado de libertad cuando se trata de diseñar su contenido, ¡o incluso todo su sitio web! Si está interesado en aprender, consulte nuestra publicación anterior sobre dónde mejor aprender CSS en línea, o, alternativamente, simplemente diríjase a Google y ¡enloquezca! ;)

Resumen

Así que ahí lo tienen: ¡explicaciones de alineaciones de imágenes! En resumen: use una alineación izquierda cuando desee que una imagen se asiente a la izquierda y otros elementos (como texto, etc.) para envolverla a la derecha; use una alineación central cuando desee que una imagen se asiente en el medio / centro de su contenido sin ningún otro elemento a cada lado; use una alineación a la derecha cuando desee que una imagen se asiente a la derecha y otros elementos web vecinos que la envuelvan a la izquierda; y use una alineación de ‘ninguno’ si desea que su imagen se ubique exactamente donde elige colocarla en relación con sus elementos vecinos (es decir, texto, etc.) Y, por último, si desea que se ubique una imagen a la izquierda del contenido -área dentro de la cual reside PERO no desea que aparezca ningún texto, etc. a la derecha de la misma, asigne a la imagen una alineación de ‘Ninguno’ y asegúrese de que se encuentre en su propio párrafo privado!

* a través de un menú desplegable que se encuentra en la esquina inferior derecha de la ventana “Biblioteca de medios” de WordPress, debajo del subtítulo “Configuración de visualización de archivos adjuntos”.

** en cuyo caso el texto que normalmente se ubicaría a ambos lados no tendrá otro lugar que ir más allá de la imagen o debajo de ella – tenga en cuenta que tales casos a menudo pueden generar confusión entre las cuatro alineaciones ya que no hay espacio para ningún otro texto / elementos a cada lado de la imagen, esencialmente no hará ninguna diferencia qué alineación elija usar!

Útil?

Jeffrey Wilson Administrator
Sorry! The Author has not filled his profile.
follow me
    Like this post? Please share to your friends:
    Adblock
    detector
    map