Cómo hacer un logo de cabecera responsivo

mikealme · 5 Dic 2015

Hola amigos, me ha pasado que cuando pongo una imagen de cabecera como logo que abarque el total del ancho de la página, este mismo header no se visualiza responsive en todos los dispositivos moviles, aparece mucho mas ancho y deforma el sitio, podrian porfavor decirme que linea de codigo modificar para reparar esto? Gracias

visitardubai · 5 Dic 2015

Que theme es ?

krusty72 · 5 Dic 2015

El div del header tiene un ancho específico en pixeles? debes cambiarlo por porcentaje (%). Así también si es necesario la imagen que está dentro del div.

mikealme · 5 Dic 2015

Podrías ser más específico porfavor... pues la verdad no logré hallar lineas de codigo asi.

krusty72 dijo:
El div del header tiene un ancho específico en pixeles? debes cambiarlo por porcentaje (%). Así también si es necesario la imagen que está dentro del div.

- - - Actualizado - - -

Valenti V.5

visitardubai dijo:
Que theme es ?

evolusoft · 6 Dic 2015

Se estaba refiriendo a esto:
Referencia

mikealme · 6 Dic 2015

No amigo por mas que busqué no logré hallar la manera de insertar un codigo para modificar div, ya qu eno sé cual div es y en que parte del codigo del header.php

evolusoft dijo:
Se estaba refiriendo a esto:
Referencia

evolusoft · 6 Dic 2015

La imagen no se agrega en el header.php sino en el style.css dependiendo a tu template

krusty72 · 6 Dic 2015

Sí, el header tiene un ancho específico de 1200px. de hecho el theme no es responsive.

En todo caso para solucionar lo del header únicamente agrega en:

.site-logo {width: aquí le das el ancho que deberá tener la imagen en porcentaje}

ramonjosegn · 6 Dic 2015

mikealme dijo:
No amigo por mas que busqué no logré hallar la manera de insertar un codigo para modificar div, ya qu eno sé cual div es y en que parte del codigo del header.php

Las próxima versión de Wordpress que sale en un par de días hará todas las imágenes responsive sin necesidad de hacer nada, las viejas imágenes también quedarán como responsive, esto debido a que se usará una nueva etiqueta para el código de imágenes, lo digo porque según [MENTION=2092]krusty72[/MENTION] el theme no es responsive, pero después de esta nueva actualización al menos las imágenes lo serán...

IngGeek · 6 Dic 2015

Entra al foro de discusión de Cubell themes, el autor es muy buena onda y habla español le puedes pedir la modificación específica :encouragement: . Te lo digo por experiencia porque yo antes usaba ciola, luego valenti y siempre me ayudó. Actualmente estoy con Newspaper y newsmag y bueno la misma historia son muy buenos en soporte los de tagdiv.

mikealme · 7 Dic 2015

En que parte del style? y según dice en la página, si es responsive, porque mencionas que no amigo?

krusty72 dijo:
Sí, el header tiene un ancho específico de 1200px. de hecho el theme no es responsive.

En todo caso para solucionar lo del header únicamente agrega en:

.site-logo {width: aquí le das el ancho que deberá tener la imagen en porcentaje}

ramonjosegn · 7 Dic 2015

mikealme dijo:
En que parte del style? y según dice en la página, si es responsive, porque mencionas que no amigo?

De pronto algún plugin te está bloqueando la opción responsive...

krusty72 · 7 Dic 2015

mikealme dijo:
En que parte del style? y según dice en la página, si es responsive, porque mencionas que no amigo?

Ah, estoy viendo que me equivoqué de theme, entré al primer resultado y no es ese..........🙄

Tienes razón, el theme es responsive. Veo que en cada @ media le cambia el tamaño en pixeles al logo, deberías checar si eso lo hace automáticamente o debes insertar el tamaño para cada @ media.

Lo mejor como decía, es usar porcentajes.

Cómo hacer un logo de cabecera responsivo

mikealme

visitardubai

krusty72

mikealme

evolusoft

mikealme

evolusoft

krusty72

ramonjosegn

IngGeek

mikealme

ramonjosegn

krusty72

Temas similares