BloggerのテーマをPrimeZELOへ変更しました―その理由・導入方法・使用感について―

日付:
本ブログはGoogleのBloggerを使っているのですが、表題の通り、この度PrimeZELOというテーマへ変更しました。以前は古くからあるシンプルなテーマにしていましたが、個別の記事と関連する記事の結びつきが弱かったり、必要な情報を探しにくかったり、スマホ版では情報が省略されてしまったりと気になることが多かったのです。

ここでは、PrimeZELOのテーマに変更した理由、実際の変更方法、使用感について早速お話ししたいと思います。


以前のBloggerテーマの難点

私が以前使っていたテーマは「シンプル」のテーマでした。他にもないかと当初探していたのですが、なかなか良いものが見当たらないため、「オーソドックスなものをカスタマイズして使おう」という発想で使っていました。

しかし、実際に使っていてサイトとして不便に感じるところが多々ありました。具体的には以下のようなことが挙げられます。

  1. デフォルトの文字サイズが小さく読みづらい
  2. 関連記事への導線が少ない
  3. スマホ版ではサイドバーの要素もなくなってしまう（レスポンシブ対応していない）
  4. タイトルタグの表記がデフォルトでは「[サイト名][記事名]」となってしまい、検索エンジン上で個別記事の内容を伝えにくい
  5. 個別記事でなぜかh1要素がサイト名になっている
  6. シェアボタンの導線が見づらい
  7. 「続きを読む」タグを入れないとトップページや記事一覧ページがひたすら長くなってしまう

私はWordPressも使ったことがありますが、実際にBloggerを始めてみて、WordPressの方がはるかに使いやすいと感じていました。それでもBloggerで続けたのは、多少の意地と、Googleサービスでどこまでいけるかチャレンジしてみようという意図からでした。

そのため、これまでは文字サイズやタイトルタグ表記ルール変更のカスタマイズ、「続きを読む」タグの設置など地道な対応をしてきましたが、不便さは常に拭えませんでした。

PrimeZELOを選んだ理由

そのような私にとって、上記の問題を一挙に解決してくれるテーマを発見した時に、すぐに行動したのは自然なことだと言えます。

といっても、見つけたのはたまたまで、もともとは今のテーマのままで更にカスタマイズを加えようとBloggerでのogpの設定について調べていました。

ところが、そこで見つけた「ウラの裏」のBloggerのサイトがデザイン的に非常に見やすく、Bloggerでもこのようなデザインが実現できるということに感動を覚えるほどでした。

どのようにしてこのようなデザインを実現しているのだろう？

と疑問に思っていると、その関連記事にあった「2018年のBloggerテーマ総括 - 最終的にPrimeZELOに変更してわかったこと」を読み、最近になってBloggerの便利なテーマが新しく登場していて、それを「ウラの裏」でも使用していることがわかりました。

新しい便利なテーマとは、制作者ひろさんによるZELOシリーズです。

  • デフォルトでも文字が大きく見やすいなどユーザビリティ上の配慮が施されている
  • 関連記事導線やシェアボタンなども改善されている
  • タイトルタグやh1タグなどSEO上の配慮もされている
  • レスポンシブデザインになっている
  • 日本語の仕様に適している

など、様々な点で今まで使っていたテーマに比べて格段に改善されています。

現時点でZELO、OrangeZELO、PrimeZELOの3つが現在登場していますが、構造化マークアップにも対応していて、スピードも速いということから私はPrimeZELOを採用しました。

OrangeZELO、PrimeZELOは有料（それぞれ3,000円）となっているため、無料で済ませたいという方はとりあえずZELOを使うのが良いのではないのでしょうか。

PrimeZELOの導入方法

PrimeZELOの導入は、制作者ひろさんが運営する「Bloggerなび」から購入し、「Reset.xml」、「Prime_ZELO.xml」をダウンロードすることから始まります。購入はPaymoで、VISAもしくはMasterCardのクレジット払いとなっていますのでご注意ください。

ダウンロード後の導入手順はOrangeZELOと同じで、「【Orange ZELO】導入チュートリアル・ウィジットの設定を読めば大体網羅できます。

簡単にここでも触れておくと、
  1. 現在のテーマのバックアップをとっておく
  2. Reset.xmlをアップロードする
  3. HTMLの編集でb:sectionの内容を削除する
  4. Prime_ZELO.xmlをアップロードする
の４つの手順となっています。

実際にやってみて困ったのは、Reset.xmlをアップロードしようとしたときに、
テーマを保存できませんでした。
テーマの形式が適切でないため、解析できません。すべての XML 要素が適切に閉じられているかどうか確認してください。XML エラー メッセージ:
(SyntaxError) : Unexpected token <

というエラーメッセージが表示されてしまったことです。何度やってもその表示が消えず、ひろさんに直接問い合わせてしまいました（すぐに返答していただけました）。

結局は表示の問題だったらしく、実際にHTMLの編集で確認をするときちんと反映されていたため、その後は問題なく導入することができました。

PrimeZELOを導入後の使用感

導入後の使用感はおおむね快適です。文字も見やすく、関連記事も自動で出てきて、目次も自動生成される仕様となっており非常に便利です。

その中で、導入後にひと手間が必要だと感じた点は２点です。

１点目は、WordPressのようにそれまで私はpタグを使用して改行設定していたのですが、pタグが改行としては認識されなくなったということです。このため、投稿の編集でサイドバーのオプションから改行設定を「Enterキーを押して改行」に切り替えて対応しました（記事数も少なかったので

タグは削除しました）。

２点目は、トップページや記事一覧ページで画像が表示されるようになった点です。デフォルトではPrimeZELOの画像が挿入されてしまうため、全記事に画像挿入することが望ましい状態になります。そこで、過去分も遡って画像挿入をすることにしました。画像は「photoAC」で取り揃えようかと考えています。

ただ、感じた不便としてはそれぐらいで、他は格段に使いやすくなっているので、個人的に3,000円を払う価値は十分にあると思っています。

Bloggerを使っている方や使うことを検討されている方のテーマ選定に、少しでも参考になれば幸いです。