【動画有り】管理画面の基本操作が把握できたところで、ワードプレスの最大の特徴のひとつ、テーマについて学んでおきましょう。選択に困らないような手順と考え方、末尾にお勧めのテーマを紹介しています。

WB-2:ワードプレスのテーマ選びの考え方と事前準備

テーマについて最初に知っておくべきこと

 11,675種類😵‍💫!

 現時点(2024年1月1日)で、ワードプレスの公式ライブラリ(ナビゲーションメニューの『外観』→『テーマ』→『新規追加』)に登録されているテーマの数です。ここに表示されているものは全て無料で使うことができます。

 表示されたテーマを流すように眺めていくと、そのデザインの豊かさには驚かされますが、使われている画像が提供されているとは限りませんし、そのテーマに備わっている機能だけで実現したデザインとも限りません。この点を勘違いすると迷子になります

 そこでまずは、テーマ選びを始める前に、テーマについて知っておくべきことを3点説明しておきます。

テーマの役割とは?

 テーマの役割については、前回講座の『外観』の動画の中で視覚的に説明していますので、そちらをご参照下さい。

ワードプレスのテーマには2種類ある!

 ワードプレスはほぼ毎年、デフォルトのテーマ(ワードプレスをインストールすると自動的に付いてくるテーマ)を新たに発表しています。

 2022年1月に配布が始まったデフォルトテーマ『Twenty Twenty-Two』からは、『ブロックテーマ』と呼ばれているタイプに変更となり、デザインの自由度が飛躍的に向上しました。

 ですが同時に操作方法も一変。20年近く変わらなかった使い方が大きく変わったため、現在(2024年1月)もまだ変遷期間が始まったばかりといった状況で、上記のワードプレス公式ライブラリに登録されているブロックテーマは、548種類に留まっています。

 尚、ブロックテーマよりも前のテーマは『クラシックテーマ』と呼ばれています。

ブロックテーマとクラシックテーマの違いとは?

 どちらのタイプのテーマを使っているかによって、ナビゲーションメニューの『外観』に含まれているサブ項目からして、全く異なります。もちろん使い方も全く異なりますので、ウェブサイトを作り始める場合は、どちらを選択したかを知らないままだと迷子になります

 

ブロックテーマ
クラシックテーマ

 ブロックテーマの場合には、デザイン的な変更は全て『エディター(編集画面のことです)』から行うようになっています。このエディターはテーマそのものを視覚的に編集できるようになっているもので、以前は php や css といったコーディング(プログラミング)を学ばなければできなかったことが可能になりました。

 クラシックテーマの場合は、『カスタマイズ』から、配色や文字の大きさなどサイト全体のデザイン的な変更を行うようになっています。変更できる項目は、テーマによって大きく異なります。

指をさしている手のイラスト。注意喚起を促すために使用している

カスタマイズ画面には設定がない部分のデザインを変更したい場合には、css を学ぶことが必要になってきますので、その点がクラシックエディタ―の限界点ということになります。

テーマの追加と入れ替えは簡単

 ワードプレスで制作したウェブサイトの場合は、テーマを入れ替えると、レイアウトなどのデザイン的なことが変わるだけで、文章や画像はそのまま使い続けることができます。

 これは、テーマによるデザイン・レイアウトの設定とみなさんが入力する文章や画像とが、完全に分離されているからで、そのことによって以下が実現しています:

  1.  複数のテーマを簡単に追加することが可能で、
  2.  テーマの切り替えはワンタッチ感覚。
  3.  しかも、デザイン・レイアウトに関する設定はテーマ毎に保存されるため、切り替えても設定したことは保持される。

 では以上3点を念頭に、実際の使い方を眺めてみましょう(クラシックテーマ、ブロックテーマ共通です):

【動画】 WordPress 初めてのテーマ選びと考え方(7分8秒)

  • テーマとはどのような役割を果たしているかの確認
  • テーマのインストール・切り替え方法
  • なぜワードプレスではこのような仕組みになっているのか

 公式ライブラリに登録されている無料テーマの種類の多さと、それがビジネスに繋がる仕組みを提供しているワードプレスの仕組みには、驚かれた方が多いかもしれません。

指をさしている手のイラスト。注意喚起を促すために使用している

 注意点としては、テーマの追加や切り替えの手軽さは、ワードプレスに公式に登録されているテーマだからこそです。そうではないテーマを選ぶと、このようにはいきません。その場合のインストール方法については、テーマの入手先にお問い合わせ下さい。

