functions.phpに各ファイルの呼び込みコードを記載してソースを整理!
header.phpやfooter.phpにスタイルシートやjsファイルの呼び出しをすると
ソースがごちゃごちゃになってしまって管理しづらいですよね。
ごちゃごちゃのソースは見た目もあまり良くありません。
クライアントとの信頼関係を築く上でも、ソースはなるべく簡潔に、出来る限り管理しやすく別ファイルに書いていくほうが適切でしょう。
下記のコードをコピペすれば、自動的にcssはwp_head();
の記載のある部分に、jsはwp_footer();
の記載がある部分に書き出されます。
functions.php
1 2 3 4 5 6 7 8 9 10 11 12 13 14 |
function themes_file_scripts() { wp_enqueue_style('ここに任意の名前', 'ここにファイルのパス'); wp_enqueue_style( 'ここに任意の名前', get_template_directory_uri() . '/css/テーマの「css」フォルダのファイル名' ); //この行をコピペしてパスを変更したり任意の名前を変更して追加していく wp_enqueue_style( 'ここに任意の名前', get_stylesheet_uri() ); //テーマフォルダのstyle.css if(is_admin()) return; //管理画面ではスクリプトは読み込まない wp_deregister_script( 'jquery'); //デフォルトの jQuery は読み込まない //CDN から読み込む wp_enqueue_script( 'jquery', '//ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js', array(), '1.11.3', true); wp_enqueue_script( 'jquery-mig', '//cdnjs.cloudflare.com/ajax/libs/jquery-migrate/1.2.1/jquery-migrate.min.js', array(), '1.2.1', true); wp_enqueue_script( 'ここに任意の名前', get_template_directory_uri() . '/js/テーマの「js」フォルダのファイル名', array(), '20151215', true ); //この行をコピペしてパスを変更したり任意の名前を変更して追加していく } add_action( 'wp_enqueue_scripts', 'themes_file_scripts' ); |
注意点
ここに任意の名前っていうのは、他のファイルの被らない様にして下さい。
たとえばcolorbox.js
を呼び出す際に任意の名前がcolorbox
で、他のファイルにもcolorbox
という記述があるとバッティングをして、うまく書き出されません。
あと、毎回言っているのですが、functions.phpを編集する際は必ずバックアップをよろしくお願いいたします。