WordPress無料テーマ「Xeory」を改造してYoast SEOを使う

かなり使い勝手が良いバズ部謹製の「Xeory-無料WordPressテーマ-」ですが、head の meta タグや title タグなどを Yoast SEO で管理するため、少々改造してみました。

また、ウィジェットの「投稿記事下」の表示場所が、SNS購読タイトルとボタンの間に割り込んでしまっているのを修正してみました。

もう半年近くアップデートされていないのだけが、ちょっと残念。

(2016.03.08 追記)
記事中で、 functions.php を function.php と間違って表記しておりましたのを修正致しました。
shige様、ご指摘ありがとうございました。
(追記ここまで)

いつか来るアップデートに備えて子テーマを作成して改造

WordPressのテーマ改造の際には、テーマのアップデートがあった時に備えて子テーマを作成し改造するのが推奨されています。

子テーマを作る場合、改造したいファイルだけを子テーマのディレクトリに配置すれば、それ以外のファイルは親テーマを参照しに行ってくれます。したがって、親テーマがバージョンアップした際でも、改変したファイルは子テーマのディレクトリに残っていますので管理が楽になります。

子テーマディレクトリを作成する

wp-content/themes/ 内に子テーマ用のディレクトリを作ります。

今回は、xeory_base-child としました。

このディレクトリに、親である xeory_base ディレクトリから、以下のファイルをコピーして持ってきます。

header.php
single.php

また、以下の空のファイルを作成します。

functions.php
style.css

子テーマの functions.php を作る

functions.php は以下のようにします。

<?php
//子テーマの設定
add_action( 'wp_enqueue_scripts', 'theme_enqueue_styles' );
function theme_enqueue_styles() {
wp_enqueue_style( 'parent-style', get_template_directory_uri() . '/style.css' );

}

// ヘッダメタ部分を無効化
add_action('after_setup_theme', function() {
remove_action('wp_head', 'bzb_header_meta', 1);
});

アドセンスなどのショートコードも、この子テーマの functions.php に登録しておけば便利です。

子テーマの style.css を作る

style.css は以下のようにします。

@charset "UTF-8";
/*   
Theme Name: XeoryBase Child
Description: Xeory 子テーマ
Template: xeory_base
*/

スタイルを上書きしたり追加したければ、ここに書き足していきます。

ここまでの４つのファイルを テーマディレクトリに作成した xeory_base-childディレクトリにアップロードします。管理画面で子テーマを選択できるようになりますのでテーマを子テーマに変更します。

head 内の meta 部分の修正

先ほど作業した functions.php の作成で、Xeory が作る head 内の meta はすでに表示されないようになっています。

あとは、タイトル部分を Yoast SEO などの SEO系プラグインで管理するために、header.phpの５行目を修正します。

【修正前】

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

【修正後】

    <title><?php wp_title('') ?></title>

投稿記事下ウィジェットの位置を変更

投稿記事下ウィジェットの位置は、single.php をいじって修正します。

63行目からの<h4>タグと<?php ～ ?>コードの部分を、以下のように前後入れ替えします。

【修正前】

<h4 class="post-share-title">SNSでもご購読できます。</h4>
<?php if(  is_active_sidebar('under_post_area') ){
  dynamic_sidebar('under_post_area');
} ?>

【修正後】

<?php if(  is_active_sidebar('under_post_area') ){
  dynamic_sidebar('under_post_area');
} ?>
<h4 class="post-share-title">SNSでもご購読できます。</h4>

これを入れ替えておかないと、投稿記事下ウィジェットにアドセンスなどを貼り付けた場合、「SNSでもご購読できます。」というバナーとSNSボタンの間に、広告が表示されてしまってユーザーがかなり戸惑ってしまう事になります。

以上で改造は終了です。

追加改造した際には、この記事に追記していくことと致します。

---

おすすめの関連記事

WordPress で highlight.js を使用してシンタックスハイライトを導入 – 無料テーマ Xeory の改造
バズ部謹製の 「Xeory-無料WordPressテーマ」に、highlight.js を導入してシンタックスハイライトができるようにしてみました。また、子テー…

さくらのレンタルサーバーでSSL(SNI)を導入しwww有りに正規化したら BackWPup が動かなくなってしまった時の対処法
さくらのレンタルサーバーでSNIベースのSSLを利用しwww有りに正規化すると、BackUPwpがエラーで動かなくなる場合があり、htaccessへ wp-cr…