WordPressテーマをカスタマイズする方法(初心者向けガイド)

公開: 2022-03-29


WordPressのテーマデザインをカスタマイズする方法を学びたいですか?

多くのWordPressテーマには、デザインとレイアウトを簡単にカスタマイズするための組み込みオプションが付属しています。 プラグインを使用して、カスタマイズオプションを追加することもできます。

この記事では、WordPressテーマを簡単にカスタマイズして独自のテーマにする方法を紹介します。

初心者向けのWordPressテーマのカスタマイズ

以下は、このガイドで取り上げるトピックのリストです。

  • WordPressテーマをカスタマイズする理由
  • デフォルトのテーマカスタマイザーの使用
  • フルサイトエディターでWordPressテーマをカスタマイズする
  • WordPressでレガシーテーマカスタマイザーを使用する
  • フルコントロールでWordPressテーマをカスタマイズ
  • SeedProdPageBuilderを使用して個々のページをカスタマイズする
  • カスタムWordPressテーマを作成する

準備? 始めましょう。

WordPressテーマをカスタマイズする理由

WordPressのテーマは、一般的なWebサイトのニッチ向けに設計されています。 たとえば、さまざまな種類の中小企業のWebサイト、写真家、ブロガーなどのテーマがあります。

テーマを選んだら、自分の要件に合わせてカスタマイズする必要があります。

たとえば、独自のカスタムロゴ、ブランドカラーを使用したり、レイアウトを少し調整したり、フォントサイズを変更したり、独自の画像を使用したりすることができます。

これらのカスタマイズのいくつかは、あなたのビジネスとブランドを真に表すWebサイトを作成するために必要であり、他の人のように見えるだけではありません。

選択したWordPressテーマに応じて、これらのオプションはテーマごとに大きく異なる場合があります。

たとえば、テーマによっては、サイドバーを右から左に移動するオプションが提供されている場合もあれば、レイアウトにサイドバーがない場合もあります。

そうは言っても、コードを記述せずにWordPressテーマを簡単にカスタマイズし、Webサイトを壊すことなく次のレベルに引き上げる方法を見てみましょう。

デフォルトのテーマカスタマイザーの使用

WordPressは、WordPress5.9でフルサイトの編集エクスペリエンスを提供しました。

現在、新しいフルサイト編集機能を完全にサポートしているテーマはあまり多くありません。

ただし、WordPressテーマをカスタマイズするためにそれを使用する方法を示します。 また、従来のテーマカスタマイザーの使用方法と、初心者に推奨する完全なWordPressサイトビルダーツールについても説明します。

WordPressのフルサイトエディターを使用してテーマをカスタマイズする

WordPressテーマがフルサイトエディターをサポートしている場合は、WordPress管理サイドバーの[外観]オプションの下に[エディター]メニューが表示されます。

WordPressで新しいフルサイトエディターを起動する

それをクリックすると、完全なサイトエディタが起動します。

このエディターは、WordPressの投稿やページを作成するために使用するブロックエディターと同じです。

フルサイトエディタ

ブロックを追加することで、テンプレートに新しい要素を追加できます。 通常のブロックとは別に、ナビゲーション、ロゴ、クエリ後のループなど、サイト全体のブロックを使用することもできます。

各ブロックには独自の設定があり、さまざまなスタイルを設定したり、色、タイポグラフィ、その他のオプションを変更したりできます。

ブロック設定

WordPressテーマは、さまざまなセクションをすばやく作成するために使用できる追加のパターンを提供する場合もあります。

これらは[パターン]タブにあります。

レイアウトにパターンを追加する

上部のテンプレート名をクリックし、編集する別のテンプレートを選択することで、Webサイトのさまざまな領域を編集できます。

その他のテンプレートを表示するには、下部にある[すべてのテンプレートを参照]をクリックします。

Borwseテンプレート

これにより、編集可能なテーマで使用可能なテンプレートのリストが表示されます。

テンプレート名をクリックするだけで、エディターで開きます。

