Este componente de tema inserta botones en la barra de herramientas del compositor de publicaciones para alinear las imágenes subidas a la izquierda o derecha del texto, centrarlas en la publicación, o alinear varias imágenes en una cuadrícula, utilizando las etiquetas de cuadrícula recién implementadas. La cuadrícula ajustará automáticamente el tamaño de las imágenes para que encajen dependiendo de cuántas sean y de sus dimensiones, y también enlazará a las versiones subidas más grandes. Los botones/funciones de alineación se pueden usar varias veces en una publicación para crear una variedad de diseños. Funciona tanto para vistas de escritorio como móviles.
Para usarlo, simplemente haga clic en el botón de alineación de imagen que necesita y luego suba las imágenes al lugar designado entre las etiquetas resultantes (marcadas con texto de marcador de posición que se puede editar en la configuración del componente).
Tenga en cuenta que la parte de cuadrícula de este componente es para alinear imágenes subidas, no enlaces de imágenes (las otras opciones de alineación funcionarán para imágenes enlazadas).
Capturas de pantalla
botón de cuadrícula de la barra de herramientas del compositor (con ejemplo de código de cuadrícula)
¿te refieres al compositor / editor con la barra de herramientas? esa sería la primera captura de pantalla con el ejemplo de la cuadrícula. añadiré algunas capturas de pantalla del editor con los otros códigos de alineación alrededor de las imágenes.
De nada. ¿Cómo haces para que “Alinear a la izquierda”, por ejemplo, muestre texto en negrita en tu captura de pantalla? Intenté con Markdown y muestra el código de Markdown.
Veo que funciona con ### pero el negrita estándar con
solo inserta algunas etiquetas HTML <br><br> entre el primer bloque de texto y la etiqueta <div>-data-theme... hasta que se espacie correctamente. Intentaré programar un retorno forzado o algo así cuando tenga tiempo.
Creo que este no es un método confiable ya que la altura del contenido diferirá del tamaño de una ventana a otra.
Limpiar los flotantes cuando hay contenido arbitrario al lado es complicado. No estoy seguro de que haya una solución obvia aquí…[1]
También fue un problema con el editor de Wordpress durante mucho tiempo.
La gente tiende a depender de métodos hacky que utilizan elementos cuyo único propósito es tener un clear: both; para restablecer los flotantes anteriores.
Sí, a mí tampoco me gusta ese método. Estaba pensando en intentar una solución de propiedad de espacio en blanco. al final, funciona mejor si las imágenes alineadas son publicaciones separadas. Desafortunadamente, las imágenes en las tablas tampoco funcionan muy bien.
Probé esas soluciones de propiedad flex align pero no pude encontrar algo que funcionara de manera consistente. Sin embargo, encontré una solución alternativa utilizable. Si haces que cada sección de imagen-texto sea una cita en bloque, las separa (pero incluye el formato de cita para el texto):
al final, funciona mejor si las imágenes alineadas son publicaciones separadas. Desafortunadamente, las imágenes en las tablas tampoco funcionan muy bien.
.
