概要
the_custom_header_markup関数は、カスタムヘッダーのHTMLパーツを表示するために使用されます。この関数は、テーマでのカスタムヘッダー機能を実装する際によく使われます。具体的には、以下のような機能を実装することができます。
- サイトのロゴやヘッダー画像の表示
- ヘッダーにテキストやキャッチフレーズを追加
- 特定のページで異なるヘッダーを表示
- レスポンシブデザインのヘッダーを作成
- ソーシャルメディアリンクをヘッダーに統合
- カスタムメニューの表示
- ユーザーの役割に応じたヘッダーの内容の変更
- ヘッダーにウィジェットエリアを追加
構文
the_custom_header_markup();
パラメータ
この関数にはパラメータはありません。
戻り値
この関数は戻り値を返しません。HTMLを直接出力します。
関連する関数
使用可能なバージョン
この関数は、WordPress 3.4以降で使用可能です。
コアファイルのパス
wp-includes/theme.php
この関数のアクションでの使用可能性
| アクション | 使用例 |
|---|---|
| mu_plugin_loaded | |
| registered_post_type | |
| plugins_loaded | |
| wp_roles_init | |
| setup_theme | 〇 |
| after_setup_theme | 〇 |
| set_current_user | |
| init | |
| register_sidebar | |
| wp_loaded | |
| send_headers | |
| parse_query | |
| pre_get_posts | |
| wp | |
| template_redirect | |
| get_header | 〇 |
| wp_head | 〇 |
サンプルコード
サンプルコード1
<?php
function my_custom_header_setup() {
add_theme_support('custom-header');
}
add_action('after_setup_theme', 'my_custom_header_setup');
このコードは、テーマにカスタムヘッダーサポートを追加します。
サンプルコード2
<?php
function my_custom_header_output() {
the_custom_header_markup();
}
add_action('wp_head', 'my_custom_header_output');
このコードは、ページの<head>セクションにカスタムヘッダーを出力します。
サンプルコード3
<?php
function my_header_image() {
if (get_header_image()) {
echo '<img src="' . esc_url(get_header_image()) . '" alt="">';
}
}
add_action('get_header', 'my_header_image');
このコードは、カスタムヘッダー画像を表示するためのカスタム機能を実装しています。
サンプルコード4
<?php
function my_custom_header_css() {
$header_image = get_header_image();
if ($header_image) {
echo '<style>
#header { background-image: url(' . esc_url($header_image) . '); }
</style>';
}
}
add_action('wp_head', 'my_custom_header_css');
このコードは、カスタムヘッダー画像をCSSとしてページに埋め込みます。
サンプルコード5
<?php
function display_custom_header() {
the_custom_header_markup();
}
add_action('template_redirect', 'display_custom_header');
このコードは、特定のテンプレートでカスタムヘッダーを表示します。
すべてのサンプルコードは著作権フリーのものであり、一般的な使用方法を示しています。