編集するテンプレートを選択します

テンプレートは同じブロックエディタで開きます。

ここから、好きなように編集できます。

投稿テンプレートの編集

テーマに加えた変更に満足したら、上部にある[保存]ボタンをクリックして変更を適用します。

テーマへの変更を保存します

フルサイトエディターは、WordPressテーマをカスタマイズするための強力で柔軟な方法です。

ただし、これはまったく新しい機能であり、多くのWordPressテーマは現時点ではサポートしていません。

WordPressでレガシーテーマカスタマイザーを使用する

WordPressテーマがまだ完全なサイトエディターをサポートしていない場合は、WordPressのレガシーテーマカスタマイザー機能を使用します。

その場合は、[外観]»[カスタマイズ]ページに移動して、テーマをカスタマイズできます。

WordPressテーマカスタマイザーの起動

それをクリックすると、テーマカスタマイザーが起動します。

画面の左側にカスタマイズ設定が表示され、右側にWebサイトのライブプレビューが表示されます。

WordPressテーマカスタマイザー

Webサイトの編集可能な領域は、ライブプレビューで鉛筆アイコンで強調表示されます。

左側のパネルの各オプションを展開して、設定を変更することもできます。

テーマカスタマイザの拡張オプション

左側のパネルのオプションの数は、テーマごとに異なります。

ただし、ほとんどのテーマは、サイトのタグライン、ウィジェット、ホームページ設定、メニュー、追加のCSS設定などの基本をサポートします。

詳細については、WordPressテーマカスタマイザーを使用してテーマを編集する方法に関するガイドをご覧ください。

フルコントロールでWordPressテーマをカスタマイズ

デフォルトのWordPressテーマのカスタマイズオプションは、使用しているWordPressテーマによって異なります。

テーマが機能をサポートしている場合は、カスタマイザーまたはフルサイトエディターを使用してテーマをカスタマイズできる場合があります。 これにより、WordPressテーマをカスタマイズする機能が制限されます。

あなたのウェブサイトのためにさらにカスタマイズしたり、カスタムのWordPressテーマを作成したい場合はどうなりますか?

これがSeedProdの出番です。

市場で最高のWordPressウェブサイトビルダーです。 これを使用して、美しいWebサイトのレイアウトを作成したり、コードを記述せずにカスタムテーマを作成したりすることもできます。

最初に行う必要があるのは、SeedProdプラグインをインストールしてアクティブ化することです。 詳細については、WordPressプラグインのインストール方法に関するステップバイステップガイドを参照してください。

アクティベーション時に、ライセンスキーを入力する必要があります。 この情報は、SeedProdWebサイトのアカウントで見つけることができます。

その後、カスタムWordPressテーマを作成するか、Webサイトの個々のページを作成するかを選択する必要があります。

SeedProdは両方を行うことができ、両方のアプローチを紹介します。

SeedProdで個々のWordPressページをカスタマイズする

このアプローチは非常に柔軟性があり、オンデマンドのページレイアウトを簡単に作成できます。

たとえば、製品やマーケティングキャンペーンのカスタムランディングページをデザインしたり、訪問者がメーリングリストにサインアップした後に送信するサンキューページを作成したりできます。

SeedProd»ランディングページページに移動し、[新しいランディングページの追加]ボタンをクリックするだけです。

新しいランディングページを追加する

次に、ページのテンプレートを選択する必要があります。

このテンプレートは開始点として使用されるため、後でテンプレート内のすべてを変更できます。 または、空白のキャンバスから始めることもできます。

テンプレートを選択

テンプレートをクリックするだけで続行できます。

次に、SeedProdは、ページのタイトルを指定してURLを選択するように求めます。

ページ名とURL

必要な情報を入力した後、。 [保存してページの編集を開始]ボタンをクリックします。

これにより、SeedProdページビルダーインターフェイスが起動します。 これはドラッグアンドドロップのデザインツールです。

SeedProdでページレイアウトを編集する

