【WordPressでオリジナルサイトを作ろう】⑥CSSファイル読込編

functions.phpの作成

まずは、テーマディレクトリ直下に「functions.php」を作成します。

C:\Users\ユーザー名\Local Sites\blog\app\public\wp-content\themes\blog\functions.php

functions.phpのコーディング

続いて、CSSの読み込み処理をコーディングしていきます。

※注意
「functions.php」は、CSSの読み込み以外にも、WordPressの色々な処理を記述するための重要なファイルです。
誤った記述をすることで、サイトが表示されなくなったりすることもありますので、修正する際はバックアップをとるなどして注意して修正してください。

ソースコードは下記の通りです。

    functions.php
    
<?php

function my_enqueue_styles() {
  wp_enqueue_style('ress', '//unpkg.com/ress/dist/ress.min.css', array(), false, 'all');
  wp_enqueue_style('style', get_stylesheet_uri(), array('ress'), false, 'all');
}
add_action('wp_enqueue_scripts', 'my_enqueue_styles');
    
  

      functions.php
      
<?php
      
    

      functions.php
      
function my_enqueue_styles() {
  wp_enqueue_style('ress', '//unpkg.com/ress/dist/ress.min.css', array(), false, 'all');
  wp_enqueue_style('style', get_stylesheet_uri(), array('ress'), false, 'all');
}
add_action('wp_enqueue_scripts', 'my_enqueue_styles');
    
    

以上でCSSファイルの読み込みは終了です。

ちなみに、JavaScriptの読み込みもCSSと同じく「wp_enqueue_scripts」関数で行います。