Category
Archives
Cocotiie
Trial And Error!やってみよう!の精神でWeb制作をしています。初心者の方にも伝わるよう、心がけています。少しでも誰かの助けになれれば嬉しいです。宜しくお願い致します。

2006年:Web制作に関する覚書きブログをはじめる。

2018年:Cocotiie(ココッティー)として運営開始。
このサイトは快適なテーマ「SWELL」を使用していますSWELLについて

[WordPress] headerにファイルをリンクする

Wordpress

旧サイトで人気があったので、再編して掲載します。

子テーマフォルダ内にCSSやjsフォルダを作成し、ファイルを置いて headerにリンクを出力したい場合、直接header.phpに書く事も出来ますが、アップデートに備えてfunction.jsに記載した方が便利です。

INDEX

CSS/jsをリンクする

※ sample と書かれている部分を書き換えて下さい。2行セットになっています。不要な場合は削除すれはOKです。

function theme_name_scripts() {
wp_enqueue_style( 'style', get_stylesheet_uri();  //css挿入
	wp_enqueue_style( 'sample', get_stylesheet_directory_uri() . '/css/sample.css' );
wp_enqueue_script( 'jquery'); //js挿入
	wp_enqueue_script( 'sample',  get_stylesheet_directory_uri() . '/js/sample.js');  
}
add_action( 'wp_enqueue_scripts', 'theme_name_scripts' );

get_stylesheet_uri は子テーマまでのパスです。親テーマにファイルを置いている場合は、get_template_directory_uri となります。 詳細はChildテーマでパスを指定する時の注意で紹介しています。

URLの追加

例えばGoogle fontとか。

//リンク追加
add_action( 'wp_head', 'add_meta_to_head' );
function add_meta_to_head() {
  echo '<link href="https://fonts.googleapis.com/css?family=Noto+Serif+JP|Sawarabi+Gothic&display=swap" rel="stylesheet">';
}

echo ‘ここを書き換えて下さい。’

なかなか上手くいかない場合は、時間をかけずにheader.phpに書き込んでしまった方が楽かもしれません。

よかったらシェアお願いします
  • URLをコピーしました!
  • URLをコピーしました!

コメント ※ハンドルネームでお願いします

コメントする

INDEX