[Thème enfant] – Problème d’import du fichier JavaScript enfant (Créer un compte)

  • Statut : non résolu
15 sujets de 1 à 15 (sur un total de 15)
  • Auteur
    Messages
  • #563706
    Thibom
    Membre
    Initié WordPress
    16 contributions

    Bonjour,

    WordPress 4.5.2
    – OnePress-child (Thème enfant de OnePress)

    Problème(s) rencontré(s) Bonjour les amis ! J’ai un (drôle) de problème avec l’import du fichier JavaScript de mon thème enfant. Je m’explique :

    Je suis en train de créer un thème enfant du thème “OnePress”, pour faire les choses proprement. De ce fait, j’ai déclarer mon thème enfant dans mon style.css comme indiqué dans le codex. Comme prévu, j’arrive à modifier le css de mon site depuis ce fichier style.css

    Voici ma fonction d’import de mes fichiers, dans functions.php du thème enfant :

    Ce qui me pose problème, c’est le dernier fichier importé, c’est à dire mon fichier test.js. Ce dernier est bien reconnu par mon navigateur, puisque l’adresse “http://localhost/Teamy/wordpress/wp-content/themes/OnePress-child/js/test.js” me renvoie bien le code JavaScript associé. Néanmoins, ce code ne marche pas (getElementById me renvoie null, par exemple).

    La où la chose est étrange, c’est que lorsque je l’importe plus “classiquement”, en passant par le footer, mon script fonctionne. J’utilise cette ligne dans mon footer.php pour faire marcher mon script :

    Le problème de cette méthode, qui fonctionne, c’est que

    1- J’ai un fichier footer.php dans mon thème enfant qui ne me sert qu’à importer ce fichier
    2- Je ne suis pas les recommandations du codex
    3- Je n’aurai pas les prochaines mises à jour du footer du thème, puisque wordpress utilise le footer.php de mon thème enfant.

    Si quelqu’un a déjà rencontré ce problème, parce que la … Je bloque. Merci d’avance ! 🙂

    #1058070
    Thibom
    Membre
    Initié WordPress
    16 contributions

    Bonjour Bonjour !

    Plusieurs jours après, je n’ai toujours pas trouvé la solution à mon problème. Lorsque j’importe “salement” mon fichier via mon footer, tout fonctionne à merveille. Par contre, lorsque j’essaye de passer par la fonction wp_enqueue_script, mon fichier JS ne marche pas (entre autre, tous mes getElementsById renvoient null, etc).

    J’ai vraiment plus ou moins TOUT essayé. Pour l’instant, j’essaye de résoudre mon problème avec le chemin absolu du fichier, pour être sur que l’erreur ne provienne pas d’ici.

    Ce qui est d’autant plus étrange, c’est que WordPress traite bien mon script, puisque je peux retrouver dans le code source cette ligne :

    C’est cette même ligne que j’ajoute manuellement au footer pour faire fonctionner mon script. Je ne comprends vraiment pas pourquoi l’import du fichier JS ne fonctionne pas lorsque je l’inclus avec wp_enqueue_script

    Si quelqu’un à une idée, histoire de coder “proprement” …

    #1058071
    C_Lucien
    Modérateur
    Maître WordPress
    4534 contributions

    Bonjour,

    les deux

    //

    avant

    wp_enqueue_script

    sont réellement dans le functions.php du thème enfant ?

    #1058072
    CAMEO172
    Participant
    Maître WordPress
    1395 contributions

    oui, enlève les deux “//”.. car avec c’est un simple commentaire non interprété par le serveur !

    #1058073
    Treenity
    Modérateur
    Maître WordPress
    779 contributions

    Bonjour,

    Avec un enqueue votre fichier JS est bien chargé c’est bien ca ?
    Pourriez-vous me donner le code contenu dans ce JS ?

    Cordialement

    #1058074
    ferryd
    Participant
    Chevalier WordPress
    297 contributions

    Bonsoir,

    Essaie en utilisant la fonction suivante :

    wp_enqueue_script( ‘child-js’, get_stylesheet_directory_uri() . ‘/js/test.js’, array(), false, true );
    }

    Cela devrait charger ton script dans le footer

    #1058075
    Treenity
    Modérateur
    Maître WordPress
    779 contributions

    Comme a expliqué l’auteur, le fichier est bien chargé, mais le script JS semble mal fonctionné, donc c’est plus un problème de Javascript que de wordpress.
    Envoyez nous votre script dans la balise CODE afin que nous puissions analyser le problème.

    Cordialement

    #1058076
    ferryd
    Participant
    Chevalier WordPress
    297 contributions

    Bonjour,

    C’est certainement plus un problème de Javascript, mais la fonction ci-dessus, a l’avantage de lui expliqué comment chargé le script dans le footer et comment retrouvé le chemin du thème enfant et donc de ne pas avoir ce “http://localhost/…“.

    L’accolade fermante est bien entendu en trop.

    Cordialement

    #1058077
    CAMEO172
    Participant
    Maître WordPress
    1395 contributions

    Un lien et déjà on peut vérifier si le script est visible dans la source et se charge ! Car si c’est le code copiée en début de message, alors c’est sûr que ça ne marche pas.

    #1058078
    Thibom
    Membre
    Initié WordPress
    16 contributions

    Bonjour à tous, désolé pour ce délais de réponse un peu long. Pour vous répondre :

    C_Lucien wrote:
    Bonjour,

    les deux // avant wp_enqueue_script sont réellement dans le functions.php du thème enfant ?

    Oui, ces ‘//’ sont dans mon functions.php du thème enfant, pour la simple et bonne raison que j’importe mon fichier par le footer actuellement. Je passe donc l’import (qui ne fonctionne pas) en commentaire pour ne pas avoir de problème et continuer à écrire mes fonctions en JS. Bien entendu, lorsque je fais des tests, j’enlève les commentaires il en va de soi.

    Treenity wrote:
    Bonjour,

    Avec un enqueue votre fichier JS est bien chargé c’est bien ca ?
    Pourriez-vous me donner le code contenu dans ce JS ?

    Cordialement

    C’est exactement ça. Lorsque j’importe mon fichier par le footer.php (sans passé par le wp_enqueue_script donc) mon fichier JS fonctionne et fait ce qu’il a à faire. Lorsque je l’importe avec le wp_enqueue_script, tous mes getElementById passent à null. Pourtant, dans le code source, je vois que mon fichier est bien importé correctement. J’ai fait une capture d’écran du code source pour vous prouver que mon fichier est bien importé :

    viewer.php?id=941769codesourceJS.png

    Voici mon code JS pour faire des tests.

    console.log(document.getElementById(“masthead”));

    Ce code est bien sur minimaliste, puisque mon problème est dans l’inclusion du fichier. Ce n’est pas un problème avec l’ID de l’élément, puisque “masthead” est dans mon code et que, lorsque j’importe mon fichier JS par mon footer, je récupère bien ce que je veux.

    J’espère avoir répondu correctement à toutes vos interrogations … Et que vous pourrez m’apporter une aide. Merci encore pour avoir pris le temps de me répondre. 🙂

    Thibaut

    #1058079
    Thibom
    Membre
    Initié WordPress
    16 contributions
    ferryd wrote:
    Bonsoir,

    Essaie en utilisant la fonction suivante :

    wp_enqueue_script( ‘child-js’, get_stylesheet_directory_uri() . ‘/js/test.js’, array(), false, true );
    }

    Cela devrait charger ton script dans le footer

    Effectivement, ça marche. Tu as résolu un problème qui me bloque depuis plus d’une semaine en seulement une ligne de code … Merci beaucoup pour ta réponse !

    #1058080
    ferryd
    Participant
    Chevalier WordPress
    297 contributions

    Bonjour,

    La différence que je vois entre le chargement dans le pied de page plutôt que dans l’entête est que dans le premier cas le DOM de la page a plus de chance d’être prêt.

    Dans ton code source minimaliste pour test, on ne voit pas de code d’attente de fin de chargement du DOM.

    #1058081
    Thibom
    Membre
    Initié WordPress
    16 contributions

    Ce n’est pas la première fois que tu me sors une grosse épine du pied, Ferryd. Merci beaucoup pour ton aide.

    En effet, le fait de faire charger la page dans le footer grâce au dernier paramètre est semblable à l’écrire directement en dur, dans le html. J’aurai vraiment dû y penser plus tôt quand même, après plus d’une semaine ..

    Sujet résolu. 🙂

    #2245369
    jmpoulhes
    Participant
    Initié WordPress
    4 contributions

    Bonjour

    J’ai le même problème mais la solution préconisée ne fonctionne pas

    J’essaie de mettre un script dans un thème enfant, (verticalmenu theme) le css marche bien mais le js est chargé mais n’est pas executé..

    j’ai la dernière version de wordpress

    Merci pour votre aide

    #2245372
    PhiLyon
    Modérateur
    Maître WordPress
    27436 contributions

    @jmpoulhes – Bonjour.

    Ouvres ton propre sujet en y remplissant le questionnaire.

    Je ferme celui-ci.

    🙂

15 sujets de 1 à 15 (sur un total de 15)
  • Le sujet ‘[Thème enfant] – Problème d’import du fichier JavaScript enfant’ est fermé à de nouvelles réponses.