Mejorar vista móvil  

Hola,

La plantilla que estás utilizando ya es de tipo responsive, por lo que se tendría que adaptar a móviles.

Por las capturas que adjuntas, parece que el problema principal está en cómo muestra el precio. Esto está provocado por un estilo CSS personalizado que has añadido en el archivo /templates/epimeteo/css/epimeteo-custom.css. En concreto, se trataría del siguiente:

.productlist .price-box .PricesalesPrice { position: absolute; right: 50px; }

Prueba a quitar esto y mira si se soluciona el problema.

Efectivamente, Pablo.
He hecho lo que me has dicho, y ahora en el móvil salen bien los precios, pero en el ordenador salen a la izda, y quedan fatal.
¿Podríamos cambiar la plantilla epimeteo por la de anthe? Anthe es la que tenemos en la otra tienda, y me gusta mucho más...
¿Me dices como hacerlo?
Mil gracias!

Hola

Si quieres que el precio aparezca centrado puedes evaluar usar el siguiente código CSS:

.productlist .price-box .PricesalesPrice{
	float:none;
	text-align:center;
}

Coloca este código al final del archivo:
/templates/epimeteo/css/epimeteo-custom.css

Si deseas cambiar de theme puedes solicitar los instaladores del theme a través de tickets de soporte, ten en cuenta que tendrías que configurar de manera manual para que te quede igual que en la demo.

Saludos.

Guayyyy, ahora se queda molón, y se ve bien desde el móvil.
Pero me sigue pasando esto:

Y esto:

¿Como puedo hacer que el encabezado se adapte a la pantalla del móvil, aunque se quede pequeñito?

Jhon, a qué te refieres con

Si deseas cambiar de theme puedes solicitar los instaladores del theme a través de tickets de soporte, ten en cuenta que tendrías que configurar de manera manual para que te quede igual que en la demo.

¿Qué me recomendáis? ¿Que modifique esta plantilla para dejarla optimizada al 100% para los móviles, o que instale la plantilla anthe? ¿Qué me sale más a cuenta?

Gracias de nuevo.

Hola

En caso tengas tiempo y deses probar otro theme si que puedes hacerlo, tienes que solicitar los instaladores a través de tickests de soporte porque instalarás el theme de manera manual en tu sitio actual.

Lo que te recomiendo es que sigas con el theme Epimeteo ya que tienes bastante avanzado tu sitio, además que tendrás problemas similares con el otro theme, ya que por ejemplo tu logo seguirá viendose recortado en móvil.

En cuant a tu logo, es muy grande para movil, lo que te recomiendo es evaluar cambiar la versión de tu logo en movil, te sugiero revisar el siguiente artículo, es para WordPress pero la idea es bastante similar ya que el cambio debes hacerlo por CSS:

https://decodecms.com/cambiar-el-logo-en-la-version-movil-de-tu-sitio-web/

Saludos.

Hola Jhon!!

Llevas razón, el logo es muy grande. Pero te digo una cosa: en nuestra web oficial (que no está alojada en webempresa por razones ajenas, y que me encantaría pasarla a webempresa) tenemos el mismo logo. Está en Joomla también, y además, la plantilla la hice yo misma con el Artisteer.

Cuando entras en esa web desde el móvil, el logo se encoge hasta adaptarse a la pantalla. La web es www.moringa.es

Miraré lo que me has pasado, a ver si puedo hacer algo, y si no, te vuelvo a consultar.

Por favor, no me cerréis el hilo.

Gracias!!

Hola Elena.

Ok, dejamos el hilo en espera por si necesitas alguna aclaración sobre el tema que estamos tratando.

Un saludo

Buenos días de nuevo.
Tengo que reparar 2 cosas de la vista móvil.

1.- El logo.
2.- La captura que os adjunto:

----------------------------

Respecto al logo:
En mi epimeteo-custom.css tengo el siguiente código respecto al logo. Yo no sé como tengo que hacer, o qué código poner para cambiar ese, y que cuando entren desde el móvil se ajuste a la pantalla:

.logo-block{ display:inline-block; margin:auto; }

-----------------------------

Respecto a la captura que os envío:
Creo que tiene que ver con el número de caracteres del título. ¿Como puedo arreglarlo?

Gracias!!

Hola Elena.

Creo que tiene que ver con el número de caracteres del título. ¿Como puedo arreglarlo?
¿ te refieres al espacio en blanco ?, esto esta reservado para el botón de añadir al carro y no se puede modificar.

Sobre el logo prueba lo siguiente:
.- edita el archivo epimeteo-custom.css

Añade lo siguiente al final del archivo

@media screen and (max-width:470px) {
#rt-logo {
background-size: 300px  77px;
}
}

Lo que veo que el logo es enorme, no se si tendrías que plantearte eliminar todo ese texto que tienes en el logo y dejar solo la imagen.

Todo lo demás lo puedes añadir en un slider o una imagen.

Un saludo

Pepe... no me funciona lo del logo.
He entrado desde dos navegadores diferentes desde mi móvil, y sigue apareciendo el logo enorme...
Lo de cambiarlo, no depende de mí, jejeje! Pero se lo plantearé al que manda 😉 😉
Me gustaría que quedara así:

¿Como puedo hacerlo, hasta que logre convencer al que manda de que lo cambiemos por uno más pequeño?

Gracias!!! :blush:

Hola

Con respecto al tema del logo prueba con el siguiente código :

@media (max-width:768px){
	#rt-header #rt-logo{
		height:100px;
		width:360px;
		background-size:100%!important;
	}
}

Puedes agregar este código al final del archivo:
/templates/epimeteo/css/epimeteo-custom.css

Saludos.

Gracias Jhon!!!
He puesto ese código, y queda cuasi perfecto!! Es más, después de poner ese código he pasado el test de google, y la visibilidad móvil ha pasado del 88 al 98 %

Graciasssss!!!!!

¿Como podemos arreglar lo de que se vean así de descolocados los productos?
¡Gracias!

Hola Elena.

Añade lo siguiente código:

@media screen and (max-width:470px) {
.productlist h4 a {
font-size:10px;
}

Comprueba los resultados y nos comentas 😉

Un saludo

Eyy, bastante mejor, pero en cuanto el título de un producto se pasa a tres líneas, me lo descuageringa todo...

Tendré que bajar los caracteres del título. Al principio de crear la web los subí...

Gracias!!