🦓 【WordPress】CSSファイルを読み込む方法
WordPress
作成日： 2021/07/02
0

【WordPress】CSSファイルを読み込む方法

  1. functions.php内にファイルの読み込みに関する記述をまとめた関数(*)を用意する
  2. (*)内にwp_enqueue_style()関数を記述し、読み込むファイルを区別するための名前やファイルパス等を引数で指定する
  3. (*)をwp_enqueue_scriptsアクションフックに登録する
  4. 今までheader.phpのheadタグ内に記述していた、CSSファイルを読み込むためのlinkタグを削除し、代わりにwp_head()関数を記述する

コード(functions.php)

<?php
function my_scripts_init() {
  wp_enqueue_style( 'fontawesome', 'https://use.fontawesome.com/releases/v5.8.2/css/all.css', array(), '5.8.2', 'all' );
  wp_enqueue_style( 'style-name', get_template_directory_uri() . '/css/style.css', array(), '1.0.0', 'all' );
}
add_action( 'wp_enqueue_scripts', 'my_scripts_init' );

コード(header.php)

<!DOCTYPE html>
<html>
<head>
  ～省略～
  <?php wp_head(); ?>
</head>
<body>
  <header>
    ～省略～

参考記事
リョーヘイ@Webコーダーを目指して勉強中
31歳/福岡在住/現在統合失調症の治療中/高卒後に通った予備校で人間関係に苦しむ▶大学を6年かけて卒業▶自分の力で稼ぎたい思いで投資を始めるも挫折▶けんすうさんのnoteを読みWeb制作の学習開始/日々の学習内容を発信します😌