Avisos
Vaciar todo

Hacer clic en logo y en slider para ir a la home  

Página 1 / 2
 
Francisco
 Francisco
Estimable Member

Hola,

Veo que en la versión móvil no funciona al hacer clic en el logo para ir a la home. En cambio, sí funciona un botón derecho (dejando pulsado en versión móvil).

Os ha pasado? Se os ocurre cómo solventarlo? Si no, podemos poner un código css?

Una duda similar me sucede con el slider, pero esto tanto en versión móvil como en desktop, para que funciona el botón pero no el slider (supongo que es del plugin pero con un código css entiendo que se podrá conseguir).

Gracias!

Saludos

Contenido solo visible a usuarios registrados

Citar
Respondido : 25/12/2023 10:16 pm
Bruno
 Bruno
Soporte CMS Webempresa Moderator

Que tal Francisco,

Al revisar tu sitio he podido determinar de que tu logo en moviles no es que no funcione sino que hay un error en la maquetacion de la cabecera

En la vista de moviles hay un elemento que al parecer queda superpuesto sobre el logo y es por ello que cuando hacen clic no ejecuta ninguna accion

image

Mas que plantear una solución con CSS lo recomendable es ajustar la maqueta para que no tena elementos superpuestos pese a que no estan visibles

Si estas trabajando con un constructor visual recuerda que puedes usar a tu favor el atributo z-index

https://www.w3schools.com/cssref/pr_pos_z-index.php

Valida y nos comentas

Saludos!

ResponderCitar
Respondido : 25/12/2023 10:32 pm

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

Francisco
 Francisco
Estimable Member

Es posible que sea por haber "forzado" código adicional css? Tiene que ser eso pq antes iba...

Estoy usando una plantilla  y he tocado el css adicional.

ResponderCitar
Respondido : 25/12/2023 10:40 pm
Francisco
 Francisco
Estimable Member

Tendrá que ver con este CSS adicional, entiendo:

 

@media only screen and (max-width: 450px) {
#mySidenav.nav {
margin-top: -5em;
}
.menu-box {
margin-left: 7em;
}
}

 

Habrá que acotar ancho y alinearlo a la derecha?

ResponderCitar
Respondido : 25/12/2023 11:41 pm

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

Francisco
 Francisco
Estimable Member

Porque veo que pasa igual con el botón register... Igual es aconsejable un css adicional que deje arriba LOGO y REGISTER y acotar el ancho del módulo que soporta las 3 lineas del menú? Si eso no funcionara, siempre podemos dejar en un segundo nivel las 3 lineas del menú.

ResponderCitar
Respondido : 25/12/2023 11:57 pm
Bruno
 Bruno
Soporte CMS Webempresa Moderator

Hola Francisco

Ese es el único CSS adicional que estas aplicando?

No veo que sea el interfiere en la funcionalidad, tal y como cite en mi respuesta anterior hay un elemento superpuesto sobre el logo lo que impide que funcione el enlace al home

Por favor valida la estructura del menú y si tienes más CSS agregado puedes mostrarnos 

Saludos!

ResponderCitar
Respondido : 26/12/2023 2:56 am

Francisco
 Francisco
Estimable Member

@bruno-vichetti hay todo esto:

@media only screen and (max-width: 450px) {
#mySidenav.nav {
margin-top: -5em;
}
.menu-box {
margin-left: 7em;
}
}
.main-navigation ul li a:hover {
color:#fdc800;
}
a.btn.font-weight-normal.register {
font-weight:100;
font-size: 1rem;
}
a.btn.font-weight-normal.register:hover {
background-color: #fdc800!important;
color: #fefefe!important;
font-weight:100;
}
#topbar .topbar-social-icons i:hover {
color:#fdc800!important;
}
@media (max-width: 600px) {
a.btn.font-weight-normal.register {
float: right;
margin-top: -2.8em;
}
.top_social.d-inline {
float: right;
margin-top: -2.2em;
}
#header i{
font-size: 25px;
text-align:left;
width: 0px;
padding: 25px;
color: #91a5a5;
}
}
.fa, .fas, .far, .fal, .fab {
-moz-osx-font-smoothing: grayscale;
-webkit-font-smoothing: antialiased;
display: inline-block;
font-style: normal;
font-variant: normal;
text-rendering: auto;
line-height: 0;
}
section#header {
background-color: #0c426f;
padding: 15px;
color: white
}
section#topbar {
background-color: #91a5a5;
padding: 5px;
color: white;
}
#topbar i {
color: #ffffff;
font-size: 18px;
}
.main-navigation a {
font-size: 14px;
letter-spacing: 1px;
color: #fff;
}
a.register-btn {
padding: 12px;
border-radius: 6px;
text-transform: none;
font-weight: 600;
background: #fac300;
}
.headerbox i {
color: #fff;
background: #5ba5af;
padding: 13px;
border-radius: 8px;
}

