wordpressでcssやjQueryをfunction.phpで読み込みたいのですが、出来ません

Question

WordPressでCSSやjQueryを読み込む時はfunction.phpが便利！
とネットでかいていたので、下記サイト通り行っても上手くいきません
https://beginners-high.com/css-jquery-function-php/

ローディングバーがぐるぐる回ってjQueryのプラグインが読み込まないのですが
どこか間違っていますでしょうか？ご教授お願いいたします。

functions.php

<?php
/*外部cssファイルを読み込む*/
function register_stylesheet() { 
    wp_register_style('bxslider', get_template_directory_uri().'/css/jquery.bxslider.css');
   }
   /* 登録したCSSファイルを読み込む
---------------------------------------------------------- */
function add_stylesheet() { 
    register_stylesheet();
    wp_enqueue_style('bxslider', get_template_directory_uri().'/css/jquery.bxslider.css', array(), '1.0', false);
   }
/* アクションフックで関数を呼び出す
---------------------------------------------------------- */
add_action('wp_enqueue_scripts', 'add_stylesheet');

/* jQueryを読み込む場合
---------------------------------------------------------- */
function register_script(){
    wp_register_script('bxslider-1', get_stylesheet_directory_uri().'/js/jquery.bxslider.js');
   }
   function add_script(){
    register_script();
    wp_enqueue_script('bxslider-1', get_stylesheet_directory_uri().'/js/jquery.bxslider.js', array(), '1.0', false);
   }
   add_action('wp_print_scripts','add_script');

試したこと

ここに問題に対して試したことを記載してください。

補足情報（FW/ツールのバージョンなど）

ここにより詳細な情報を記載してください。

Comments

[CHERRY]

WordPress の場合、ファイル名は function.php ではなく、 functions.php ですが、ファイル名は正しいでしょうか。

[wyook]

スミマセン、記載ミスです。
実際のデータはfunctions.phpになっております。どうかご教授お願い致します????

[Lhankor_Mhy]

重複質問では。
https://teratail.com/questions/374944

同じような質問を連投したくなる気持ちもわかるのですが、しかし、一般に同じ質問を複数立てることは嫌われています。
いくつか理由をあげます。

・他の質問で付けられた回答を知らずに同内容の回答を付けたり、他の質問ですでに解決したことを知らずに検討を続けたり、善意の回答者の労力が無駄になる。
・元質問の回答者へ不信感を表明しているように見えるので、回答者に強い不快感を与える可能性がある。

以上のように誤ったコミュニケーションになってしまう可能性があります。
誤ったコミュニケーションは問題解決を阻害するだけではなく、不毛な論争などで時間や労力を無駄にし、質問者と回答者と共に良いことはありません。

ですので、同じ内容で新規の質問を建てることはできるだけ避け、どうしても新しい質問を建てる場合には、ほかのユーザーが納得できそうな理由を挙げていただくことによって、よりよいコミュニケーションが構築できるのではないかと考えています。

また、teratailのガイドラインにも同じ質問を複数建てることは推奨されていませんので、質問をされる前にまずヘルプを一読されることをお勧めします。
https://teratail.com/help/avoid-asking#:~:text=%E9%81%8E%E5%8E%BB%E3%81%AB%E6%8A%95%E7%A8%BF%E3%81%97%E3%81%9F%E8%B3%AA%E5%95%8F%E3%81%A8%E5%90%8C%E3%81%97%E3%82%99%E5%86%85%E5%AE%B9%E3%81%AE%E8%B3%AA%E5%95%8F

以上、よいQ&Aサイトを構築していくためにご協力をお願いします。

[wyook]

スミマセン気を付けます

Answer 1

こちらですが、
/css/jquery.bxslider.css
/js/jquery.bxslider.js
とか、読み込んだものがブラウザ上のhtmlコードの中に、URLの形で出てくると思います。

こちらのURLを直接ブラウザでアクセスした時に、正しくcssやjsのコードが、ブラウザ上に表示されるかというのは、確認されたでしょうか？

もし、正しく表示されなければ、URLが間違っています。
読み込んだcssやjsがブラウザ上に表示されるURLに変えれば、正しく読み込まれると思います。

ということで、ありがちなのがget_template_directory_uri()関数です。
こちらは、テーマが格納されているディレクトリまでのURLが返ってきますが、「親テーマ」のURLになります。

もし、こちらを実装しているテーマが、何らかの「親テーマ」をもとに作成した「子テーマ」であった場合、親テーマのURLが返されるので、結果として読み込めなくなります。

子テーマで実装されている場合、get_template_directory_uri()ではなく、get_stylesheet_directory_uri()を使う必要があります。

解決するかわかりませんが、css,jsが読み込まれない問題に直面した時、私は大体この原因なので、参考になれば幸いです。

Comments

[wyook]

回答ありがとうございます。やはりご指摘の通りhtmlコードの中に/css/jquery.bxslider.css
/js/jquery.bxslider.jsの記述がありませんでした。子テーマを使用していませんので、
URLが間違っているのでしょうか？もう少し試してみますが、urlは何度見返してもあっているのですが…
勉強します

[Iya712]

なるほど。子テーマを使っているのでなければ、こちらのコードで大丈夫だと思います。
cssやjsがhtml中に出てこないとなると、あと考えられるものとしては、表示させようとしているページで、wp_head()とwp_footer()が使用されていない場合があります。
こちらのコードで登録したjsとcssは、wp_headやwp_footerでhtmlに出力されるものですので・・。

[wyook]

ご指摘いただいた内容を元に色々と試したら解決いたしました。
ダウンロードしたプラグインのjquery.bxslider.cssの中に記載されている画像へのパス情報が間違っていました。url('imges/controls.png')となっていたのを、
　　　　url('images/controls.png')に変更すると改善されました。

お時間のない中、助けて頂き、皆様、本当にありがとうございます。
まだまだ勉強していきますので、今後とも宜しくお願いいたします

[Iya712]

解決されたようでよかったです！