左側には、ページレイアウトに追加できるブロックとセクションが表示され、右側にはページの編集可能なライブプレビューが表示されます。

ページの任意の要素をポイントしてクリックするだけで編集できます。

ポイントアンドクリックして要素を編集します

左側の列から、新しいブロックや完全なセクションをレイアウトに追加することもできます。

新しいブロックを追加する

SeedProdには、Webサイトを作成するために必要なすべての人気のあるWebデザイン要素が付属しています。 お問い合わせフォーム、オプチンフォーム、ログインフォーム、証言、プログレスバー、アコーディオン、ナビゲーションメニュー、アイコンボックスなどが含まれます。

また、WooCommerceの完全なサポートも含まれています。 WooCommerceブロックを使用して、Webサイトの任意の場所に商品を表示したり、カスタムチェックアウトページを作成したり、オンラインストアのカートページをデザインしたりできます。

WooCommerceブロック

ページのデザインとレイアウトに満足したら、右上の[保存]ボタンをクリックします。

ここから、ページを公開するか、テンプレートとして保存するかを選択することもできます。

ページを保存または公開する

それでおしまい! このプロセスを繰り返して、Webサイトにさらにカスタムページを作成できます。

SeedProdを使用してWordPressでカスタムテーマを作成する

このアプローチは、ブログ、ビジネスWebサイト、またはeコマースストアに真にユニークなデザインを作成する場合に強くお勧めします。

この方法では、同じドラッグアンドドロップページビルダーを使用して、独自のカスタムWordPressテーマを最初から設計することになります。

最良の部分は、サイトにインストールしたテーマに関係なく、SeedProdカスタムテーマが機能することです。 つまり、標準のWordPressテーマのカスタマイズについて心配する必要はありませんが、デザインを自由に作成できます。

開始するには、 SeedProd»Theme Bulderページに移動し、[Themes]ボタンをクリックします。

SeedProdテーマを作成する

SeedProdは、選択可能なスターターテーマの束を表示するようになりました。

これらのテーマのあらゆる側面を完全に変更できます。

テーマテンプレートを選択

テーマを選択すると、SeedProdはすべてのテーマテンプレートを生成します。

テーマテンプレートの編集

テンプレートファイルの下にある[デザインの編集]リンクをクリックするだけで編集できます。

右側の列にテンプレートのライブプレビューが表示され、左側の列に編集パネルが表示されます。

ポイントしてクリックするだけで、アイテムを編集したり、左側の列から要素をドロップしたりできます。

テンプレートに新しいブロックを追加します

SeedProdには、サイト全体の編集に固有のブロックも付属しています。

これらは、コンテンツループ(ブログ投稿用)、投稿タイトル、注目の画像などを表示するために使用できる動的ブロックです。

テンプレートタグブロックを追加する

テーマへの変更が完了したら、変更を保存することを忘れないでください。

このプロセスを繰り返して、他のテンプレートを自分の好みに合わせて編集します。

終了したら、 SeedProd»テーマビルダーページに移動し、[SeedProdテーマを有効にする]オプションの横にあるスイッチを[はい]に切り替えます。

SeedProdテーマを有効にする

SeedProdは、WordPressテーマを作成したカスタムテーマに置き換えます。

SeedProd WordPressテーマビルダーの詳細については、コードを記述せずにカスタムWordPressテーマを作成する方法に関するチュートリアルを参照してください。

この記事が、WordPressテーマを自分の好みに合わせてカスタマイズする方法を学ぶのに役立つことを願っています。

また、電子メールニュースレターの作成方法に関するガイドを参照するか、WordPressSEOガイドを参照してWebサイトを最適化して検索トラフィックを増やすこともできます。

この記事が気に入った場合は、WordPressビデオチュートリアルのYouTubeチャンネルに登録してください。 TwitterやFacebookでも私たちを見つけることができます。

WordPressテーマをカスタマイズする方法(初心者向けガイド)の投稿は、WPBeginnerに最初に掲載されました。