サポートに戻る サイトをデザインする テーマ テーマ

テーマ

WordPress でサイトを作成する初期段階では、テーマが表示されます。このガイドでは、テーマとは何か、テーマがサイトに与える影響、表示されるテーマの種類の違いについて説明します。

テーマについて

テーマとは、サイトのビジュアルデザインと全体的なレイアウトのことです。サイトのコンテンツが訪問者にどのように表示されるかを制御します。テーマには、配色、タイポグラフィ、ページレイアウト、その他の要素などのデザインコンポーネントがあり、サイト全体で一貫したまとまりのある外観を作り出します。

テーマは、サイトの外観と機能の開始点を用意します。サイトのデザインをゼロから構築しなくても、テーマがサイトをすばやく立ち上げるために必要なデザインフレームワークを提供します。テーマを使用すると、コンテンツの見え方を決めるのにあまり時間をかけずに、すぐにコンテンツの作成を開始できます。デザイン性の高いテーマが、ユーザーの代わりに面倒な作業を行います。

また、あるテーマを他のテーマに変更してもサイトのコンテンツは失われず、新しい変更が自動的に適用されます。

テーマ: Twenty Twenty-Four

テーマを選択する方法

非常に多くのオプションがあるため、テーマに何を求めているかを考えることが有効です。覚えておくべき主な点は、サイトのレイアウトを完全に制御できるということです。WordPress.com テーマを有効化した後、「サイトエディター」を使用して、サイトのすべての要素のテキスト、画像、色、フォント、レイアウト、位置を変更できます。

テーマを決定する際には、以下のようないくつかの考慮すべき要素があります。

  • ヘッダー部分の見た目を気に入っていますか ? 通常この部分には、サイトのタイトル、メニュー、ロゴが表示されます。
  • コンテンツの構成や表示方法を気に入っていますか ? この外観は変更できますが、気に入ったレイアウトを選択することで、後で変更する手間を省くことができます。
  • モバイルやタブレットの画面に表示される見た目を気に入っていますか ? 見た目を確認するには、ライブデモを開き、上部のセレクタを使用してデスクトップ、タブレット、モバイルを切り替えます。WordPress.com のすべてのテーマは、携帯電話を含むさまざまな画面サイズに対応しています。
テーマ: Gourmetto

テーマを見る際は、デモに表示される主題よりも、全体的なレイアウトに注目しましょう。テーマのデモサイトでは、家具店、音楽ポートフォリオ、ファッションサイト、料理ブログなどの例が紹介されている場合があります。ただし、デモのテキストや画像を自分のものに入れ替えれば、自分のサイトをさまざまなトピックにカスタマイズできます。

テーマ: Iotix

利用可能なテーマを見る

WordPress.com で利用可能なテーマのコレクションを参照するには、WordPress.com ダッシュボードで「外観」→「テーマ」にアクセスします。これらのテーマは、サイトにアップロードしたりインストールしたりする必要はありません。ボタンをクリックするだけで有効化できます。

利用可能なテーマのスクリーンショット。無料、プレミアム、パートナーのテーマが複数表示されています。

あらゆるタイプのサイトや予算に合わせたさまざまなテーマが用意されており、常に新しいテーマが追加されています。テーマを参照すると、テーマ名のすぐ下に次のいずれかのラベルが表示されます。

プラグイン対応プランでは、 AstraOceanWP など、WordPress コミュニティが開発したテーマを見つけることもできます。お気に入りのコミュニティテーマを検索し、テーマのサムネイルの下にある「コミュニティ」タグを探します。

さまざまな種類のテーマ

以下の用語は、 WordPress エコシステムのテーマの種類を表しています。

ブロックテーマは、WordPress で利用できる最新かつ最高のテーマです。フルサイト編集 (FSE) テーマとも呼ばれるこれらのテーマは、サイトエディターの機能を最大限に活用して、コーディングの経験がなくても思いどおりのレイアウトを作成できます。

ブロックテーマを使用すると、サイトデザインの柔軟性が大幅に向上します。最初のレイアウトをラックから取り外して使用したり、自分のビジョンを実現するための出発点として使用したりできます。ブロックテーマはサイトのすべての要素を正確に制御できます。

ブロックテーマは「スタイル」を使用してサイトの色、タイポグラフィ、レイアウトを設定し、これまでのテーマでは不可能だったカスタマイズの可能性を広げます。サイトのコンテンツの表示方法を制御するテンプレートを編集できる他、カスタムテンプレート、テンプレートパーツパターンを作成して、サイトのページ、投稿、その他のコンテンツ全体で再利用できるようにすることで、サイトが単一の外観、カラーパレット、ナビゲーションメニューに縛られることがなくなります。

