get_template_directory_uri();って長くね?
どうもこんにちは忙しくてスタッフブログに逃げてきました塚本です!
気分転換は大事ですよね…!?
今日は闇カスタムの話をします。
※ あまり参考にはなりません。
WordPressの関数たち
WordPressには様々な関数があります。
グローバル変数にも様々な値g
WordPressの有り難い関数たちはコチラのリファレンスからご覧になれます。
個人的にWordPressでなにかを作っててよく使うものとしては、
home_url
get_template_directory_uri
get_template_directory
the_permalink
esc_url
is_single
is_archive
…。
あまり使ってないので思い浮かびませんでした^^;
get_template_directory_uri();
get_template_directory_uri
はテーマディレクトリのパスを出力する関数です。
使用例としてはこんな感じですかね。
<img src="<?php echo get_template_directory_uri(); ?>/assets/img/hoge/fuga.jpg">
頻出というか必須だと思われます。
WordPressやるなら誰もがこれを使うと思うんですが、めっちゃ長いですよね(笑)
以前はget_template_direcotry_uri
って打つとWordPressやってる感じがするので真面目にそうしてました。
例えば、墾田永年私財法
とかスリジャヤワルダナプラコッテ
とか王政復古の大号令
とか
めっちゃ長いけどなんか良いっていう、get_template_directory_uri
もそれに入ると個人的に思っています。
get_template_directory_uriを魔改造
長いし、いちいち打つのに飽きてきてしまったので魔改造を施しました。
imdir
function imdir( $file_name = NULL )
{
if( $file_name ){
$url = esc_url( get_template_directory_uri().'/assets/img/'.slug().'/'.$file_name );
$path = get_template_directory().'/assets/img/'.slug().'/'.$file_name;
return $url.'?v='.date( "YmdHis", filemtime( $path ));
}
else{
return esc_url( get_template_directory_uri().'/assets/img' );
}
}
こんな感じにget_template_directory_uri
を改造してみました。
関数の名前はimgurっぽい感じで、’image directory’を略してみました。
slug
function slug(){
global $post;
return $post->post_name;
}
imdir
の中にでてくるslug
も一応自作関数です。
現在のページのスラッグを返します。
こういう感じで使うときもあります。
<article class="<?php echo slug(); ?>">
<section>
~
</section>
</article>
使用用途・動機
僕はWordPressやるときにテーマのディレクトリ構造をこんな風にしています。
page-hoge.php
で使う画像は/assets/img/hoge
以下に置くようにしています。
なので、画像を挿入するときは自ずとこのようにコーディングすることになります。
<img src="<?php echo get_template_directory_uri(); ?>/assets/img/hoge/fuga.jpg">
そこで、いちいち毎回打つのがめんどうになってきてimdir
という闇の関数をつくることにしました。
Usage
引数なしの場合
php
<img src="<?php echo imdir(); ?>/hoge/fuga.jpg">
html 出力結果
<img src="https://example.jp/wp-content/themes/theme_name/assets/img/hoge/fuga.jpg">
引数ありの場合(page-hoge.phpで使用を想定)
php
<img src="<?php echo imdir('fuga.jpg'); ?>">
html 出力結果
<img src="https://example.jp/wp-content/themes/theme_name/assets/img/hoge/fuga.jpg?v=202004141530">
引数には、画像の名前を入れることをルールとしています。
page-hoge.php
でimdir('fuga.jpg')
とやると、
/assets/img/hoge/fuga.jpg
を返すようにしているからです。
これはディレクトリ構造を先程の画像で示したようにしていると有効です。
また、キャッシュバスティングにも一応対応させておきました。
まとめ
get_template_directory_uri
っぽくて、キャッシュ対策もできますが
こういった闇実装はひとりのときに限ってやってくださいね