Pregunta sobre Twenty Seventeen de Wordpress:

luchando con la imagen de los encabezados en Twenty Seventeen

Un usuario preguntó 👇

Publiqué esto en otro lugar en apoyo, el moderador Andrew Nevins sugirió que lo vuelva a publicar aquí.

El tema Twenty Seventeen propone una imagen de encabezado de 2000 × 1200 px. Quiero usar una imagen de 2000 × 271. Lo subí y funciona en otras páginas además de la página de inicio.

En la página de inicio, la imagen del encabezado es enorme y está colgando y no sé por qué. En otras páginas, el encabezado está bien en mi computadora portátil en una ventana optimizada, pero no cambia cuando se cambia la ventana. La imagen del encabezado real cambia muy bien.

Además, la imagen tiene solo un tono de amarillo, pero en el encabezado hay una banda gris degradada oscura (que anteriormente ha intentado corregir estos problemas colocando el cursor sobre el menú y haciendo clic en esos enlaces).

He intentado muchas correcciones SEC sin un gran éxito. Pero por ahora solo tengo este CSS personalizado (que es bastante útil):

branding .site, .wp-custom-header {altura: 165px; }

El moderador Andrew Nevins (@anevins) sugirió:
Creo que una de las razones por las que está utilizando una imagen con diferentes proporciones es lo que se recomienda. Intente actualizar su imagen utilizando espacios en blanco para que tenga la misma proporción.

(@dagnew)

hace 3 años

Gracias, Andrew. Mi imagen de encabezado es de 2000 x 271 px. ¿Crees que debería agregar aproximadamente 415px de espacio en blanco en la parte superior e inferior de la imagen? ¿O tal vez negro ya que la imagen está al revés?

(@anevins)

Donante de WCLDN 2018 Apoyo voluntario

hace 3 años

Así es, pero excluya que no está abordando un problema de diferencia de razón.

(@dagnew)

hace 3 años

Reemplacé la imagen con una de 2000 x 1200 px (hay 415 px en blanco arriba y debajo de la imagen negra y amarilla que quiero mostrar). Inhabilité todo mi CSS personalizado y borré el caché de Chrome y Firefox donde miro el sitio.

Ahora en la página de inicio hay un espacio en blanco sobre la imagen del encabezado y el espacio gris debajo. Sospecho que WordPress está usando una imagen diferente para la página de inicio, pero no puedo encontrar una solución para eso.

En las otras páginas, la imagen del encabezado se cuelga en la parte superior e inferior. Además, solo hay un tono de amarillo en la imagen, pero en el encabezado hay una banda gris degradada oscura (más oscura en la parte inferior) que quiero ocultar. No estoy familiarizado con este degradado gris porque fue arriba del menú anterior e hice clic en esos enlaces. Pero no sé cuál es el nombre del objeto.

¡Gracias por tu ayuda!

(@dagnew)

hace 3 años

Vaya, me acabo de dar cuenta de que mi nueva imagen NO es 2000 × 1200, por alguna razón es 417 × 2502. Trabajaré en eso …

(@dagnew)

hace 3 años

4170

(@dagnew)

hace 3 años

Hay un Imagen 2000x1200px (incluidos los espacios en blanco superior e inferior) para trabajar.

Por primera vez pude recortarlo dentro de la interfaz vigésimo primera: sin copiar, MEJOR, en el sitio web, sin copiar (muchos espacios en blanco arriba y abajo). Cultivos, en el sitio web, parece demasiado recortado (faltan palabras).

(@anevins)

Donante de WCLDN 2018 Apoyo voluntario

hace 3 años

no copiado, MEJOR, en el sitio web, no copiado (mucho espacio en blanco arriba y abajo). Crop, en el sitio web, parece demasiado recortado (faltan palabras).

Lamento haber leído esto varias veces y no puedo entender lo que quieres decir. ¿Puede aclarar la pregunta que aún queda por delante?

(@dagnew)

hace 3 años

Perdón por el texto confuso. El problema (probablemente ignorando mi falta de experiencia) tiene que ver con el «deseo» de TwentySeventeen de una imagen de encabezado de 2000 × 1200 px. Quiero usar una imagen con una altura mucho menor. Como sugirió, cargué una imagen de encabezado (2000 × 1200 px a 150 ppp) que contenía aproximadamente 450 px de blanco arriba Y debajo de la imagen visible que quiero. Cuando lo hice, WordPress / TwentySeventeen me dio la oportunidad de recortar la imagen. Si lo hice, la imagen del encabezado estaba visible (mientras estaba de visita) pilgrimwatch.org/wp/) donde falta parte del área negra de la imagen. Cuando cargué la misma imagen de origen y seleccioné «omitir recorte», se mostró un espacio en blanco encima y debajo de la parte (fondo negro) de la imagen cargada que necesito para el encabezado.

Puedo proporcionar imágenes para explicar mejor de qué estaba hablando sobre ‘recortar’ si es útil.

Puede haber otros problemas de reproducción (especialmente mi confusión con una discrepancia en la resolución de la imagen entre el archivo de Illustrator y lo que dice mi sistema operativo sobre la resolución del archivo png exportado), así que he subido una nueva imagen. Al seleccionarlo como imagen de encabezado, se me dio la oportunidad de recortarlo y lo hice. El resultado es aproximadamente el mismo que antes.

