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 11 respuestas - de la 1 a la 11 (de un total de 11)
  • 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 jose64

    (@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 jose64

    (@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 año, 3 meses 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.

    Iniciador del debate alejoxtd

    (@alejoxtd)

    Hola Compañeros Muchas gracias por estar tan pendientes.

    Resumen
    aplique el Ultimo css del compañero, mejoro mucho la vista, pero no se soluciono.

    Por mi Frustración decidi descargar los Plugings con los que estuve inventando. Custom Woocommerce y XT View. en este ultimo la configuración es en dos pestañas que te anexa a personalizacion como estuve de loco moviendo muchas cosas pues hice lo mismo. a tal caso que cuando fui y mire la version mobile con todo lo que hice y Sumado al CSS del compañero aplicado Horas antes me tope con que estaba peor.

    Asi que elimine el Css del compañero y todo volvio a la normalidad y fue una bendición la cosa es que no se como ni donde estaba mal.

    ni cual fue la solucion de igualmanera Agradesco mucho al compañero @jose64 por su contribución espero este caso pueda servir a alguien en un futuro.

    doy el tema por solucionado no se como se soluciono
    Pero como Consejo no muevan cosas a lo loco 😀

    • Esta respuesta fue modificada hace 1 año, 2 meses por alejoxtd. Razón: Correcciones
Viendo 11 respuestas - de la 1 a la 11 (de un total de 11)
  • El debate ‘Problema Visualizacion de Producto Version movile’ está cerrado a nuevas respuestas.