📣 Seu anúncio aqui? Anuncie no ForoBeta

Como corrigir imagens com proporção incorreta (Ajuda)

  • Autor Autor henrym
  • Data de início Data de início
Tradução em andamento: em alguns minutos este tópico estará em português. Por enquanto, o conteúdo está no original em espanhol. Ver original
H

henrym

Dseda
Verificación en dos pasos activada
Usuário com poucas negociações! Use sempre o saldo do ForoBeta!
Hola, estoy queriendo optimizar mi sitio lo maximo posible y Google PageSpeed dice lo siguiente con la primer imagen del post:

Displays images with incorrect aspect ratio



¿Como puedo solucionarlo? Tengo Ezoic con Leap (su sistema de optimizacion) y tiene una opcion para eso pero la desactive porque daba mas errores que soluciones.

¿Alguna solucion?

Gracias
 
Foi útil? Participe da conversa

Com sua conta grátis você pode responder, mandar mensagem privada ao autor e comprar com Saldo retido: o pagamento é liberado quando você recebe o combinado.

Continuar com o Google Criar conta com e-mail
Leva 30 segundos · você volta a este tópico ao terminar
Sin ver el sitio web es complicado resolverte esa pregunta 100%.

Pero es normal el mensaje, está mostrando la imagen en 352 de ancho y 410 de altura, supongo que por el style que tiene la img y que tu theme hace el ancho dinámico 100% y la altura queda estática a 410px que es lo que tiene el style.

Deberías arreglar el CSS, o editar la imagen y quitarle el ancho y el alto que tenga, mostrando la foto tal cual, al tamaño que sea para que se adapte.
 
Exactamente lo que dice el compañero de arriba.

Si subes una imagen de 2000x2000 pero tu theme y su css la renderizan a 1000x1000, el pagespeed lo que te dice es que estas usando una imagen muy grande para lo que realmente necesitas, entonces es mas optimo subir una imagen de 1000x1000 que pesa menos y que tu tema ya mostrará en 1000x1000
 
samuelsuteras disse:
Exactamente lo que dice el compañero de arriba.

Si subes una imagen de 2000x2000 pero tu theme y su css la renderizan a 1000x1000, el pagespeed lo que te dice es que estas usando una imagen muy grande para lo que realmente necesitas, entonces es mas optimo subir una imagen de 1000x1000 que pesa menos y que tu tema ya mostrará en 1000x1000
Clique para expandir...

El problema seguramente es que haya puesto un ancho y alto a la foto al insertarla en el post, y ahora wordpress con su ultima actualización le pone el ancho y el alto en un style="" a la imagen si defines un ancho y alto, los themes normalmente tienen su css para hacer responsive la imagen poniendo 100% de ancho y el alto no lo tocan ya que se adapta según lo que pongan. Pero al tener el height en un style directamente en el <img> se queda con la altura fija del style y no va a cuadrar...

Ya he visto a más de uno quejarse de eso en los foros de wordpress porque es ridículo.
 
jonay disse:
El problema seguramente es que haya puesto un ancho y alto a la foto al insertarla en el post, y ahora wordpress con su ultima actualización le pone el ancho y el alto en un style="" a la imagen si defines un ancho y alto, los themes normalmente tienen su css para hacer responsive la imagen poniendo 100% de ancho y el alto no lo tocan ya que se adapta según lo que pongan. Pero al tener el height en un style directamente en el <img> se queda con la altura fija del style y no va a cuadrar...

Ya he visto a más de uno quejarse de eso en los foros de wordpress porque es ridículo.
Clique para expandir...

Si, ultimamente wordpress hace cosas locas con el gutenberg
 
Mis fotos son 640x480 y ese error solo me los marca con la imagen principal del post y no con las de dentro del post.
 
henrym disse:
Mis fotos son 640x480 y ese error solo me los marca con la imagen principal del post y no con las de dentro del post.
Clique para expandir...
Es tema de css, sin ver la web dificil ecirte exactamente donde está el problema pero es css
 
Ok revisare por mi parte. Si se les ocurre por donde empezar digan jaja.
 
No sé si instalando un plugin de escalado de imágenes podrías solucionarlo...
 
¿Alguno gratis que recomienden?
 
No hace falta plugin, añade esto al functions.php de tu theme o bien en un child theme:

Inserir CODE, HTML ou PHP: 
function update_img_attributes($content) {

    $content = preg_replace_callback('/<img(.*?)style=".*?width:\s*(\d+).*?height:\s*(\d+).*?"(.*?)>/i', function($matches) {
        $before = $matches[1];
        $width = $matches[2];
        $height = $matches[3];
        $after = $matches[4];
     
        $before = preg_replace("/width=[\"']\d+[\"']/", "width=\"$width\"", $before);
        $before = preg_replace("/height=[\"']\d+[\"']/", "height=\"$height\"", $before);
     
        if (!preg_match("/width=/i", $before)) {
            $before .= " width=\"$width\"";
        }
        if (!preg_match("/height=/i", $before)) {
            $before .= " height=\"$height\"";
        }
     
        return '<img' . $before . $after . '>';
    }, $content);
 
    return $content;
}

add_filter('the_content', 'update_img_attributes');

Eso debería eliminar el style a las imagenes y añadir el width y height del style="" en los atributos width y height del <img>.

Debería funcionar, pero como no puedo ver tu web, no te lo aseguro al 100%.

Como te dije el problema es el style="" que tiene tu <img>. Esto se soluciona eliminando el style que es lo que hace el código de arriba.
 
Gracias, en estos días pruebo en un tema.
 
Consulta ¿Cual es el tamaño correcto para las imagenes en WordPress? Actualmente utilizo 640x480 y creo que ese es un problema.
 
Você precisa estar logado ou cadastrado para responder aqui.
Voltar
Topo