Soporte » Diseño – Temas y plantillas » Problema Visualizacion de Producto Version movile

  • Resuelto alejoxtd

    (@alejoxtd)


    Hola compañeros necesito ayuda no logro identificar donde esta el problema quisas alguien con mas conocimiento puede ayudarme a resolverlo al grano

    Cuando ingreso a un producto en version mobile que tiene varias fotos las miniatuaras estas se ven todas grandes igual que la principal

    Imagen de muestra

    alguien sabe donde puede estar el problema en version escritorio todo va bien eso es lo que me deja mas cabezon 🙁

    La página con la que necesito ayuda: [accede para ver el enlace]

Viendo 10 respuestas - de la 1 a la 10 (de un total de 10)
  • Moderador almendron

    (@almendron)

    Me da la impresión que no es un error propiamente dicho. Por debajo de 800px, las miniaturas ya no se muestran sino que aparece la imagen completa.

    Iniciador del debate alejoxtd

    (@alejoxtd)

    si hermano yo la verdad e movido muchas cosas. ya revise toda la parte de personalización en algún punto instale algún plugins que me dejaba personalizar cosas de woocomerce pero lo elimine no se si esto aplico alguna variante de codigo o que.

    ya solo queda investigar donde podemos modificar la minuatura como te digo lo extraño es que solo pasa en Movile. En Escritorio todo normal.

    Alguien con bastante conocimiento sabra donde podemos intervenir este error llevo dias mirando y me tiene frenado pues la version movile hoy en dia es la mas importante

    Moderador Jose Luis

    (@jose64)

    Hola @alejoxtd

    El problema justamente es que moviste cosas, instalaste un plugin para personalizar cosas… y no sabes exactamente qué hiciste.

    Lo ideal es que reviertas todos los cambios que hiciste, si los hiciste con el personalidor del tema puedes usar uno de estos plugins:

    Customizer Reset

    Astra Customizer Reset

    Estos plugins eliminan TODAS las personalizaciones.

    Como último recurso puedes añadir este código al CSS adicional del tema:

    li.product_thumbnail_item.nslick-slide.nslick-active {
        width: 25%!important;
    }
    
    .nslick-vertical {
        height: 150px;
    }

    Con esto muestras las miniaturas a cuatro columnas y eliminas el espacio en blanco debajo de ellas. Si cambias el porcentaje debes ajustar la altura para que las miniaturas de la segunda fila no queden ocultas.

    Recuerda marcar el debate como resuelto, así nos ayudas a mantener el foro al día.

    Iniciador del debate alejoxtd

    (@alejoxtd)

    Hola Jose. Hermano muchas gracias voy hacer un backup y probare las apps que me recomiendas vamos a ver como nos va en unos minutos vuelvo con el resultado. si no aplicamos el código css haber como va

    Iniciador del debate alejoxtd

    (@alejoxtd)

    te cuento el reset no funciono sigue igual. ahora la copia de seguridad no me restaura esta configuracion asi que ahora me toca personalizar todo el sitio 😀

    Iniciador del debate alejoxtd

    (@alejoxtd)

    El Codigo CSS tampoco a funcionado ya que en escritorio afecta esta relacion

    Iniciador del debate alejoxtd

    (@alejoxtd)

    No encuentro mucho que hacer ya que este problema lo tengo unicamente en movile.

    Moderador Jose Luis

    (@jose64)

    Para que te lo aplique únicamente a los dispositivos pequeños tienes que usar media queries, tienes información en:

    Tecnología para desarrolladores web > CSS > Media queries > CSS media queries

    Tienes que envolver el código anterior en la media query correspondiente. El cambio lo realiza al pasar de 767px a 766px de ancho:

    @media only screen and (max-width: 767px) {
      li.product_thumbnail_item.nslick-slide.nslick-active {
        width: 25%!important;
      }
    
      .nslick-vertical {
        height: 150px;
      }
    }
    Iniciador del debate alejoxtd

    (@alejoxtd)

    Gracias hermano
    Aplique el custom CSS y que te digo no se soluciono mejoro no se Ve tan mal

    diablos no se que mas hacer por el momento lo dejare asi pero no es una solucion

    • Esta respuesta fue modificada hace 1 día, 17 horas por alejoxtd.
    Moderador almendron

    (@almendron)

    Lo acabo de comprobar y la solución que te ha dado @jose64 funciona perfectamente. No se por qué dices que «no se soluciono». Eso suponiendo que querías decir eso porque ni te molestas en escribir bien.

Viendo 10 respuestas - de la 1 a la 10 (de un total de 10)
  • Debes estar registrado para responder a este debate.