[WP Theme Dev] Iemoto で WordPress theme の作成時に手を加えるパスとテンプレートファイルの情報
memo.
[markdown]
Iemoto に設定されている Sass のコンパイルタスクを利用するにはいくつか検討すべき点が残りましたが、今回は「 __別途開発済みの HTML, CSS, JS をテーマに適用する__ 」フローのため、PHP テンプレートのみを取り出して開発を進めました。
> * [Iemoto で WordPress theme の作成を始めるまでの手順を確認する | deadwood](https://www.d-wood.com/blog/2017/05/16_8938.html#i-6)
以下、備忘録です。
## File structure
[Iemoto は _s 準拠のテンプレートファイル](https://www.d-wood.com/blog/2017/05/16_8940.html)となっています。
ディフォルトのファイル構成については、下記に _s の素晴らしい解説記事があります。
> * [_sとFoundationを使ってWordPressのテーマを作ってみよう | Hatsuka](http://hatsuka.info/coding/_s_01)
記事中で紹介されていたプラグインが便利です。
> * [Show Current Template — WordPress プラグイン](https://ja.wordpress.org/plugins/show-current-template/#description)
## CSS & JavaScript path
functions.php に `wp_enqueue_style` と `wp_enqueue_script` で設定します。
> * [関数リファレンス/wp enqueue style – WordPress Codex 日本語版](https://wpdocs.osdn.jp/%E9%96%A2%E6%95%B0%E3%83%AA%E3%83%95%E3%82%A1%E3%83%AC%E3%83%B3%E3%82%B9/wp_enqueue_style)
> * [関数リファレンス/wp enqueue script – WordPress Codex 日本語版](https://wpdocs.osdn.jp/%E9%96%A2%E6%95%B0%E3%83%AA%E3%83%95%E3%82%A1%E3%83%AC%E3%83%B3%E3%82%B9/wp_enqueue_script)
“`php:functions.php
wp_enqueue_style(
‘foo’,
get_stylesheet_directory_uri() . ‘/css/foo.css’,
array(),
$iemoto_theme_ver
);
“`
“`php:functions.php
wp_enqueue_script(
‘bar’,
get_template_directory_uri() . ‘/js/bar.js’,
array(‘jquery’),
$iemoto_theme_ver,
true
);
“`
なお common は予約語らしく利用できませんでした。
`iemoto-style.css` や `iemoto-common.css` のような命名をした方が良いようです。
## Image path
`bloginfo()` ではなく、`get_template_directory_uri` などの利用が推奨のようです。
> * [テーマレビュー – WordPress Codex 日本語版](http://wpdocs.osdn.jp/%E3%83%86%E3%83%BC%E3%83%9E%E3%83%AC%E3%83%93%E3%83%A5%E3%83%BC)
> * [get_template_directory_uri() | Function | WordPress Developer Resources](https://developer.wordpress.org/reference/functions/get_template_directory_uri/)
“`php