search icon

jQuery i WordPress

Det er ret nemt at bruge jQuery i WordPress. Man behøver ikke engang at hente jQuery ned til et WordPress-site eller linke til det via et CDN. Det er allerede med i WordPress-installationen.

Enqueue jQuery

Da jQuery allerede er et registreret script i WordPress kan det nemt enqueues. Dette gøres i et child-themes functions.php eller i et plugin som her:

<?php
  //Funktionenen enqueue_jquery tilføjes med hooket wp_enqueue_scripts
  add_action('wp_enqueue_scripts', 'enqueue_jquery');

  //Funktionen enqueue_jquery oprettes
  function(){
    wp_enqueue_script('jquery');
  }

Når man bruger hooket wp_enqueue_scripts og funktionen wp_enqueue_script sørger WordPress for, at jQuery kun bliver indlæst 1 gang. Hvis man installere et plugin, hvor jQuery allerede er enqueued forhindrer man, at det bliver indlæst flere gange.

Skriv jQuery

Som standard kan man skrive jQuery-scripts med $ som alias for jQuery. Det kan man i udgangspunktet ikke med den version, der er bundlet i WordPress. Dette skyldes, at andre biblioteker også bruger $-tegnet så for at undgå konflikter er dette sat. Man kan dog komme omkring dette

<script>
//jQuery i WordPress
jQuery(document).ready(function(){
  jQuery(.class-selector).css("color", "skyblue");
});

//jQuery i WordPress med $-tegn
(function($){ 
  $(document).ready(function(){
    $(".class-selector").css("color", "BADA55");
  });
})(jQuery);

//jQuery med $-tegn ES6+
(($) => {
  $(document).ready(() => {
    $(".class-selector").css("color", "BADA55");
  });
})(jQuery)
</script>

Skriv et svar

Verified by MonsterInsights