Pregunta sobre Arreglando WordPress de Wordpress:

Cuadro de texto semitransparente sobre la imagen del encabezado

Un usuario preguntó 👇

Hola,

Quiero crear un cuadro de texto blanco semitransparente para superponer una imagen en la sección Encabezados del blog de mi esposo.

Quiero que el texto se muestre en negro y que la imagen aparezca a través del cuadro de texto blanco. Prefiero tener un cuadro para el texto que ajustar la opacidad de toda la imagen (la imagen que quiero usar será bastante oscura). (Creo que también debe incluir los elementos del menú, ya que no los veo moviéndose debajo de la imagen del banner)

Solo puedo encontrar una manera de cambiar el CSS adicional en WordPress, y no puedo averiguar cómo cambiar la codificación dentro del encabezado. No soy un codificador experto, y antes de eso solo trabajaba con sitios web que tenían una herramienta WYSIWYG clara.

¿Podría alguien ayudarme con esto? Cualquier sugerencia será muy apreciada.

Muchas gracias

(@gappiah)

Hace 1 año, 5 meses

Hola,

¿Quieres que esto interfiera con el título y la descripción (también conocido como la marca del sitio), o también con el menú?

Solo para el título y la descripción, agregue lo siguiente CSS EXTRA cuadro en el Personalizador:

.site-branding {
background-color: #fff;
opacity: 0.5;
padding-left: 10px;
padding-right: 10PX;
}

No dude en cambiar el color de fondo, la opacidad y los valores de relleno según el deseo de su corazón.

Si también desea que esto interfiera con el menú, utilice lo siguiente en su lugar:

.site-header .tg-header-container {
background-color: #fff;
opacity: 0.5;
}

(No necesitamos las almohadillas porque ya hay mucho espacio vacío alrededor del contenedor)

Si desea aplicar esto a todo el encabezado, sería la clase más segura en la que centrarse tg-site-header-bottom. Uso:

.tg-site-header-bottom {
background-color: #fff;
opacity: 0.5;
}

Y es posible que desee eliminar la imagen remanente en la parte inferior:

.tg-site-header {
padding-bottom: 0px;
}

¡Buena suerte!

(@ fnwp2019)

Hace 1 año, 5 meses

Hola George,

¡Muchas gracias por tu ayuda! Usé la segunda solución que proporcionaste (para incluir el menú) y ¡funcionó perfectamente!

¡Gracias por tomarse su tiempo para ayudarme con esto!

(@gappiah)

Hace 1 año, 5 meses

Me alegro de poder ayudar.

Por cierto, aquí hay otro resultado fácil de arreglar en su sitio web.

Todas sus direcciones utilizan las direcciones de inicio http://just2001.temp.domains/~corylove/, en vez de http://corylovesbeer.com/

Para solucionar este problema, vaya a AJUSTES => GENERALy ambas cosas cambiaron Dirección de WordPress (URL) y Dirección del sitio (URL) a http://corylovesbeer.com (¡tenga cuidado de ingresar la dirección correcta, ya que un error podría romper el sitio!)

¡Buena suerte!

¿Solucionó tu problema??

0 / 0

Deja una respuesta 0

Tu dirección de correo electrónico no será publicada.