WEB NOTE
WEB関連の備忘録

WordPressオリジナルテーマ作成に使うタグ – サイト設定編

WordPress

WordPressでオリジナルのテーマを作る際の基本的に必須のタグをメモ。
構築の手順とかはまた今度ゆっくり書いていきたいと思います。

サイト情報系 – header.php

必須系

<?php wp_head(); ?>

</head>の直前に記述

<?php wp_footer(); ?>

</body>の直前に記述 。
headのタグじゃないけど、これがないと始まらないのでこちらに書きました。

ページ全体の言語の設定

<html <?php language_attributes(); ?>>

文字コードの設定

<meta charset="<?php bloginfo('charset'); ?>">

サイト情報系 – functions.php

サイトタイトル表示

function theme_setup() {
    add_theme_support('title-tag');
}
add_action('after_setup_theme','theme_setup');

上記のコードを functions.php に記述すると動的に title を出力してくれるので、head 内に何も記述する必要はありません。
古い記述方法の wp_title() ; でも問題ないが、バージョン4.1で新たに導入された上記のコードの方がより柔軟に、状況に応じて的確なタイトルを表示してくれるのでこちらを利用します。
詳しいカスタマイズ方法は後日、別で記事を作るのでお待ちください。

スタイルシートを読み込む

function enqueue_scripts() {
    //style.css
    wp_enqueue_style('main-css', get_stylesheet_uri());
    //sub.css
    wp_enqueue_style('sub-css', '/style/sub.css');
}
add_action('wp_enqueue_scripts','enqueue_scripts');

JavaScriptを読み込む

function enqueue_scripts() {
    wp_enqueue_script('custom-script', get_stylesheet_directory_uri() . '/js/script.js', true);
}
add_action('wp_enqueue_scripts','enqueue_scripts');

もしJavaScript を head 内で読み込ませたい場合は、true を false に書き換えてください。

コンテンツ系 – body

bodyタグにclass属性を追加

<body <?php body_class();?>>

ページの種類によって追加される主なクラスは以下の通りです。
詳しくはWikiを参照してください。

ページの種類追加されるクラス名
表示設定 – ホームページの表示 で「最新の投稿」を選んでいる場合home blog
表示設定 – ホームページの表示 で「固定ページ」を選んでいる場合 home page
投稿ページsingle
カテゴリー別一覧ページarchive category
タグ別一覧ページarchive tag tag-スラッグ
日付別一覧ページarchive date
検索結果ページ(検索結果あり)search search-results
検索結果ページ(検索結果なし) search search-no-results
404ページerror404
固定ページpage

https://wpdocs.osdn.jp/%E3%83%86%E3%83%B3%E3%83%97%E3%83%AC%E3%83%BC%E3%83%88%E3%82%BF%E3%82%B0/body_class

テンプレートタグ/body class – WordPress Codex 日本語版