注意: 以下で説明するユニバーサルテーマは、ブロックテーマフィルターページにも表示されます。

ユニバーサルテーマ

ユニバーサルテーマは、ブロックエディター用に構築されたテーマの最初のバージョンです。ブロックテーマとほとんど似ていますが、主な違いは、メニューなどの特定の要素を編集するためにカスタマイザーを使用することもできることです。

ハイブリッドテーマ

ハイブリッドテーマは、サイトエディターではなくブロックを使用するために構築された基本的なテーマです。ブロックテーマと比較すると、最小限のカスタマイズオプションしかありません。

クラシックテーマ

クラシックテーマは、 WordPress (ブロック) エディターが導入される前に開発されたテーマを指します。デザインは主に「外観」→「カスタマイズ」で編集できますが、全体的な構造とレイアウトは通常テーマによって設定され、ブロックテーマで提供されるものと同じ制御レベルで調整することはできません。ほとんどのブロック編集オプション (全幅コンテンツなど) はクラシックテーマでは利用できません。

サードパーティのテーマ

本ガイドのこのセクションは WordPress.com Creator、Entrepreneur の各プランおよび従来の Pro プランを利用しているサイトを対象としています。無料プラン、Starter、Explorer プランのサイトでこの機能を利用するには、プランをアップグレードしてください。

サードパーティのテーマは、WordPress プラットフォームで使用するためにさまざまなサードパーティの開発者によって開発されたテーマです。サイトにサードパーティのテーマを追加する詳細な手順については、「 テーマをアップロードする」を参照してください。

サイトのビジョンに関係なく、ふさわしいテーマを見つけることができます。WordPress.org のテーマや Themeforest などのマーケットプレイスのテーマを検討している場合は、テーマを選択する際に次の点にも注意してください。

サードパーティのテーマに対するサポートは提供していませんが、これらのテーマに関するサポートを受ける方法については、「プラグインとテーマのサポートを受ける」サポートガイドで提案しています。

テーマについてさらに詳しく

サイトにおけるテーマの有効化、設定、カスタマイズについては、専用のテーマガイドを参照してください。

テーマを有効化する

テーマの選択はサイト作成の初期段階における重要なステップです。このガイドでは、テーマの探し方とサイトのイメージに合うテーマの選び方について説明します。

デモコンテンツを追加する

デモコンテンツを使用することで、テーマの特徴を理解できます。サイトにデモコンテンツを追加すると、後から自分のテキストや画像で置き換えることができます。デモコンテンツを使用すると、空白…

テーマを変更する

サイトのテーマを変更して既存のコンテンツを一新できます。このガイドでは、新しいテーマに切り替える方法について説明します。

子テーマを作成する

HTML と PHP の知識があれば、子テーマを作成してテーマの元となるコードに変更を加えることができます。

テーマを削除する

このガイドでは、サイトからテーマを削除する方法について説明します。

テーマファイルエディター (高度な設定)

この機能は、WordPress.com Creator プランまたは Entrepreneur プランをご利用のサイトで使用できます。サイトでレガシープランをご利用の場合は、Pro プランでご使用いただけます。

テーマファイルエディターは、サイトにインストールされているテーマのコードを直接編集するために使用される WordPress のツールです。このツールは、高度なプログラミング知識を持つサイト所有者を対象としています。対象外のユーザーの場合は、サイトを破損するリスクがあるため、この機能を使用しないことをお勧めします。ほとんどのタスクは、テーマファイルエディターを使用せずに、こちらの代替手段を使用して完了できます。

テーマファイルエディターのスクリーンショット。Twenty Twenty-One テーマの style.css ファイルが表示されています。
テーマファイルエディター

テーマファイルエディターにアクセスするには:

  1. サイトのダッシュボードにアクセスします。
  2. サイドバーの「外観」に移動します。
  3. 「テーマファイルエディター」をクリックします。これがリストにない場合は、お使いのテーマで「テーマファイルエディター」にアクセスできないことを意味します。
  4. 右上の「編集するテーマを選択」と表示されたドロップダウンメニューから編集するテーマを選択し、「選択」ボタンをクリックします。
  5. 右側で、編集する特定のテーマファイルをクリックすると、このテーマファイルが左側のコードウィンドウに読み込まれます。
  6. 変更を加えた後、下部の「ファイルを更新」ボタンをクリックして変更を保存します。

テーマファイルエディターの代替手段

テーマファイルエディターを使用しなくても、テーマに大幅な変更を加えることができます。次のオプションを検討してください。

Copied to clipboard!