Avisos
Vaciar todo
Hola
a falta de una semana para pasar a produción, los socios están probando en diferentes dispositivos y diferentes ordenadores, con navegadores y sistemas operativos diferentes.
Estamos con un pack de webempresa joomla 3.2.3 con la plantilla encelado.
Sabiendo que no se puede visualizar siempre igual y que cada sistema interpreta como quiere las webs, me he encontrado con este problema :
En un portatil pequeño La barra de navegación se ve en dos lineas ( me han comentado que incluso tres) y ademas cuando se pasa el ratón para elegir algun item de la parte superior los de abajo se mueven de sitio como si no cupieran.
En cambio en alguna tableta pequeña se ve bien y la barra pasa a modo "responsive"
Podría hacerse algo para que esto no ocurrra? esto de pasar a doble o triple linea y moverse los items de menú?
No solo es bastante feo estéticamente y difícil de uso para las personas problemas de movilidad , ya que los item de la segunda linea se mueven de lugar.
Envío captura pantalla, he pintado de amarillo lo que comento.
Gracias , un saludo y esperando su respuesta
URL del sitio: Contenido solo visible a usuarios registrados
Respondido : 29/03/2014 4:08 pm
Hola
La plantilla Encelado es 100% responsive y se ve correctamente en dispositivos móviles, tables y equipos de escritorio habituales.
El menú tiene el comportamiento correcto dependiendo de la situación (móvil, tables, PC). ¿Puedes por favor cotejarlo haciendo pruebas pero con nuestra demo oficial?
- http://demopackempresa.webempresa.eu/encelado/
Tu plantilla tiene cambios que difieren de la original y es posible que alguno de esos cambios haya provocado que ahora el menú superior no tenga el comportamiento original.
Saludos
Respondido : 30/03/2014 8:19 am
Hola, gracias por la respuesta.
He llegado a saber qué es lo que pasa y lo cuento por si sirve a alguien mas y por si hay alguna otra posibilidad:
Los cambios realizados los he anulado y probado y seguía comportándose de es manera (haciendo dos y tres renglones) en un portátil de 10 pulgadas con el sistema xp. De modo que sigo investigando las diferncias de encelado tal cual y nuestra versión y me doy cuenta que la barra hay mas item, mas letras, asi que he deconectado dos items para que tuviera mas o menos las mismas letras y... OK.
Conclusión: la barra funciona bien, los cambios realizados no interfieren y no se puede colocar tantos items.
Ahora nuestro problema es cómo resumir esta barra que debería tener en un total de 47 letras+1 (la original de enecelado) y en la realidad tiene 66 letras+2 espacios entre palabras.
A parte de quitar items o reducir el tamaño de la letra (no muy conveniente) Si tienes/tenéis alguna idea...
Gracias , un saludo
Respondido : 30/03/2014 10:23 am
HOla AEFCA
El problema es los cambios que has agregado, por ejemplo el borde superior, si quieta el borde superior en el hover no sucede este problema
El tema es el espacio, al añadir 1px más de borde al hover todo se desordena
Evalua colocar un padding-top:0, ubica el archivo
/1j3/templates/encelado/css/encelado-custom.css
En la línea 12 aprox agrega el padding-top
.gf-menu li:hover > .item{
color:#00C0C0 !important;
border-top: solid 1px #02408A;
padding-top:0;
}
Saludos.
Respondido : 30/03/2014 8:46 pm
Gracias, he realizado lo que me comentas y soluciona parcialmente el problema: la segunda linea se comporta de un modo menos errático.
Cuando reduzco mi navegador hasta un tamaño mas o menos de 10 pulgadas y coloco el ratón sobre los primeros items la segunda fila permanece en su lugar pero cuando coloco sobre los tres últimos, los mas a la derecha por ejemplo encima de noticias , la segunda fila se convierte en tres lineas y es un caos.
Sigo buscando posibilidades, si hay mas ideas yo agradecida y dispuesta a ir probando para que quede lo mejor posible en la mayoría de dispositivos.
Un saludo
Respondido : 30/03/2014 10:17 pm
Hola,
Una prueba que podrías hacer es a cambiar el espacio asignado para el logo y para el menú, que actualmente está con una distribución de 3 partes para el logo y 9 para el menú. Podrías probar a cambiarlo para que sean 2 partes de el logo y 10 para el menú.
Para hacer esto vete en la administración de Joomla a Extensiones->Gestor de plantillas y edita la plantilla Encelado - Default. Pulsa en la pestaña Layouts. Para la posición Posiciones Header utiliza la barra para cambiar de la distribución 3|9 a 2|10. En el siguiente vídeo puedes ver más información sobre cómo hacer esto:
Respondido : 31/03/2014 4:19 pm
Hola
acabo de probar lo de cambiar
el espacio asignado para el logo y para el menú, que actualmente está con una distribución de 3 partes para el logo y 9 para el menú. Podrías probar a cambiarlo para que sean 2 partes de el logo y 10 para el menú
Y empeora la situación ya que en pantallas pequeñas el item inicio se esconde detrás del logo y sigue produciéndose el desdoble en dos lineas.
Gracias por la propuesta pero aún no hemos dado con la solución que mucho me temo pasa por quiatr algun item de la barra y colocarlos en cualquier otro lugar, con lo que supone de dispersión.
Un saludo
Respondido : 31/03/2014 10:26 pm
Hola,
En tal caso y, tal como comentas, lo mejor es que tengas menos elementos de menú en el menú superior. Ten en cuenta que puedes crear otros menús en la barra lateral o en el pie de la web, o que puedes hacer que alguno elementos de menú sean submenús de otros.
Respondido : 01/04/2014 3:22 pm
Al final hemos reducido el número de items en la barra de navegación yasí funciona correctamente.
Cerramos el tema.
Gracias
Un saludo
Respondido : 05/04/2014 8:44 am
