はじめに
・WordPres初心者〜中級者。
・WordPressのカスタムテンプレートを作成したい方。
・WordPressのテンプレートタグについて、よく分からない方
テンプレートタグとは
テンプレートタグとは**「blgoinfo('パラメータ')」**のような記述をし、管理画面で作成した値など（サイトのタイトルや、サイトのキャッチフレーズ）をパラメータに応じて表示するための、WordPessで使用できる関数の一種です。
テンプレートタグのパラメータ
テンプレートタグには、あらかじめパラメータが用意されています。パラメータを設定することで、そのパラメータに応じた値を表示できます。
※以下は、パラメータをまとめたものです。
| パラメータ | 詳細 |
|---|---|
| name | サイトのタイトル |
| description | サイトのキャッチフレーズ |
サンプルコード（サイトのタイトルを表示）
index.php
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>WordPressテンプレートタグ</title>
<link rel="stylesheet" href="<?php echo get_template_directory_uri(); ?>/style.css">
</head>
<body>
<div class="header_name">
<!-- パラメータをnameに設定し、サイトのタイトルを表示 -->
<h1><?php bloginfo('name')?></h1>
</div>
<img src="<?php echo get_template_directory_uri(); ?>/images/wordpress.jpg">
</body>
</html>
style.css
/*
Theme Name : WordPress
*/
.header_name {
text-align: center;
}
img {
width: 100%;
}
※実行結果
サンプルコード（サイトのキャッチフレーズを表示）
index.php
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>WordPressテンプレートタグ</title>
<link rel="stylesheet" href="<?php echo get_template_directory_uri(); ?>/style.css">
</head>
<body>
<div class="header_description">
<!-- パラメータをdescriptionに設定し、サイトのキャッチフレーズを表示 -->
<h1><?php bloginfo('description')?></h1>
</div>
<img src="<?php echo get_template_directory_uri(); ?>/images/wordpress.jpg">
</body>
</html>
style.css
/*
Theme Name : WordPress
*/
.header_description {
text-align: center;
}
img {
width: 100%;
}
※実行結果
その他のテンプレートタグ
その他の主なテンプレートは以下になります。
| テンプレートタグ | パラメータ | 詳細 |
|---|---|---|
| home_ur | path, scheme（pathは、ホームURLからの相対パス（省略可）。schemeは、http,httpsなど（省略可）） | トップページのリンクを取得 |
| body_class | クラス名の文字列など。（省略可） | bodyタグと異なるクラスを、WordPressのルールに基づいて割り当てる |
サンプルコード（トップページのリンクを取得）
index.php
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>WordPressテンプレートタグ</title>
<link rel="stylesheet" href="<?php echo get_template_directory_uri(); ?>/style.css">
</head>
<body>
<div class="header_home_url">
<!-- home_urlを使用し、トップページのリンクを表示 -->
<h1><a href="<?php echo home_url();?>">トップページのリンク</a></h1>
</div>
<img src="<?php echo get_template_directory_uri(); ?>/images/wordpress.jpg">
</body>
</html>
style.css
/*
Theme Name : WordPress
*/
.header_home_url {
text-align: center;
}
img {
width: 100%;
}
※実行結果
サンプルコード（bodyタグのclass属性を表示）
index.php
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>WordPressテンプレートタグ</title>
<link rel="stylesheet" href="<?php echo get_template_directory_uri(); ?>/style.css">
</head>
<!-- body_classを使用し、bodyタグのclass属性を表示 -->
<body><?php body_class(); ?>>
<img src="<?php echo get_template_directory_uri(); ?>/images/wordpress.jpg">
</body>
</html>
style.css
/*
Theme Name : WordPress
*/
body {
text-align: center;
font-size: 45px;
}
img {
width: 100%;
}
※実行結果
まとめ
・テンプレートタグとはWordPress関数の一種で、パラメータに応じて値を表示したり、取得することができる。
・**「blgoinfo('パラメータ')」は、サイトのタイトルやキャッチフレーズを表示する。パラメータは、nameとdescription**になる。
・**home_url**は、トップページのリンクを取得できる。
・**body_class**はbodyタグと異なるクラスを、WordPressのルールに基づいて割り当てることができる。