WEBディレクター&デザイナーとして、バズ部のWordPressテーマ「Xeory」の良い点、悪い点をレビューします。
これからWordPressをカスタマイズしようと考えたとき、Xeoryのテーマは選択肢に入るでしょう。
カスタマイズのしやすさ、メリット・デメリット、「どういったサイトに向いているか」「どんなスキルの人に合っているか」などを徹底的に解説していきます。
テーマは「Xeory Base」と「Xeory Extension」の2種類あります。
Xeory Extension単体のメリットは、この記事内に分けています。
また、公式サイトにない「カスタマイズ事例」も集めました。
まずはXeoryの基本的な情報から説明していきます。
Xeoryとは?
Xeoryは「バズ部」さんが提供する無料のWordPressテーマです。
ブログ・メディアや企業サイトまで、多くのユーザーに使われています。
Xeoryの特長は、最低限のデザインと、最低限の機能を持っていることです。(後ほど解説)
商用利用も可能で、企業メディアで使われているのをよく見かけます。
Xeoryの単語を調べてみましたが、英語にはないようで、該当する意味は見当たりません。
Google翻訳に通すと「ゼオリー」もしくは「ジオリー」と発音します。
読みにくいので「バズ部のテーマ」と呼ばれることが多いです。
Xeoryは2種類
Xeoryのテーマには、ブログ・メディアに特化した「Xeory Base」と、企業サイトに特化した「Xeory Extension」の2つがあります。
ブログ型のXeory Base
当サイトに「Xeory Base」を適用した初期の状態
「Xeory Base」は、ブログ・メディアサイトなどの立ち上げの際、ベーステンプレートとして使うのに適しています。
企業サイト+ブログ型のXeory Extension
当サイトに「Xeory Extension」を適用した状態
Xeory Extensionは、企業サイト型のテーマです。
下層ページは、ブログ・メディア記事として書くことができます。企業サイトに適用するなら、こちらがオススメです。
ブログ型の「Xeory Base」に、企業サイトを足したようなイメージです。
作者
Xeoryは、コンテンツマーケティングで有名な「バズ部」さんが提供しています。
Xeoryの公式ページは以下です。
Xeoryをダウンロードするには、以下のページからアクセスします。
ダウンロードは無料ですが、ログインするのに、名前とメールドレスの入力が必要です。
Xeoryのメリット
「Xeory Base」と「Xeory Extension」を含めたメリットを解説していきます。
Xeory Extension単体のメリットについては、後でまとめて記載しています。
ユニークな機能、シンプルな作りによるメリット、WordPress初心者にも分かりやすい構成などを解説していきます。
ブログ・メディアサイトのベースとして最適
HTML・CSSの知識があって、WordPressサイトを自分だけのデザインにしたいなら、Xeoryは最適です。
Xeoryは最低限のデザインと、最低限の機能で組まれています。
これはオリジナルテーマのベースとして、大変使いやすいというメリットがあります。
また、作りが単純化されているので、WordPressのテーマ作成を学ぶのに最適です。
ゼロからテーマを作るのは大変
WordPressのテーマを「ゼロ」から作るのは大変です。
私はテーマをゼロから作った経験もありますが、後で足りないパーツがあったりと、苦労しました。
記事内のYoutube動画の貼り込み、アーカイブページ、SNSボタンなど、作成中に後から必要なパーツが次々に出てきます。
Xeoryのテーマは、何もしていない状態でも、きちんと機能しれくれます。
細かいパーツ作りは不要か、もしくは後からカスタマイズすれば良いわけです。
最小限のファイル構成
Xeoryのテーマは、以下のように最小限のファイルで構成されています。
どこに何のファイルがあるのか分かりやすいです。
上図は「Xeory Base」の場合です。
Xeory Extensionでは、専用トップページのfront-page.phpが追加されます。
必要最低限のファイルなので、WordPress初心者でも分かりやすいのがポイントです。
他の高機能なテーマでは、ヘッダーだけでもたくさんのファイルがあったりと、初心者では苦労します。
そういったテーマは、PHPやWordPressに慣れていないと、探すのも困難です。
Xeoryのテーマは、WordPressの初心者が「テーマのカスタマイズ」を勉強するのに最適です。
デザイナーにとっては、「WordPressに何のファイルが必要なのか」という点で勉強にもなるでしょう。
補足ですが、テーマ内のlibフォルダの中には、functions.phpの中身や、管理画面で扱うパーツが含まれています。
これらはカスタマイズには触る必要性がほとんどなく、分かりやすく分離されています。
WordPressを学ぶのに最適
Xeoryのテーマは、単純でシンプルな作りになっているため、WordPressのテーマ作成を学ぶのに最適です。
「これからWordPressを学びたい」という方にも、オススメできます。
実は、機能面での余計なプログラム分岐がありません。
管理画面のカスタマイズ設定が、ほとんどないからです。
プログラム分岐の記述がないため、コードの分かりやすさは、Xeoryが他のテーマよりも優れています。
また、ゼロからWordPressのテーマファイルを作るのは大変なので、Xeoryをカスタマイズしながら学ぶと良いでしょう。
カスタマイズの際には、子テーマを使用してください。
子テーマでないと、親テーマのアップグレード時にカスタマイズ内容がクリアされます。
以下もご参考ください。
構造化データとリッチスニペットに対応している
Xeoryのテーマは、構造化データとリッチスニペットに対応しています。
例えばヘッダーのタグには、以下のように、検索エンジンへ構造を伝える記載がされています。
<header itemscope="itemscope" itemtype="http://schema.org/WPHeader">
リッチスニペットにも対応しているので、基本的な構造化については心配ありません。
パンくずにも、構造化の記載がされています。
<li itemscope="itemscope" itemtype="http://data-vocabulary.org/Breadcrumb">
これらは、ゼロからテンプレートを作る際に手間が掛かります。
最初からテンプレートに記載されているXeoryのテーマは、カスタマイズが容易です。
レスポンシブウェブデザインに対応
Xeoryのテーマは、レスポンシブウェブデザインに対応しています。
モバイルでアクセスしても、同じURLでCSSを切り替えてくれます。
ただし、レスポンシブウェブデザインをOFFにすることはできません。
どうしてもレスポンシブウェブデザインを辞めたい場合、WordPressに用意された関数で、モバイルとPCを分岐させる必要があります。
その場合でも、タブレット用のPHPプログラムを追記する必要があります。
CTA機能
Xeoryのユニークな機能に、CTAの設定があります。
記事を最後まで読んだ人向けに、自社サービスへ誘導する目的のコンテンツを設置できます。
Xeoryのテーマを適用すると、上図のようにCTAの項目が左ナビにつきます。
これは、WordPressのカスタム投稿タイプと呼ばれるもので、新しいフォーマットで記事を追加することができます。
新規でCTAの記事を追加すると、専用のCTA記事作成画面がでてきます。
上図は、CTA設定後のデザインです。
記事を最後まで読んだ方に、誘導したいサービスへの導線を置くことができました。
綺麗に整形されたフォーマットで、汎用性も高く便利です。
CTAは複数作成でき、それぞれの記事で何を挿入するかを選ぶことができます。
Xeory特有のコンテンツマーケティングに特化した機能です。
ただし、これぐらいの機能でしたらWordPressでゼロから作っても、それほど難しくはありません。
CTA機能の注意点
CTA機能で外部のサイトへリンクさせる場合は、注意も必要です。
価値のないページを量産して、外部サイトへ誘導するのは、Googleのウェブマスター向けガイドラインに違反します。
(いわゆるサテライトサイトです)
Googleのウェブマスター向け公式ブログをよく読んでから、CTA機能を使うことをオススメします。
CTA機能のリンクはrel=”nofollow”が付きません。
以下を読んでからCTA機能を使いましょう。
誘導する外部サイトから金銭を受け取っているのに、nofollowになっていないのは、Googleのウェブマスター向けガイドラインに違反します。
内部リンクであれば、普通にリンクをして問題ありません。
LP(ランディングページ)機能
Xeoryには、先ほどのCTAと連携可能なLP(ランディングページ)を作成することができます。
LPとは、主にネット広告から訪れたユーザー向けに自社サービスを紹介するチラシのような集客ページのことです。
CTAからリンクするのも想定されています。
こちらもWordPressのカスタム投稿タイプで作成されています。
固定ページと違う点は、簡単に入力フォームが付けられることです。
また「アスメル」や「オートビズ」といったメルマガ配信サービスと連携することができます。
このあたりもXeoryがコンテンツマーケティングに特化していると言われる機能です。
使い方マニュアル
Xeoryには管理画面に「使い方マニュアル」が実装されています。
便利ではありますが、不要だった場合、子テーマからは容易に削除できません。
Xeoryの使い方マニュアルを削除する
どうしてもXeoryの使い方マニュアルを非表示にしたい人は、Simple Custom CSS and JSなどのプラグインで管理画面のCSSを編集する手があります。
Simple Custom CSS and JSでは、管理画面のCSSを簡単に操作できます。
#toplevel_page_bzb_option_start {display:none}
上図では、id名の#toplevel_page_bzb_option_startにdisplay:noneを適用して、使い方マニュアルを非表示にしています。
もちろんプラグインを使わずにfunctions.phpに記述して、CSSを差し込むこともできます。
その他のメリット
Xeoryの上記以外のメリットをまとめます。
SNSに連携
Xeoryはテーマ作成で手間の掛かる各種SNSの連携機能が最初から設置されています。
作業工数を削減できるので助かります。
Googleアナリティクス、Search Consoleの連携機能
GoogleアナリティクスやGoogle Search Consoleの連携も、初期設定から行うことができます。
ただし後からテーマを変更する可能性があるなら、WordPressのテーマから設定するのは避けた方が良いでしょう。
ページナビゲーションがついている
Xeoryには(設置するのが大変な)ページナビゲーション機能がついています。
ページナビゲーションは、PHPでプログラミングするのはもちろんですが、デザインするのも苦労します。
ページナビゲーションの機能は、サイトごとに変える必要もないので、最初からテーマに実装されているに越したことはありません。
初心者がゼロからテーマを作ると、最初に困るのが、このページナビゲーションとパンくずだと思います。
SEOチェックポイント機能
Xeoryは、記事投稿画面にSEOのチェック項目が実装されています。
(これは必要ないかもしれません……)
記事作成画面のいたるところにアドバイスや解説が書かれているので、メディアやブログのコンテンツ作成に慣れてない方は、記事を書きながら参考にできます。
Xeory Extensionのメリット
「Xeory Base」にない「Xeory Extension」のみのメリットを説明します。
「Xeory Extension」は、「Xeory Base」に企業型トップページを足したようなイメージになります。
縦に長いタイプのトップページです。
この作りは、「ユーザーが目的にたどり着きやすい」というメリットがあります。
内部の下層ディレクトリには、ブログ・メディア記事、固定ページ、LPなどを配置できるのに加えて、トップページにも、任意のページを出すことができます。
トップページに「最近の投稿」や「任意の記事」を出すことができます。
会社概要には、専用のレイアウトがあります。
「Google Map」と連携させて、地図も簡単に差し込めます。
また、トップページには「お問い合わせフォーム」も用意されています。
「Contact Form 7」というプラグインに連携させることで、トップページにお問い合わせフォームを設置できます。
これらは、無料で使えることが信じられないほどの機能です。
WordPressで開発するには、相当なコストが掛かります。
トップページと下層ページを連携
Xeory Extensionの非常に強力な機能です。
トップページに任意の記事や、固定ページをWordPressの管理画面から出すことができます。
下図はクローズアップ記事の設定です。
タイトルやサブタイトルを入力し、出したいコンテンツを選ぶことができます。
さらにすごいのは、管理画面で項目を追加できることです。
これをWordPressで実現するのは大変なことです。
企業型サイトにXeory Extensionは有力候補
前述の高い機能がXeory Extensionでは無料なことに驚きます。
WordPressとXeory Extensionの組み合わせは、高い開発費を削減することができます。
もちろんWordPressを導入すると、メンテナンスやセキュリティの更新で、定期的なメンテナンス費用が発生します。
「WordPressを使うならば」という条件になります。
Xeoryのデメリット
WordPressテーマ「Xeory」のデメリットを解説します。
Xeoryは簡素化された構成がメリットでしたが、それがデメリットでもあります。
HTMLやCSSのカスタマイズができない人には、まったくオススメできません。
しっかりカスタマイズしないといけないので、素早くブログを立ち上げるという目的には不向きです。
トップページがリスト化されてない(Xeory Baseのみ)
Xeory Baseのテーマはトップページがリスト化されていないため、すべての本文記事が繰り返されます。
本文が長いと、フッターにたどり着けません。
これを改善するには、WordPressの記事投稿画面でmoreタグを挿入する必要があります。
moreタグを挿入すると、続きを読むボタンが出現し、記事をまとめることができます。
トップページを無料テーマの「Simplicity2」と比較した場合、Xeoryは使い勝手が悪いかもしれません。
以下のように、Simplicity2では、記事の一つ一つが「カードリスト」でまとまっています。
こういったデザインのカスタマイズは難度が高く、長いタイトルに対応したり、本文をどこまで表示させるかなど、PHPのプログラムも記述する必要があります。
デザイナーやHTMLコーダーは、企業サイトだけでなく、WordPressのようなブログ系のデザインに慣れていないと、Xeoryのカスタマイズは難しいでしょう。
Xeory Extensionではmoreタグが不要
「Xeory Extension」は「Xeory Base」と違い、moreタグを入れなくても続きを読むがアーカイブページに挿入されます。
カスタマイズ項目が少ない
ゼロからカスタマイズできる人には、メリットになりますが、Xeoryのカスタマイズ範囲は極端に少ないです。
管理画面から選ぶのではなく、あくまでHTML、CSS、PHPプログラミングのカスタマイズができるユーザー向けに設計されています。
管理画面からはデザインのカスタマイズができない
上図がWordPress管理画面でのデザインカスタマイズ設定です。
4色選べるカラー設定は、リンク色とボタンぐらいしか適用されません。
レイアウト設定はカラムを1つにしたり、左右のナビゲーションを入れ替えることができます。
管理画面からデザインをカスタマイズするのではなく、HTMLやCSSでデザインをするユーザー向けに設計されています。
機能もカスタマイズができない
Xeoryは、機能のカスタマイズもWordPressの管理画面にはありません。
管理画面からではなく、子テーマを作り、functions.phpにプログラミングでカスタマイズする必要があります。
SEO施策はプラグインが必要
Xeoryのテーマは、内部SEO対策として構造化データとリッチスニペットや、記事ごとのメタディスクリプションに対応しています。
しかし、それだけでは不十分です。
例えばサイト内検索結果のページには、noindex処理が必要です。
これらの問題は、All in One SEO PackなどのSEOプラグインを入れるだけで解消されます。
Xeoryのカスタマイズ事例
Xeoryのテーマを使って、デザインをカスタマイズしているサイトを集めました。
個人的な視点でデザインの美しさや、メディアとして安定した作りになっているかなどを判断して、抜粋しています。
Xeory公式の事例一覧は、以下となります。
カスタマイズ事例としてご参考ください。
- サルワカ | サルでも分かる図解説明マガジン
-
サルワカ | サルでも分かる図解説明マガジンサルワカはあらゆることを分かりやすく解説するメディアです。何か分からないことがあったときはサルワカへどうぞ!
- WEB系のデザインに詳しいサルワカさんのサイトは、ほぼXeoryの原型が残っていないほど美しくデザインされています。このサイトを見てもXeory Baseは、WordPressでゼロからデザインするのに最適と分かります。
- DI:GA online
-
DI:GA ONLINEDI:GA ONLINEはコンサートプロモーターのDISK GARAGEがお送りするエンタテイメントwebマガジンです。
- コンサートプロモーター・DISK GARAGEさんのエンタテイメントwebマガジンです。こちらのサイトもXeory Baseが使われています。マガジン風レイアウトでデザインされているのが特長です。
- リフォームジャーナル
-
リフォームジャーナル家のリフォームに関する様々な情報を発信しています。内装(キッチン・風呂等の水回り、部屋の壁紙など)や外装(外壁や屋根、雨戸など)のリフォームの方法や費用の相場、その他鍵や給湯器といった家周りのトラブルへの対処法まで役立つ情報が満載です。
- リフォームやDIYの情報メディアでXeory Baseが使われています。丁寧に見やすくデザインされているので、信頼性の高い印象を与えるデザインです。
まとめ
Xeoryは、テンプレート作成の基本を抑えつつも、WordPress初心者がカスタマイズしやすい作りになっています。
現在「Xeory Base」は、もはや古くなってしまい、使う理由は限られます。
WordPressカスタマイズの勉強用として、使うのには良いでしょう。
それ以外の用途では、同じ無料テーマのSimplicityをオススメします。
Xeory Extensionに関しては、WordPressで企業型サイトを作る開発コストを大幅に削減できる可能性があります。
有料のCMSにあるような高い機能をWordPressで実現しているのです。
Xeoryの利点を以下にまとめます。
- WordPress初心者がテーマ作りを学ぶのに最適
- 機能が少ないのでWordPress中級者以上も迷うことなくカスタマイズができる
- 徹底的にこだわったカスタマイズがしたいならオススメ
- Xeory ExtensionはWEBマーケティングを含めた企業サイトに最適
- Xeory Extensionは開発コストを削減できる可能性がある
私は一時期、WordPressの独習も含めてXeory Baseでサイトを構築したことがあります。
国産でシンプルなテーマだったので、構造が理解しやすかったです。
スタートアップ企業などがコストを掛けず、スピードを重視してホームページを立ち上げたいという要望ならXeory Extensionがオススメです。
もちろんWordPressのリスクを知った上での判断になります。
WordPress初心者の方や、テーマに迷っているときの参考になれば幸いです。