おとなのらいふはっく

IT、iPhone、ビジネス、健康ネタなど、21世紀を生き抜く大人のためのライフハックブログ

バズ部WPテーマXeoryのカスタマイズ備忘録:titleタグ、パンくず

バズ部さんが無料配布しているWordPressのテーマ「Xeory Base」のカスタマイズをしました。

忘れないように備忘録としてアップします。

固定ページをトップページにした際のtitleタグ表示、同じくトップページのパンくずリストの削除などについて掲載しています。

バズ部WPテーマXeoryのカスタマイズ備忘録 タイトル画像

皆さんこんにちは、よしぞう(@otonahack)です。

バズ部さんが無料配布しているWordPressのテーマ「Xeory Base」のカスタマイズ方法をまとめておきます。

自分が作業したものだけを備忘録として残します。

Xeoryの詳細については公式サイトをどうぞ
↓↓↓
公式サイト
Xeory-無料WordPressテーマ-

目次:バズ部WPテーマXeoryのカスタマイズ備忘録

注意点:子テーマを作って使っています

カスタマイズをするのでオリジナルの「.php」ファイルはいじらずに、「Xeory Base」の子テーマを作って作業しています。

下記で変更している「.php」ファイルは、全て子テーマフォルダの中に複製したものをいじっています。

↑目次に戻る

トップページ(固定ページ)のtitleタグをサイト名にしたい

固定ページをトップページにして利用しています。

この場合、ソースを見るとtitleタグに表示される内容が、下記のようにトップページに指定した固定ページの記事タイトルになってしまいます。

<title>トップページに指定した固定ページの記事タイトル</title>

これを以下のように修正します

<title>サイト名</title>

修正する場合は「header.php」を修正します。

「header.php」の中にある

<title><?php bzb_title(); ?></title>

という部分を

<title>
<?php if ( is_home() || is_front_page() ) : ?>
<?php bloginfo('name'); ?>
<?php else : ?>
<?php echo trim(wp_title('', false)); ?> | <?php bloginfo('name'); ?>
<?php endif; ?>
</title>

に変更します。

条件分岐を使って、トップページの場合は「サイト名」を表示、それ以外の固定記事ページでは「記事タイトル | サイト名」という形で表示されます。

<title>サイト名</title>(トップページの場合)
<title>記事タイトル | サイト名</title>(固定記事ページの場合)

通常、記事タイトルを表示させる場合は

<?php wp_title( '' ); ?>

を使いますが、これだと何故か先頭にスペースが入るので、

<?php echo trim(wp_title('', false)); ?>

を使っています。上記コードを使うことで、以下のように先頭のスペースを削除できます。

<title> 記事タイトル | サイト名</title>(スペースが入るので)
↓
<title>記事タイトル | サイト名</title>(スペースを削除した)

↑目次に戻る

トップページ(固定ページ)のパンくずリストを消したい

固定ページをトップページにして利用すると、トップページにもパンくずリストが表示されてしまいます。

しかも、トップページであるにもかかわらず、

ホーム>記事タイトル

と表示されてしまうので、トップページの1階層下にあるページのように見えてしまいます。

ですので、トップページのみパンくずリストを消しました。

先ほどの条件分岐を使ってもできると思います。

しかし、トップページはいろいろと他の固定ページと違うデザインにする場合も多いので、固定ページのテンプレートである「page.php」を複製し「front-page.php」というファイル名で子テーマフォルダにアップしました。

固定ページをトップページに指定すると、トップページは「page.php」よりも「front-page.php」が優先されます。

その他の固定ページは「page.php」が利用されます。ですので「front-page.php」のパンくずリストを削除すればOKです。

参考:WordPress Codex 日本語版
静的フロントページの作成

作業方法は以下です。

「front-page.php」を子テーマにアップしたら、

<?php bzb_breadcrumb(); ?>

を削除します。これだけです。

これでトップページからパンくずリストが消えます。

↑目次に戻る

終わりに

以上、「バズ部WPテーマXeoryのカスタマイズ備忘録」でした。

今後もカスタマイズが増えたら、追加していきます。

Xeoryを配布しているページのサンプルサイトを見ると、いろいろなデザインのサイトがあるので、インストールしただけで凄いデザインが出来るのかと思ってしまいました。

インストールしてみると、とてもシンプルなデザインなので、あのようなデザインにするには相当な工夫が必要ですね。

Xeoryの詳細については公式サイトをどうぞ
↓↓↓
公式サイト
Xeory-無料WordPressテーマ-