Otra cosa que es complicada es que TwentySeventeen APPEARS cree que quiero tratar la imagen del encabezado de una manera diferente en la página de inicio, no es así. ¿Puede decirme dónde encuentra ese sitio?

Esta respuesta fue modificada hace 3 años por.

(@ stilman-davis)

hace 3 años

Si su imagen es visible en el área como lo desea, ¿qué tal si hace transparente el fondo (el blanco que creó)? Quizás esto funcione, no lo sé, solo una idea.

Las dimensiones proporcionadas por las ilustraciones deben ser precisas. Intente ver la imagen png con un editor de imágenes (por ejemplo, Photoshop) y vea cuáles son sus dimensiones y resolución. Deben ser iguales a la información de las ilustraciones.

Andrew en este hilo (https://wordpress.org/support/topic/make-header-image-same-across-all-pages/?view=all#post-9854830) analiza la decisión de diseño que causó que muchos tuvieran problemas con este tema.

Espero que esto ayude. Stilman Davis

(@dagnew)

hace 3 años

Gracias por los comentarios, Stilman. La imagen no aparece como me gustaría: solo el tercer centro (medido verticalmente), en lugar de la página de inicio, muestra donde se muestra el tercer centro (horizontalmente). En una de las muchas iteraciones, se veía bien (‘aunque no en la página de inicio’) excepto por un puñado de espacios en blanco encima y ‘espacio gris’ debajo (que impedía hacer clic allí).

Agradezco su información sobre las dimensiones. FWIW, estoy en una Mac, y aunque tengo Illustrator, no tengo Photoshop. Guardé una versión del archivo en Illustrator, que me dijo (en ‘Información’) que la imagen era 2000 × 1200 @ 150 dpi. Pero mi sistema operativo me dijo que era 4170 × 2502 (@ 150 dpi). En la ‘Vista previa’ de Apple, cambié el tamaño a 2000 × 1200, pero ninguna imagen funciona correctamente en TwentySeventeen.

Espero leer sobre «la decisión de diseño que creó muchos problemas con este tema». No estoy casada con TwentySeventeen, no necesito nada elegante, pero quiero un sitio web receptivo / adaptable. Pasé un tiempo con el tema Vantage y tuve problemas similares pero con la imagen del encabezado. No pude encontrar el encabezado correctamente en Mantra, un tema que me funcionó bien en algunos otros sitios.

Intentar tener una imagen de encabezado de aproximadamente 2000 × 1200 no parece ser un gran problema. Creo que todos los problemas tienen que ver con el diseño adaptativo, que no entiendo del todo, pero que no es opcional en el mundo actual, creo.

¡Gracias de nuevo!

Esta respuesta fue modificada hace 3 años por.

(@anevins)

Donante de WCLDN 2018 Apoyo voluntario

hace 3 años

Para aclarar, los problemas de imagen a superar no están aquí porque el tema no responde. Se debe a una decisión de diseño tomada por el tema. La decisión fue utilizar la imagen del encabezado de forma decorativa y no centrarse en un punto particular de la imagen. Si utiliza una imagen decorativa, el tema funciona bien, pero si tiene una imagen con un punto focal, el tema se cae.

(@dagnew)

hace 3 años

Andrew, elegí Twenty Seven porque quería un tema receptivo bien diseñado y confío en WordPress. Pero conseguir lo que pienso (tener una imagen de encabezado estática en todo el sitio que no ocupa mucho espacio) sería un resultado simple: hubo tantos problemas en Seventeen como en Vantage, Mantra (temas que usé para otros sitios). Entonces, cuando leí su comentario sobre la decisión de diseño que causó que muchos tuvieran problemas con este tema, decidí probar Twenty Sixteen.

Qué alivio que «2016» haga (más o menos) exactamente lo que quiero. Definitivamente tendré que cambiar algunas cosas, ¡pero me alegro de que me duela la cabeza!

Gracias por tus esfuerzos.

(@ stilman-davis)

hace 3 años

Andrés,

Quizás la advertencia sobre la imagen del encabezado como una característica de «diseño de fondo» debería quedar clara en la oscuridad del tema.

La gente parece estar usando la imagen en el encabezado como un elemento de marketing (imagen visible o algo así). Claramente, este no es su objetivo previsto.

Los diseñadores de temas deben explicar el tema eliminando las diferencias entre la «imagen visible» y la selección de imagen de encabezado / video.

Saludos, Stilman Davis

(@ stilman-davis)

hace 3 años

Su hijo debería tener un editor de imágenes incorporado, creo. Estoy en Windows. GIMP es otro, pero eso es Linux. Siento no poder ayudarte con las cosas del hijo.

Saludos, Stilman

(@anevins)

Donante de WCLDN 2018 Apoyo voluntario

hace 3 años

No estoy seguro de si este documento en el tablero evitaría el problema. Ayudaría a gestionar las expectativas y estoy de acuerdo con usted, pero aún puedo crear hilos de apoyo para cambiar ese aspecto del diseño.

Tampoco hay nada de malo en los materiales de respaldo, pero el tema diseñó esta característica de diseño de una manera que es difícil de cancelar.

Creo que existe la posibilidad de que se mejore el tema de 2017, pero podemos evitar que el tema de 2018 se diseñe de esta manera.

¿Solucionó tu problema??

0 / 0

Deja una respuesta 0

Tu dirección de correo electrónico no será publicada. Los campos obligatorios están marcados con *