Accueil Forums How to WooCommerce Single product page > Mettre les images après la description sur mobile

Ce sujet a 6 réponses, 2 participants et a été mis à jour par  bayor, il y a 3 mois.

7 sujets de 1 à 7 (sur un total de 7)
  • Auteur
    Messages
  • #126620

    bayor
    Participant
    Points: 14 pts

    Bonjour,

    Dans mes pages produit, sur mobile, les images du produits apparaissent en premier, avant le titre le prix et la description.

    J’aimerais déplacer les images produit (si possible uniquement pour l’affichage mobile) après le titre, le prix et la description, juste avant l’affichage des variations.

    Je sais qu’il faut que j’utilise remove_action(  et add_action(  mais je n’y arrive pas pour les images cela ne fonctionne pas, et je ne sais pas comment faire pour que cela ne s’applique qu’à l’affichage mobile.

    Merci d’avance pour votre aide précieuse !

     

     

     

     

    Pièces jointes:
    #126700

    Guy
    Modérateur
    Points: 2,906 pts
    ModérateurCertifiéFreelance
    Membre 2 étoiles

    Bonjour,

    Si tu ne sais pas déplacer l’image … déplace le titre le titre 😉

    Regarde si ceci fonctionne pour toi:

    https://theme.co/apex/forum/t/move-product-title-on-single-product-page-above-images-on-mobile-only-woocommerce/24848

     

    1 utilisateur a remercié l'auteur de ce message.
    #126889

    bayor
    Participant
    Points: 14 pts

    Bonjour,

    Merci pour cette piste.

    J’ai essayé le code indiqué au bout de votre lien:

    jQuery( function($) { mobile = $(window).width(); if ( mobile <= 480 ){ jQuery( “.product_title.entry-title” ).insertBefore( “.woocommerce-product-gallery” ); } } );

    Mais rien ne se passe.

    Avez vous d’autres pistes à me communiquer ? j’ai beau chercher je ne trouve pas de solution..

    Merci beaucoup pour votre aide !

    #126919

    Guy
    Modérateur
    Points: 2,906 pts
    ModérateurCertifiéFreelance
    Membre 2 étoiles

    Selon l’écran sur lequel tu testes il faut peut-être adapter la largeur de page dans le code (480)

    As-tu bien mis le code dans une partie javascript ?

    1 utilisateur a remercié l'auteur de ce message.
    #126927

    bayor
    Participant
    Points: 14 pts

    Bonjour,

    Merci de votre réponse.

    J’ai inséré le code dans l’espace “Custom JS – Enter your custom Javascript here” de mon thème.

    J’ai testé :

    jQuery( function($) {

    mobile = $(window).width();

    if ( mobile <= 900 ){

    jQuery( “.product_title.entry-title” ).insertBefore( “.woocommerce-product-gallery” );

    }

    } );

    rien ne se passe

    Aussi à coté de l’espace Custom JS de mon thème est noté : “(jQuery selector is “$j” because of the conflict mode)”

    J’ai donc essayé :

    jQuery( function($j) {

    mobile = $j(window).width();

    if ( mobile <= 900 ){

    jQuery( “.product_title.entry-title” ).insertBefore( “.woocommerce-product-gallery” );

    }

    } );

    mais rien ne se passe non plus ..

    Ai-je fais une erreur ?

    Merci beaucoup pour votre aide !

    Pièces jointes:
    #126931

    Guy
    Modérateur
    Points: 2,906 pts
    ModérateurCertifiéFreelance
    Membre 2 étoiles

    Comme je viens de monter un site test j’ai regardé de plus près. Mais mon thème n’a pas d’espace Custom JS, alors j’ai mis le code dans le header du thème entre des balises javascript.

    Ca fonctionne parfaitement, autant avec le sélecteur $ qu’avec $j.

    C’est peut-être une solution de remplacement…

    Ou alors contacte l’éditeur du thème, il pourra certainement expliquer pourquoi ça ne marche pas.

    1 utilisateur a remercié l'auteur de ce message.
    #126933

    bayor
    Participant
    Points: 14 pts

    Merci beaucoup je vais essayer cela !

    Bonne soirée

7 sujets de 1 à 7 (sur un total de 7)

Vous devez être connecté pour répondre à ce sujet.