ResponderCitar
Respondido : 26/12/2023 8:46 am
Pepe
 Pepe
Soporte CMS Webempresa Admin

Hola Francisco.

El error es por el siguient ecodigo:

@media only screen and (max-width: 450px) {
#mySidenav.nav {
margin-top: -5em;
}
.menu-box {
margin-left: 7em;
}
}

 

Lo que puedes hacer es central el logo, por ejemplo prueba con lo siguiente:

@media only screen and (max-width: 780px) {
.custom-logo {
height: auto!important;
width: 150px!important;
}
section#header {
text-align: center;
}
}

 

Elimina el primer código y prueba con este ultimo.

 

Un saludo

ResponderCitar
Respondido : 26/12/2023 11:27 am

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

Francisco
 Francisco
Estimable Member

Muchas gracias, Pepe. Yo creo que así funciona mejor. Al menos, el enlace del logo va (aunque he querido hacerlo más pequeño y he puesto 80px).

 

Pero no va el botón de register...

Esta publicación ha sido modificada el hace 12 meses por Francisco
ResponderCitar
Respondido : 26/12/2023 11:39 am
Pepe
 Pepe
Soporte CMS Webempresa Admin

Hola Francisco.

Ok ya veo, el problema es la seccion del menu que ocupa todo el espacio y se superpone con los botones.

Elimina lo anterior y prueba con lo siguiente:

@media only screen and (max-width: 780px) {
.custom-logo {
height: auto!important;
width: 80px!important;
}
section#header {
text-align: center;
}
img.custom-logo {
margin-left: -2em;
}
div#mySidenav {
width: fit-content;
margin-top: -4em;
}
.internal-page-header {
width: 80px;
}
}

 

Un saludo

ResponderCitar
Respondido : 26/12/2023 2:39 pm

Cursos Gratuitos WordPress

Francisco
 Francisco
Estimable Member

@pepesoler muchas gracias, Pepe. Ahora parece que sí. Alguna idea para alinearlos? O al ser módulos de distinto tamaño no es fácil y variará según el terminal?

Mil gracias!!

ResponderCitar
Respondido : 26/12/2023 3:56 pm
Karen Rios
 Karen Rios
Soporte CMS Webempresa Moderator

Hola Francisco, 

Entiendo que en este caso quieres alinear el botón del menú y acceder en tu versión móvil, si es así revisa si con el siguiente código CSS logras modificar lo que necesitas. 

@media (max-width: 600px){
#header i {
padding: 0px;
margin-top: 25px;
}
a.btn.font-weight-normal.register {
margin-top: -2.4em;
}
}

Un Saludo  

ResponderCitar
Respondido : 26/12/2023 4:29 pm

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

Francisco
 Francisco
Estimable Member

@karen así se me queda alineado verticalmente logo y register

Yo quiero alinear horizontalmente el menú de la versión móvil, el logo y el register. Si lo ves ahora, no está del todo alineado :S

 

Gracias!!

ResponderCitar
Respondido : 26/12/2023 5:00 pm
Karen Rios
 Karen Rios
Soporte CMS Webempresa Moderator

Hola Francisco, 

Puedes enviarnos una imagen señalando como deseas alinearlo, de esta forma podemos revisarlo mejor y tener una mejor idea sobre como lo necesitas configurar. 

Un Saludo 

ResponderCitar
Respondido : 26/12/2023 5:06 pm

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

Francisco
 Francisco
Estimable Member

Adjunto imagen 🙂

Alinear

 

ResponderCitar
Respondido : 26/12/2023 5:13 pm
Página 1 / 2