Désactiver le zoom WooCommerce

Rédacteur : LaRedac

27 avril 2022

Désactiver le zoom WooCommerce au survol des images d’un produit

Avec l’outil de zoom WooCommerce, vous pouvez augmenter la taille d’un produit afin de mieux le voir. Cependant, la fonction zoom peut être désactivée au survol des images d’un produit. Dans ce tutoriel, vous verrez comment désactiver le zoom sur les images des produits sans aucun plugin additionnel.

Désactiver le zoom sur les images d’un produit WooCommerce

WooCommerce

Désactiver le zoom WooCommerce
Désactiver le zoom WooCommerce

Le CMS WooCommerce, créé en 2011, a été développé par WooThemes, un éditeur de plugins WordPress. Le logiciel est libre et gratuit et peut être utilisé dans n’importe quel projet open source ou commercial. Sa simplicité et sa souplesse en font un système d’affaires très apprécié par les entrepreneurs dans le monde entier.

Fonctionnement du zoom WooCommerce

Le fonctionnement du zoom a été ajouté à WooCommerce depuis la version 2.7. Après le passage à la version 2.8, le zoom est devenu un composant indépendant qui peut être utilisé sur tous les ensembles du site et peut être configuré pour les produits individuels et pages de produits.

Le zoom est une fonctionnalité de WordPress qui permet de zoomer sur une image ou un contenu. L’utilisation de cet outil permet de créer une expérience unique et plus interactive.

Sur ordinateur

Sur ordinateur, le zoom se déclenche au survol de la souris. Un clic sur l’image zoomé n’aura aucun effet, sauf à cliquer sur la loupe, ce qui ouvrira l’image en plein écran.

Désactiver zoom WooCommerce
Désactiver zoom WooCommerce

Sur mobile

Sur mobile, ce zoom ne fonctionne pas. Le fait de toucher l’image aura pour résultat d’ouvrir cette dernière en plein écran.

Pourquoi enlever le zoom dans WooCommerce ?

Les raisons d’enlever le zoom dans WooCommerce sont multiples.

– Car vous présentez un produit virtuel et l’image n’est qu’une illustration. Voici un exemple de produit avec une illustration : Créer son site internet soi-même

– Pour mettre des images plus légères afin d’accélérer votre temps de chargement.

Ce dont vous aurez besoin

Un thème enfant

Les thèmes enfants sont des thèmes que vous pouvez construire à partir d’un parent existant. Ils sont très faciles à utiliser et à personnaliser. Un thème enfant est créé à partir d’un thème parent déjà existant. Il ne dispose pas de fonctionnalités de base telles que l’ajout de texte, de photos, de médias et de bibliothèques d’images. Le thème enfant est modifiable à l’aide du thème parent selon vos besoins. Vous pouvez le personnaliser et l’utiliser comme un thème de base pour le développement de votre projet.

Son but est surtout de ne pas perdre vos modifications lors de vos mises à jour WordPress.

Vous pouvez utiliser ce générateur de thème enfant de WP marmite.

Avant toute opération ou modification, n’oubliez pas de faire une sauvegarde complète de votre site web ainsi que de la base de données

Si vous ne vous sentez pas à l’aise avec l’installation de votre thème enfant, n’hésitez pas à nous contacter.

Comment désactiver le zoom WooCommerce

Une fois votre thème enfant installé, vous pouvez l’activer dans « Apparence > thèmes »

Rendez-vous maintenant dans « Apparence > Éditeur de fichiers des thèmes »

Enlever zoom WooCommerce
Enlever zoom WooCommerce

En haut à droite de votre, dans le menu déroulant, sélectionnez votre thème enfant.

Cliquez sur « functions.php »

Enlever zoom WooCommerce
Enlever zoom WooCommerce

Dans la fenêtre de gauche, ajoutez ces lignes :

// Désactiver le zoom WooCommerce alphacorp.fr

// =============================================================================

add_action( ‘after_setup_theme’, ‘removing_gallery_zoom’, 100 );

function removing_gallery_zoom() { 

remove_theme_support( ‘wc-product-gallery-zoom’ );

}

// =============================================================================

Il ne vous reste plus qu’à cliquer sur « Mettre à jour le fichier » en bas de la page.

Nous vous conseillons également de vider les caches de votre site si vous utiliser un gestionnaire et celui de votre navigateur.

Merci d’avoir suivi notre tuto

Merci d’avoir suivi notre tuto, nous espérons que cela vous a été utile. Nous restons à votre disposition si vous avez besoin d’assistance pour votre site web.

4.6/5 - (7 votes)

Voir aussi…

Drupal vs WordPress

Drupal vs WordPress : Découvrez Drupal, le CMS Open Source en 9 points. Drupal vs WordPress : WordPress est sans doute...