Script JS selon ID d’un article WP (Créer un compte)

  • WordPress :5.2
  • Statut : non résolu
7 sujets de 1 à 7 (sur un total de 7)
  • Auteur
    Messages
  • #2293248
    Julie MFV
    Participant
    Initié WordPress
    19 contributions

    Bonjour,

    Ma configuration WP actuelle

    • Version de PHP/MySQL : 7.0
    • Thème utilisé : Salient
    • Extensions en place :
    • Nom de l’hébergeur : OVH
    • Adresse du site :

    Problème(s) rencontré(s) :

    Bonjour,

    Comme le titre du sujet l’indique, j’ai intégré dans le fichier header.php de mon site WordPress un script js pour effectuer une action hide/show.

    Problématique : n’étant pas une experte js, j’ai intégré l’ID de l’article dans chaque script (ce qui n’est pas très dynamique et viable).

    <script>
    $(function(){
    $('article#4006 .affiche-clic').hide()
    $('article#4006 .moins').hide()
    $('article#4006 .triangle-code-moins').hide()
    });
    $(function(){
    $('article#4006 div.infos-offres a.clic-plus').click(function(){
    $('article#4006 div.infos-offres div.affiche-clic').show()
    $('article#4006 .moins').show()
    $('article#4006 .plus').hide()
    $('article#4006 .triangle-code').hide()
    $('article#4006 .triangle-code-moins').show()
    });
    });
    $(function(){
    $('article#4006 div.infos-offres a.clic-moins').click(function(){
    $('article#4006 div.infos-offres div.affiche-clic').hide()
    $('article#4006 .plus').show()
    $('article#4006 .triangle-code').show()
    $('article#4006 .triangle-code-moins').hide()
    $('article#4006 a.clic-moins').hide()
    });
    });
    $(function(){
    $('article#4006 .triangle-code-moins').click(function(){
    $('article#4006 div.infos-offres div.affiche-clic').hide()
    $('article#4006 .plus').show()
    $('article#4006 .triangle-code').show()
    $('article#4006 .triangle-code-moins').hide()
    $('article#4006 a.clic-moins').hide()
    });
    });
    </script>

    Quelqu’un aurait-il le morceau de code qui va bien ?

    Merci d’avance.

    #2293360
    ferman
    Participant
    Maître WordPress
    2138 contributions

    Bonjour,

    Pour que ce soit dynamique, vous pourriez peut-être essayer de  récupérer l’ID de l’article sur lequel vous êtes en  utilisant le petit bout de code suivant  à placer dans le header:

    <?php $article_id = get_the_id();?>

    et utiliser le principe décrit ici qui permet de passer simplement une variable php à js. Sans garantie: je ne suis pas non plus expert en js.

     

    • Cette réponse a été modifiée le il y a 2 mois et 3 semaines par ferman.
    #2295427
    Julie MFV
    Participant
    Initié WordPress
    19 contributions

    Merci ferman,

    J’ai testé ta solution, cela fonctionne mais la difficulté est finalement que mon morceau code est dans le fichier header.php (et non sur un template).
    Je cherche donc le même type de formule qui stocke tous les id des articles pour qu’ensuite, je puisse appliquer mon js à chaque id indépendamment…

    Des idées ?

    #2295490
    Inglebard
    Participant
    Chevalier WordPress
    111 contributions

    Bonjour,

    Le script doit il être le même pour tous les articles ?

    Si oui remplacé uniquement article#4006 par article.

    • Cette réponse a été modifiée le il y a 2 mois et 1 semaine par Inglebard.
    #2298333
    Julie MFV
    Participant
    Initié WordPress
    19 contributions

    Merci Inglebard.

    Le script est effectivement le même pour tous les articles mais ceux-ci étant tous sur la même page, ta solution (qui était mon code initial) ne fonctionne pas : ainsi au clic, ce sont tous les articles qui s’ouvrent (et j’aimerais qu’ils s’ouvrent indépendamment les uns des autres…)

    #2298339
    Inglebard
    Participant
    Chevalier WordPress
    111 contributions

    Difficile de te renseigner plus sans avoir la structure HTML.

    • Cette réponse a été modifiée le il y a 1 mois et 2 semaines par Inglebard.
    #2298423
    ferman
    Participant
    Maître WordPress
    2138 contributions

    Bonjour,

    Il est possible d’envoyer une fonction JS à l’article visité en “l’empaquetant” dans une fonction php et en utilisant le “hook” “the_content”.

    function essaijs(){
    	
    	$posttitle=get_the_title( $post_id );
    	
    	if (is_single ($posttitle)){
    	
    	echo'
    	<h2>JavaScript Functions</h2>
    
    	<p>This example calls a function which performs a calculation, and returns the result:</p>
    
    	<p id="demo"></p>
    
    	<script>
    	function myFunction(p1, p2) {
    	return p1 * p2;
    	}
    	document.getElementById("demo").innerHTML = myFunction(4, 3);
    	</script>';
      }
    }
    add_filter ('the_content', 'essaijs');

    Ici une fonction simple et les éléments html nécessaires sont expédiés en même temps dans le corps de l’article.

    Cela vous sera peut-être utile? Encore que je ne sois pas sûr du tout de ce que vous voulez faire.

    JS et moi ça fait deux.

     

    • Cette réponse a été modifiée le il y a 1 mois et 2 semaines par ferman.
7 sujets de 1 à 7 (sur un total de 7)
  • Vous devez être connecté pour répondre à ce sujet.