テーマはどのように選ぶべきか

 上の動画の中でも説明しましたが、初めてワードプレスを使う場合には、

テーマは後で決める

ことです。コンテンツ無しの、骨組みだけのサイトを眺めてみても、デザイン的なことは何一つ伝わってきませんその状態でテーマを選ぶのは、特に初心者の方には難しいと思います。

 そこで、まずは試運転感覚で、文章や画像などのコンテンツを入力することに慣れることです。

 投稿を作成する編集画面は、現在は『ブロックエディター解説はこちらの講座)』と呼ばれているものが標準となっており、その基本を押さえるだけでも、時間を要します。

テーマのデザインの何が変更できて、何ができないのか?

 ワードプレスのテーマは、テーマ内で(つまりプログラミングなどの知識無しで)変更出来る部分は、選ぶテーマによって「大きく」異なります。

ブロックテーマでのデザインの変更可能範囲は?

 ブロックテーマは、ワードプレスの最新の機能を活かして作られたもので、テーマそのものを視覚的に編集できるようになっています。このため、ページのレイアウトから文字の大きさ、配色などデザイン的なことをかなり自由に設定できるようになっています。

 ただし、ブロックテーマを使ってデザインを変更できるようになるためには、ブロックエディターに慣れていなければできません(キッパリ)。逆に、ブロックエディターに慣れている方であれば、ブロックテーマを使うことは、そう難しいことではありません。

クラシックテーマでのデザインの変更可能範囲は?

 この場合には、デザイン面の変更はカスタマイザー(『外観』→『カスタマイズ』)で行いますが、カスタマイザーで表示される設定項目の数は、そのテーマに依存します。

【動画】 WordPress クラシックテーマのカスタマイザー概要(8分33秒)

 次の動画では、テーマによるカスタマイザー(「外観」→「カスタマイズ」)の概要を、Twenty Twenty-One と Customify (カストミファイ)というふたつのテーマで説明しています。

 いかがでしたか?あくまでイメージをつかむものですから、細かいことは気にする必要性はありません。後半で登場したテーマ、 Customify の詳しい使い方については、『WR-3:テーマ Cutomify(カストミファイ)の使い方前編・レイアウト』と『WR-4:テーマ Cutomify(カストミファイ)の使い方後編・配色と文字』をご参照下さい。

css を学ぶと、デザインの自由度は上がるのか?

 クラシックテーマを使う場合には、css を学ぶとデザインの自由度が一気に広がり、楽しさ倍増なのですが、これにハマると本業がおろそかになりかねませんので、どうぞご注意を。

 逆に、ブロックテーマを使う場合には、”css” が必要と感じることはほとんどないと思います。

 デザインの細かな部分にこだわることを否定するつもりは全くありませんが、それよりもまずは内容を充実させて、サイトのパフォーマンスを含めた運営管理ができるようになることのほうを優先させるべきだと、札幌Geezerは考えています。これだけでも結構大変な作業量になります。

結局、何を基準にテーマを選べばよいのか?

 テーマを選ぶにあたっては、「継続性のある」サポートも重要ということを理解しておきましょう。特にクラシックテーマを選択する場合には、この点は重要です。

 というのは、クラシックテーマのデザイン的な設定は、そのテーマ独自のものになっているからです。なのでサイトを作り込んでしまうと、後になって別のテーマに変更する時は、デザイン的な設定を一からやり直しになってしまうことが多いのです。

 札幌Geezerは、この点で失敗したことがあります。作者さんが、サポートを止めてしまったのです。テーマも更新が必要なことが多々ありますので、サポートがなくなってしまっては、それを使い続けることはできません。

 札幌Geezerがテーマを選ぶ時は、

  1. そのテーマの有料のオプションは用意されているか?
  2. きちんとしたウェブサイトがあり、説明が充実しているか?
  3. そのテーマ以外にどのようなテーマやプラグイン、あるいはサービスを提供しているか?

の3点を最低でもチェックします。

 フリーで配布されているテーマも、ビジネスの一環として提供されている場合がほとんどですから、その運営主体が、どのようなビジネスを展開しているのかは、知っておくべきだと思います。

 参考までに、現在このサイトで使っているのは、Kadence(ケイダンス) のプロ版(有料)です。以前使っていた Customify と同様、カスタマイズできる箇所が多く自由度が高いことが特徴です。

