Un usuario preguntó 👇
Hola, estoy trabajando en una tienda online donde vendo réplicas de películas. De todos modos, ni siquiera sé cómo funcionaría esto, pero la mayoría de las imágenes en la resolución que tomé no se escalan en el «contenedor» que se supone que debe encajarlas correctamente, dejando parte del producto en la imagen desapareciendo por completo. la imagen. Sé lo que está pasando. El contenedor espera una imagen de la misma longitud en todos los lados y no hay la mía.
¿Hay alguna manera de hacer que WP los monte automáticamente o en una escala automática dependiendo del contenedor en el que se ubicará? Ni siquiera estoy seguro de cómo funcionaría, pero la tecnología a menudo me sorprende.
Aquí hay una imagen:
http://prntscr.com/ncxfxs
Aquí está el sitio web:
Este tema fue modificado hace 1 año, 10 meses por. Este tema fue modificado hace 1 año, 10 meses por. Razón: https://cyberwonka.com/
(@catacaustica)
Hace 1 año, 11 meses
Sí, pero no utiliza una etiqueta de imagen HTML estándar.
En su lugar, todo lo que tendría que hacer es modificar el código para generar un elemento diferente, establecer una imagen de fondo para ese elemento y usar CSS para mostrarlo en el tamaño completo del elemento. Por ejemplo …
<div class="product-image" style="background-image: url('/path/to/image.jpg');"></div>
.product-image {
width: 300px;
height: 300px;
background-position: center center;
background-size: cover;
}
(@bcworkz)
Hace 1 año, 10 meses
Se entiende que una solución catalítica requeriría que especifiques una imagen que WP aún no haya recortado. Tal imagen es probablemente mucho más grande de lo necesario, lo que reduciría la velocidad de carga de una página cuando hay 16 imágenes de este tipo en una página. También necesitará un selector más específico que una «imagen de producto», uno que sea único para cada imagen.
Otro enfoque sería cambiar el valor «superior» a 0
(falso) para tamaños de imagen relacionados en la matriz global $ _wp_additional_image_sizes. No estoy seguro, pero creo que los tamaños utilizados por WooCommerce son «woocommerce_thumbnail» y / o «shop_catalog». Estos deben cambiarse desde la acción «init». Este cambio solo se aplicará a cargas futuras, puede volver a generar uno de los plugins de miniaturas para cambiar las imágenes existentes.
Obtendrá un comportamiento errático con imágenes escaladas si hay una combinación de orientaciones horizontal y vertical porque el CSS receptivo acepta una u otra. En mi opinión, las características cuadradas tienen algunas buenas ventajas. Sin embargo, requieren que tenga en cuenta las imágenes del producto y se asegure de que partes importantes del producto no se extiendan hacia las partes no cuadradas del marco. Si opta por utilizar características rectangulares, para que las imágenes se vean bien en una página, debe asegurarse de que todas las relaciones de aspecto sean iguales y no mezclen las orientaciones vertical y horizontal.
(@catacaustica)
Hace 1 año, 10 meses
Muchas veces he tenido esta discusión con los diseñadores con los que trabajo. 🙂
Se entiende que una solución catalítica requeriría que especifiques una imagen que WP aún no haya recortado.
No es suficiente. Tiene derecho a hacer que la imagen sea más grande de lo necesario, pero aún puede usar una versión recortada de la imagen. Si le preocupa cargar itmes, puede especificar varias imágenes en diferentes miniaturas para pantallas de diferentes tamaños.
También necesitará un selector más específico que una «imagen de producto», uno que sea único para cada imagen.
No no. Esa clase especifica el tamaño del elemento y cómo representa el fondo. La imagen de fondo real se organiza en línea en cada elemento, por lo que no se necesita nada más específico.
Obtendrá un comportamiento errático con imágenes escaladas si hay una combinación de orientaciones horizontal y vertical porque el CSS receptivo acepta una u otra.
Eso es en lo que funciona mi solución. Lo que estoy ofreciendo es una forma de mostrar imágenes del mismo tamaño independientemente de la orientación, tamaño de píxel, etc. Siempre existe la posibilidad de inconsistencias al recortar o no recortar imágenes. Lo sé personalmente por imágenes recortadas del mismo tamaño, pero no porque el cliente ha subido una dimensión inferior a la recortada, por lo que la imagen predeterminada se muestra en tamaño completo, mezclando tamaños en la página.
Si puede garantizar que cada imagen cargada superará siempre el tamaño máximo recortado, utilice etiquetas e imágenes recortadas. Si no puede (y la mayoría de los clientes no entienden esto), lo que sugerí es la única forma de estar 100% seguro de que todas las imágenes del mismo tamaño se muestran en todas partes.
Lanzador de hilos
(@ rmcc4444)
Hace 1 año, 10 meses
Gracias. No tuve tiempo de lograr esto hoy, pero espero que sea mañana. Me llevará un tiempo asimilar todo esto. 😆
¿Solucionó tu problema??
0 / 0