Avisos
Vaciar todo

Insertar imagen en cabecera  

 
CARLOS
 CARLOS
Usuario activo

Buenas tardes.

Según la captura adjunta, me gustaría saber si hay alguna manera de poder incorporar un .png y sustituir el icono del telefono que está dentro del recuadro en rojo.
También me gustaría saber cual es el .css que hay que tocar para cambiar el color del texto del "Llámanos ahora" que aparece en el mismo recuadro.

Muchas gracias.

URL del sitio: Contenido solo visible a usuarios registrados

Citar
Respondido : 17/08/2016 11:01 pm
Jhon
 Jhon
Soporte CMS Webempresa Moderator

Hola

Con respecto al tema de cambiar el icono, puedes agregar una imagen por html, tienes que modificar el siguiente archivo :

/themes/default-bootstrap/modules/blockcontact/nav.tpl

Ubica el código html de :

Eliminalo y reemplazalo por otro.

Saludos.

ResponderCitar
Respondido : 17/08/2016 11:33 pm

wpdoctor-revisa-la-salud-de-tu-wordpress

CARLOS
 CARLOS
Usuario activo

Buenos días.

Después de muchas pruebas modificando el siguiente codigo que me había indicado

... por este otro:

WhatsApp

... y viendo que no hacia nada... he optado por una prueba que podría ser reveladora, y no es otra que borrar todo el contenido de dicho archivo "nav.tpl"... y cual es mi sorpresa que el resultado sigue siendo el mismo... por lo que, tendrá que ser otro archivo el que haya que tocar.

PD: en todas las pruebas realizadas he borrado toda la caché del navegador, por lo que ese detalle queda descartado.

Muchas gracias.

ResponderCitar
Respondido : 25/09/2016 2:31 pm
Pepe
 Pepe
Soporte CMS Webempresa Admin

Hola Carlos.

Modifica el código por el siguiente:

WhatsApp

Otra opción es modificarlo por css

.shop-phone i {
  background: rgba(0, 0, 0, 0) url("http://www.comercialimperial.com/tienda/img/whatsapp_icono.png") repeat scroll 0 0
}

Un saludo

ResponderCitar
Respondido : 25/09/2016 3:30 pm

optimiza-automaticamente-todas-las-imagenes-de-tu-wordpress

CARLOS
 CARLOS
Usuario activo

He probado con la primera opción y nada... sigue sin modificarse nada.

En cuanto a la segunda, he modificado el "/themes/default-bootstrap/css/global.css" con el codigo que me ha indicado ..,. y tampoco... ¿cual es el CSS que puedo personalizar y que sobreescribe al resto?

Muchas gracias.

ResponderCitar
Respondido : 25/09/2016 3:50 pm
Pepe
 Pepe
Soporte CMS Webempresa Admin

Hola Carlos.
Ok, prueba añadiendo lo siguiente en global.css.

.shop-phone {
    float: left;
    line-height: 18px;
    padding: 5px 0 10px;
    background: rgba(0, 0, 0, 0) url("http://www.comercialimperial.com/tienda/img/whatsapp_icono.png") repeat scroll 0 0;
}

Tendrás que modificar el tamaño del icono hasta que aparezca en las dimensione que necesites.

Un saludo

ResponderCitar
Respondido : 25/09/2016 4:02 pm

Cursos Gratuitos WordPress

CARLOS
 CARLOS
Usuario activo

Buenas noches.

En las 2 imagenes adjuntas puede ver el resultado de sus 2 propuestas anteriores en cuanto a CSS:
icono_whatsapp_en_cabecera_2.jpg
.shop-phone i {
background: rgba(0, 0, 0, 0) url("http://www.comercialimperial.com/tienda/img/whatsapp_icono.png") repeat scroll 0 0
}

icono_whatsapp_en_cabecera_3.jpg
.shop-phone {
float: left;
line-height: 18px;
padding: 5px 0 10px;
background: rgba(0, 0, 0, 0) url("http://www.comercialimperial.com/tienda/img/whatsapp_icono.png") repeat scroll 0 0;
}

En ambas opciones (redimension a parte de las dimensiones del logotipo de whatsapp), el icono original del teléfono NO desaparece... y lo que quiero es sustituir dicho icono por el de Whatsapp (no ponerlo el nuevo icono como fondo).

Muchas gracias.

ResponderCitar
Respondido : 25/09/2016 10:40 pm
Pepe
 Pepe
Soporte CMS Webempresa Admin

Hola Carlos.

Para eliminar el icono, prueba añadiendo lo siguiente:

.shop-phone .icon{
display:none;
}

Un saludo

ResponderCitar
Respondido : 26/09/2016 10:38 am

Gestor de Contraseñas - VPN Conexión Segura - Gestor 2FA (Segundo Factor de Autenticación

CARLOS
 CARLOS
Usuario activo

Buenos días.

El icono de la cabecera NO se oculta con el ultimo código que me comentó... ¿alguna otra idea para ocultarlo?

Muchas gracias.

ResponderCitar
Respondido : 04/10/2016 12:19 pm
Pepe
 Pepe
Soporte CMS Webempresa Admin

Hola Carlos, Buenos Días.

Supongo que lo que quieres es añadir el icono de ' whatsapp '
Estos icono son parte de la fuente ' fontawesome ', entre los muchos iconos de esta fuente se encuentra el de ' whatsapp '

Para añadirlo solo tienes que sustituir la linea:

Por esta:

El resultado es el siguiente:

Nota: Recuerda eliminar los códigos que te pasamos anteriormente.

Un saludo

ResponderCitar
Respondido : 04/10/2016 2:45 pm

wpdoctor-revisa-la-salud-de-tu-wordpress

CARLOS
 CARLOS
Usuario activo

Buenas...

En el archivo /themes/default-bootstrap/modules/blockcontact/nav.tpl he sustituido lo que me has dicho ... incluso con este otro codigo que he encontrado en algún foro:
aria-hidden="true">

... pero nada... sigue apareciendome el icono original del telefono

Te envío mi nav.tpl y mi global.css a ver que puedo tener mal y me cuentas....

ResponderCitar
Respondido : 04/10/2016 3:51 pm
CARLOS
 CARLOS
Usuario activo

Ya he encontrado la solución por si quiere dejarla documentada para otros casos

#En /themes/default-bootstrap/css/global.css hay que sustituir esta linea

.icon-phone:before {
content: ""; }

por esta otra:

.icon-phone:before {
content: "f232"; }

ResponderCitar
Respondido : 04/10/2016 4:03 pm

optimiza-automaticamente-todas-las-imagenes-de-tu-wordpress

Pepe
 Pepe
Soporte CMS Webempresa Admin

Hola Carlos.

Jejeje, que bien 😉 , me alegro que lo solucionaras, seguro que nos vendrá bien tanto a nosotros como a otros usuarios.

Gracias por compartirlo.

Cerramos el hilo

Un saludo

ResponderCitar
Respondido : 04/10/2016 4:18 pm