functions.phpでまとめて短いコードで外部cssとjsを読み込ませるためにはどのように指定すればいいでしょうか？

Question

前提・実現したいこと

ここに質問の内容を詳しく書いてください。
wordpress初心者です。
functions.phpにまとめてcssとjsを短いコードで読み込ませるにはどのように設定すればいいでしょうか？

追記
cssは読み込みますがjsが読み込みません。
どのように設定すればいいでしょうか？

該当のソースコード

   /* header.phpのコードになります。 */

    <link rel="stylesheet" href="<?php echo get_template_directory_uri(); ?>/css/reset.css">
    <link rel="stylesheet" href="<?php echo get_template_directory_uri(); ?>/css/btn.css">
    <link rel="stylesheet" href="<?php echo get_template_directory_uri(); ?>/css/contents.css">
    <link rel="stylesheet" href="<?php echo get_stylesheet_uri(); ?>">
    <link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.0.13/css/all.css" integrity="sha384-DNOHZ68U8hZfKXOrtjWvjxusGo9WQnrNx2sqG0tfsghAvtVlRW3tvkXWZh58N9jp" crossorigin="anonymous">
    <link rel="stylesheet" href="<?php echo get_template_directory_uri(); ?>/css/slick-theme.css">
    <link rel="stylesheet" href="<?php echo get_template_directory_uri(); ?>/css/slick.css">
    <link rel="shotcut" href="<?php echo get_template_directory_uri(); ?>/images/favicon.ico">
    <link rel="apple-touch-icon" href="<?php echo get_template_directory_uri(); ?>/images/apple-chrome.png">
    <link rel="icon" type="img/png" size="256x256" href="<?php echo get_template_directory_uri(); ?>/images/android-chrome.png">
    <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
    <script type="text/javascript" src="<?php echo get_template_directory_uri(); ?>/js/slick/slick.js"></script>
    <script type="text/javascript" src="<?php echo get_template_directory_uri(); ?>/js/slick/slick.min.js"></script>
    <script type="text/javascript" src="<?php echo get_template_directory_uri(); ?>/js/main.js"></script>
    <script src="http://css3-mediaqueries-js.googlecode.com/svn/trunk/css3-mediaqueries.js"></script>

/* functions.phpのコードになります。 */

// jquery読み込み
function main_scripts() {
	wp_enqueue_script( 'main_script', get_template_directory_uri() .'/js/main.js', array('jquery'), '', true );
}
add_action( 'wp_enqueue_scripts', 'main_scripts' );

// jquery読み込み
function my_scripts() {
  wp_enqueue_style( 'style-name', get_template_directory_uri() . '/css/style.css', array('jquery'), '1.0.0', 'all' );
  wp_enqueue_script( 'slick', get_template_directory_uri() . '/js/slick/slick.js', array( 'jquery' ), '1.0.0', true );
}
add_action( 'wp_enqueue_scripts', 'my_scripts' );

// jquery読み込み
function my_scripts_method() {
	wp_enqueue_script(
		'slick.min',
		get_stylesheet_directory_uri().'/slick/slick.min.js',
		array( 'jquery' ),
		'1.8.1', true
	);
}
add_action( 'wp_enqueue_scripts', 'my_scripts_method' );

// jquery読み込み
function ofi_scripts(){
  wp_enqueue_script( 'object-fit-images', get_template_directory_uri() .'/js/ofi.min.js', array('jquery') );
}
add_action( 'wp_enqueue_scripts' , 'ofi_scripts' );

Comments

[kei344]

「読み込みません」ではなく、具体的に出力されたHTML（ブラウザで「ページのソースを表示」）を質問文に追記ください。

Answer 1

ファイル名を配列にいれてforeachで回すとかでしょうか。

Comments

[oyu]

ご連絡ありがとうございます。
その通りです。
どのように設定すればいいでしょうか？
お聞きしたいのですが、短いコードで読み込みますでしょうか？

[m.ts10806]

設定ではなくコードで書きます。
少なくとも何回も下記のような読み込み記述を書かなくてすみます。
<link rel="stylesheet" href="<?php echo get_template_directory_uri(); ?>/css/reset.css">

実装例
$ccs_files =['/css/reset.css','/css/btn.css'];

foreach($ccs_files as $cfile){
echo '<link href="'.get_template_directory_uri().$cfile.'">';
}

WordPress環境が手元になくて試してないですけどこんな感じ。
get_template_directory_uri()とやらを使わないところは考えてみてください。込みで配列に持っておいても良いですけど、配列の持ち方次第で分岐させたり色々考えられなくはないです。

[oyu]

試してみましたがすみません。
こちらのコードでは読み込みません。

$ccs_files =['/css/reset.css','/css/btn.css'];

foreach($ccs_files as $cfile){
echo '<link href="'.get_template_directory_uri().$cfile.'">';
}

[m.ts10806]

あごめんなさい。
linkタグにrel="stylesheet"
が必要ですね。

[oyu]

すみません。
cssは読み込みますがjsが読み込みません。
どのように設定すればいいでしょうか？

[m.ts10806]

どのように書いたのでしょうか。質問本文に現状を追記してください。
PHPの基本部分と、外部ファイルの仕組みが理解できていれば自力で実装できると思います。

[oyu]

こちらで正しいでしょうか？
$ccs_files =['/css/reset.css','/css/btn.css'];
$script_files =['/js/main.js','/js/ofi.min.js','/js/slick/slick.js','/js/slick/slick.min.js']

foreach($ccs_files as $cfile){
echo '<link rel="stylesheet" href="'.get_template_directory_uri().$cfile.'">';
}
foreach($script_files as $script ) {
echo '<script src="'.get_template_directory_uri().$script.'">';
}

[m.ts10806]

質問本文に現状を追記してください。

[oyu]

質問本文に追記しました。
原因が分かりません。

[m.ts10806]

配列にいれてforeachで回すコード
はどこに書かれたのでしょう。

[kai0310]

config.phpなどでまとめて記述し、読み込む方が質問者にとっては簡単かもしれないですね。。

直接のコードは短くなってますし。。

[oyu]

お聞きしたいのですが
こちらで正しいでしょうか？
jsだけ読み込みません。

$ccs_files =['/css/reset.css','/css/btn.css'];
$script_files =['/js/main.js','/js/ofi.min.js','/js/slick/slick.js','/js/slick/slick.min.js']

foreach($ccs_files as $cfile){
echo '<link rel="stylesheet" href="'.get_template_directory_uri().$cfile.'">';
}
foreach($script_files as $script ) {
echo '<script src="'.get_template_directory_uri().$script.'">';
}

[m.ts10806]

正しいかどうかは結果で判断できるのではないでしょうか。
先に書きましたようにWordPress環境があるわけではないのでこちらでは「出力結果が正しいか」は判断できません。
要は、ブラウザの「ソースを表示」して、ご自身が質問で提示した「該当のソースコード」の結果と同じになってればいいわけですから。

[m.ts10806]

k011510さん
そうかもしませんね。WordPressに明るくないのでどこに入れるのが適切かは私の方では分かりかねるので、もしご存知であれば別途回答にしていただけませんか？

[kai0310]

m.ts10806さん　こんばんは。ただいま確認しました。

当方もWordPressには詳しくないのですが、いくつか調べてみたいと思います。
>どこに入れるのが適切か
config.phpと仮に指定した場合その保存先をどこにするか。という認識でよろしかったですか？