Pregunta sobre eStore de Wordpress:

Quitar lupa y agregar iconos al carrito

Un usuario preguntó 👇

Hola.

Estoy usando Estore ThemeeGrill con Elementor Pro.

Mi página de TIENDA tiene algunos íconos innecesarios en el medio de las imágenes: el zoom / lupa (al hacer clic en él, muestra la misma imagen y tamaño) y el ícono Agregar al carrito. Como tengo diferentes tamaños de mis productos, los clientes DEBEN ir a la página del producto de todos modos para seleccionar un tamaño; no es necesario ese icono. 1. ¿Existe algún CSS o PHP para eliminar / ocultar el icono «Ampliar / Zoom» delante de las imágenes del producto en la página TIENDA? 2. ¿Existe algún CSS o PHP para eliminar / ocultar el ícono «Agregar al carrito» frente a las imágenes del producto en la página TIENDA? 3. ¿Existe algún código CSS o PHP para hacer clic en las imágenes del producto para que el visitante vaya a la página Productos, en lugar del método oscuro actual de hacer clic en el título del producto debajo de la imagen?

(Elementor dice que esto es un problema de tema, no un problema de Elementor).

Gracias por adelantado. Angie

(@antipodesaudio)

Hace 1 año, 3 meses

Como respuesta general a esto, debe aprender el truco del clic derecho. Mientras visualiza su sitio en un navegador, puede hacer clic con el botón derecho en el elemento para el que desea cambiar el CSS e inspeccionar (si está utilizando Chrome) para ver el html y el CSS asociados con el elemento. ver.

En el CSS, puede experimentar agregando o cambiando código y ver los resultados de inmediato.

Luego copie el código y agréguelo a un archivo CSS o CSS personalizado en el tema de su hijo. Por ejemplo, intente usar este código CSS para ocultar el elemento ‘.estore-cart-views’: .estore-cart-views {display: none; }

Y prueba: .user-wrapper.search-user-block {display: none; }

Puede encontrar el nombre CSS del elemento (por ejemplo, ‘.estore-cart-views’) mediante el truco del clic derecho descrito anteriormente.

Puede ocultar un elemento para todos en lugar de una página definida. Por ejemplo, para obtener una imagen de héroe de ancho completo en mi página de inicio pero no en otras páginas, puedo ocultarla en todas las demás páginas con un código como: corp: not (.home) .header-image-wrap {display : ninguna; }

De manera similar, puede ocultar artículos de tipo tienda en páginas que no forman parte de su tienda con un código como: body: not (.shop) .wcppec-checkout-buttons {display: none; }

Al hacer el truco de clic derecho descrito, y cambia el código CSS para ver el cambio, pero cuando se ingresa como CSS personalizado, no realiza el cambio: – asegúrese de que su caché esté ha limpiado su navegador y la caché de CSS; si no funciona, puede hacerlo. important ‘para agregar su código CSS para evitar que otro código lo anule. Por ejemplo: .my-cart {color: #eeeeee! Importante; }

(@andreagall)

Hace 1 año, 3 meses

Hola @antipodesaudio!

Gracias por su detallada respuesta. Estaba usando la técnica de la página de ‘auditoría’ y di vueltas en círculos, y probé algo de código PHP … Pero por alguna razón, cuando alguien más dice «haz esto», ¡funciona! ¡Los había olvidado! Importante ”y cuando agregué eso, ¡funcionó! Encontré ambas clases de iconos y las desactivé. Finalmente, decidí cómo hacer clic en las imágenes en mi tema y vi que todo lo que tenía que hacer era marcar una casilla debajo de Diseño de página de archivo de WooCommmerce. GRACIAS POR SU AYUDA, ¡SE NECESITA!

Para cualquiera que pueda tener el mismo problema, aquí está el código de “CSS adicional”: —————– / * Página de la tienda – ocultar el ícono de lupa * / a.zoom {display: none! Importante; }

/ * Página de la tienda: ocultar el icono del carrito * / a.button.product_type_variable.add_to_cart_button {display: none! Importante; } ——————————— Para hacer clic en la foto de archivo (imágenes de la página de la tienda), vaya a Apariencia-> Personalizar-> Configuración de WooCommerce-> Diseño de archivo, y marque la casilla “Marcar para pasar el cursor para marcar”. ocultar el efecto en las imágenes del producto en las páginas de archivo de WooCommerce ”.

(@rajeshpoudel)

Hace 1 año, 3 meses

Hola @andreagall,

Para hacer clic en la imagen y ocultar el ícono que se encuentra sobre el producto en la página de la tienda, vaya a Apariencia-> Personalizar-> Configuración de WooCommerce-> Diseño de página de archivo y revisa el Marque para ocultar el efecto de desplazamiento en las imágenes del producto en las páginas de archivo de WooCommerce. Esto hará el truco y no se requerirá CSS adicional.

Gracias.

(@andreagall)

Hace 1 año, 3 meses

Hola Rajesh,

Gracias por su respuesta. Caray, pasé mucho tiempo tratando de averiguar cómo eliminar esos íconos y todo lo que tenía que hacer era marcar una casilla. Ahora lo sé, ¿eh? 🙂 ¡Gracias!

(@rajeshpoudel)

Hace 1 año, 3 meses

Hola @andreagall,

Me alegra saber que su pregunta está resuelta. No dude en volver a preguntar si tiene alguna pregunta sobre el tema.

Gracias.

¿Solucionó tu problema??

0 / 0

Deja una respuesta 0

Tu dirección de correo electrónico no será publicada.