WordPressでJavaScriptを読み込むには「script」タグを直接書き込んでは動かない

2020年05月11日(月)

Category: IT関係, こだわり, プライベート, 磨く

コロナの影響で時間があるので、HPのシステムをバージョンアップするために、プログラミングの画面とにらめっこしています。
忘備録として記します。

常に触れているわけではないので、大事なところを忘れていたりすることが多いのです。
実際、Javascriptを読み込ませようとしてもどうやってもうんともすんとも動かない。
どこか書き方が間違っているのだけど、なかなか原因を突き止められません。
プログラムを簡素化してやってみたり、いろんなところを少しずつ弄っていってと。。。

HPのリニューアルのときにも結局ここが肝でした。

WordPressでJavaScriptを読み込むには「script」タグを直接書き込んでは動かない!!

Googleのタグなんかは直接書き込んで動いているので、動くはずだと、他のところに目が行っていました。

wp_enqueue_script()という関数を使用して、function.phpの方に書き込みます。

今、Swiperというjavascriptを試しているので、その場合はこう書きます。

/* Swiper */

function my_swiper_styles() {
  wp_enqueue_style( 'swiper', get_template_directory_uri() . 'https://unpkg.com/swiper/css/swiper.min.css', array(), false, 'all');
}
add_action( 'wp_enqueue_scripts', 'my_swiper_styles');

function my_swiper_scripts() {
  wp_enqueue_script( 'swiper', get_template_directory_uri() . 'https://unpkg.com/swiper/js/swiper.min.js', array(), false, true );
}
add_action( 'wp_enqueue_scripts', 'my_swiper_scripts');

これだけで、半日無駄にしているので、いいかげん覚えておこう。