wordpressのcssをテンプレートごとに読み込み表示する方法

wordpressではテンプレートを何個か作って作ることがあります。
そのため、テンプレートごとにcssを読み込ませると幅が広がるのでまとめてみました。

普通にwordpressにcssを読み込ませる

bloginfo(‘styleshhet_url’)は現在使用中のテーマのstyle.cssを表示してくれるタグです。

<link href="<?php bloginfo(‘stylesheet_url’); ?>" rel="stylesheet"
type="text/css" />

次にたくさんのCSSを読み込ませる方法

bloginfo(‘template_directory’)は現在使用中のテーマのディレクトリを表示してくれるタグです。

<link href="<?php bloginfo(‘template_directory’); ?>/css/a.css"
 rel="stylesheet" type="text/css" />
<link href="<?php bloginfo(‘template_directory’); ?>/css/b.css"
 rel="stylesheet" type="text/css" />
<link href="<?php bloginfo(‘template_directory’); ?>/css/c.css"
 rel="stylesheet" type="text/css" />

テンプレートごとにcssを分けて読み込ませる方法

条件式ifとis_page_template(‘テンプレート名’)で条件分岐させてあげれば大丈夫です。
ここではテンプレート名をa.php→a.css,b.php→b.css,c.php→c.cssとして作っています。

<link href="<?php bloginfo(‘template_directory’); ?>/css/<?php 
  if(is_page_template('a.php')){
  echo 'a';
  }
  else if(is_page_template('b.php')){
  echo 'b';
  }
  else{
  echo 'c';
  }
  ?>.css" rel="stylesheet"   type="text/css" />

例えば、このホームページでa.phpの場合

<link 
href="http://www.geekzshu.com/wp-content/themes/sample/css/a.css" 
rel="stylesheet" type="text/css" /> 

と表示されます。