お勧めのテーマは?

 これからワードプレスを使い始めるなら、ブロックテーマを選ぶことを強くお薦めします。クラッシックテーマを選ぶ場合には、設定項目の多い、高機能のものを選択しましょう。

指をさしている手のイラスト。注意喚起を促すために使用している

 どちらの場合も、「投稿」の編集画面については、初期設定でブロックエディターです。テーマの編集画面と使用感はそっくりですが、この二つは別物ですので混乱しないようにお願いします。

1.Twenty Twenty-Four(ブロックテーマ)

 現時点(2024年1月)で、最新のワードプレスの初期設定のテーマです(公式ページはこちら)。

 ワードプレスが初めてのみなさんは、これを用いて試運転してみることを強くお薦めします。投稿部分のみだけでも、デザインの自由度を味わうことができますし、それに慣れてくるとテーマの編集画面を使えるようになりますので、試運転からそのまま本稼働用にサイトを作り込むことが可能です。

2. Twenty Twenty-One(クラシックテーマ、以下同様)

 ワードプレスの初期設定テーマとしては、最後のバージョンがこれです(公式ページはこちら)。クラシックテーマの試運転用には、まずはこれを使ってみるのがお薦めです。

3. Twenty Sixteen

 よく見かけるブログスタイルになっている点が、お勧めの理由です(公式ページはこちら)。最初のうちは、分かりやすいことがいちばんです。

4.GridBox (グリッドボックス)、Maxwell (マックスウェル)

 このふたつは、同じ作者によるものです(サイトはこちら)。トップページに投稿を並べるスタイルのテーマを得意としているようです。カリッとしたデザインと使い易さが、気に入って採用しました。

 ブロックテーマで同様のレイアウトを作ることができるようになったため、現在は使用していません。

5. Customify (カストミファイ)

 テーマ内で指定できる項目が多く、デザインの細かなところまで指定できるのが特徴で人気のテーマのひとつになっています(サイトはこちら)。カスタマイザーのメニュー項目のほとんども日本語化されています。

 このサイトは、Customifyのプロ版を使用して作成していましたが、現在は、便利なブロックを数多く提供している Kadence(ケイダンス)のプロ版を使用しています。

6. Lightning (ライトニング)

 日本の会社が制作したテーマで、日本語対応がバッチリです(サイトはこちら)。札幌Geezerも、別のウェブサイトで使っていたことがあります。

 エックスサーバーでは、ワードプレスのインストール時に、このテーマを選択して同時にインストールすることができるようになっています。

この講座の要点

  • ワードプレスのテーマは、サイト全体のレイアウト・デザインを決める役割を果たしていること。
  • テーマと文章・画像とは、完全に分離しているため、テーマを変更しても文章・画像には影響が及ばないこと。
  • テーマのデザイン設定はテーマ毎に保存されているため、テーマを切り替えても保持されること。
  • テーマには、ブロックテーマとクラシックテーマの2種類があり、デザイン設定の方法が両者で大きく異なること。
  • テーマを選ぶ前に、ワードプレスの標準テーマで試運転(記事を投稿)しておくことが、後々に迷子にならないためにも重要なステップであること。
  • クラシックテーマの場合には、デザインの変更をできる箇所が、カスタマイザーで表示されている項目に限定されていること。

ご質問・ご要望について

 疑問に思うことや説明が至らないことがありましたら、遠慮なく下のコメント欄またはお問い合わせフォームからご連絡いただければ幸いです。今後の更新作業の参考にさせていただきます。

課題

1.自分の言葉でまとめておこう

 この講座で、得た学びを自分の言葉にしておきましょう。箇条書きが良いと思いますが、自分のスタイルでOKです。紙のノートでもパソコンやスマホのアプリでも構いませんが、脳内に留めずにその外側に一旦はアウトプットすることが重要です。オススメは紙のノートです。いつでもパラパラと眺めることができ、記憶に残りやすいからです。

2.自分の手で操作してみよう

 この講座で紹介している内容は、基本的なことばかりです。少しでも早く慣れるために、動画の中で紹介されている機能や使い方は、記憶がフレッシュなうちに、自分の手で操作してみましょう。

3.発信しよう

 「これは参考になった」あるいは何かの「インスピレーションを得た」ようなことがあれば、同じように感じる方が、あなたの周りにもいるかも知れません。学んだことをあなたの言葉で(←ここが重要)人に伝えようとすることで、それが自分のものになることを体験しましょう。


 

[ 前の講座へ | コースリストへ戻る次の講座へ ]