最新のSeedProdニュース

ビジネス成長を支援するWordPressチュートリアル、ヒント、リソース

WordPressでテンプレートキットをインストールする方法

1時間以内にWordPressテンプレートキットをインストールする方法(コード不要) 

執筆者: 著者アバター ステイシー・コリン
著者アバター ステイシー・コリン
Stacey Corrinは、WordPress、SEO、デジタルマーケティングに関する執筆経験15年以上の認定コンテンツマーケティングおよび検索スペシャリストです。彼女はSeedProdとRafflePressのコンテンツを管理しており、自身が積極的に使用しテストしているツールや戦略を取り上げています。
    
レビュー担当者: レビュアーアバター ターナー ジョン
レビュアーアバター ターナー・ジョン
ジョン・ターナーはSeedProdの共同創設者です。彼は20年以上のビジネスおよび開発経験を持ち、彼のプラグインは2500万回以上ダウンロードされています。

要約:WordPressでテンプレートキットをインストールする方法

オールインワンキットをすぐに使いたい場合でも、EnvatoやElementorからダウンロードした場合でも、コードなしでWordPressにテンプレートキットをインストールできます。以下に簡単な手順を示します。

  1. SeedProdをインストール:SeedProdプラグインを追加し、ライセンスキーを有効化して、ウェブサイトキットライブラリのロックを解除します。
  2. キットを選択:テーマビルダーを開き、「テーマ」をクリックして、オレンジ色のチェックマークアイコンが付いたキットを選択します。
  3. 有効化:「SeedProdテーマを有効化」トグルをオンにして、キットを公開します。
  4. EnvatoまたはElementorキットのインポート:無料のTemplate Kit Importプラグインをインストールし、[ツール]の下にZIPファイルをアップロードします。
  5. カスタマイズ:ロゴを入れ替え、デモコンテンツを置き換え、ビジュアルエディターで色とフォントを設定します。

気に入ったテンプレートキットを見つけ、コードに触れることなくWordPressで公開したいと考えているか、またはEnvatoやElementorから既にキットをダウンロードしたが、ZIPファイルがどこに配置されるかわからない状態になっているかのどちらかでしょう。

どちらの場合でも、数回のクリックで実現可能です。最近、SeedProdのCaféキットを使って友人のパン屋のウェブサイトを構築し、コードなしで1時間以内に公開しました。このガイドでは、両方の方法でWordPressにテンプレートキットをインストールする方法を説明します。

WordPressテンプレートキットとは?

WordPressテンプレートキットは、コードなしでウェブサイトを構築できる、事前にデザインされたページテンプレートと要素のコレクションです。モダンなデザインで、ドラッグアンドドロップでビジネスブランディングに合わせて視覚的にカスタマイズできます。

テンプレートキットには、完全にレスポンシブなWordPressサイトを構築するために必要なすべてが含まれています。たとえば、以下のようなものが含まれます。

キットの機能によっては、サービス、ポートフォリオ、チーム、お客様の声などの他のページも含まれる場合があります。

これらのキットは、さまざまな名前で呼ばれることもあります。一部の企業はウェブサイトキットやウェブサイトテンプレートと呼ぶかもしれませんが、WordPressスターターテンプレートと呼ぶ企業もあります。これらは通常、同じことを行います:コードなしでWordPressウェブサイトを迅速に構築します。

WordPressでテンプレートキットをインストールする方法(ステップバイステップ)

ほとんどの初心者にとって最も簡単な方法は、SeedProdウェブサイトキットです。これはダッシュボードから直接数回のクリックでインストールできます。SeedProdは、100万人以上のユーザーを持つドラッグ&ドロップウェブサイトビルダーであり、ワンクリックでインストールできるプロフェッショナルなウェブサイトキットのライブラリを増やし続けています。

これが、私がそのパン屋のサイトで使用した方法で、コードを一行も書かずに1時間以内に公開しました。代わりにEnvatoまたはElementorから既にキットをダウンロードした場合は、下のZIPインポートセクションに進んでください。

SeedProd ドラッグ&ドロップ WordPress ウェブサイトビルダー

SeedProdのキットはウェブサイトキットと呼ばれるため、ここからはその用語を使用します。インストールするには、以下の手順に従ってください。

ステップ1:SeedProdプラグインをインストールして有効化する

最初のステップは、SeedProd WordPressプラグインのコピーをダウンロードすることです。SeedProdのウェブサイトキットを使用するには、少なくともSeedProd Plusプランが必要です。このプランでテーマビルダーとフルウェブサイトキットがアンロックされます。

ここからSeedProdを入手してください。

SeedProdアカウントダッシュボードにログインし、「ダウンロード」タブをクリックします。このページで、プラグインのzipファイルをダウンロードし、ライセンスキーをコピーできます。

アカウントダッシュボードでSeedProdライセンスキーを見つけてください。

SeedProd をダウンロードしたら、WordPress 管理画面から プラグイン » 新規追加 に移動し、新規追加 をクリックします。そこから、ファイルを選択ボタンをクリックし、SeedProd プラグインファイルを選択して、今すぐインストール をクリックします。

アップロード画面からWordPressプラグインをインストールします。

次の画面で、有効化 リンクをクリックして、WordPress サイトで SeedProd プラグインを有効にします。

WordPressでSeedProdプラグインを有効化します。

SeedProd が有効になったら、SeedProd » 設定 ページに移動し、以前にコピーしたライセンスキーを入力します。ライセンスキーフィールドに貼り付けたら、キーを有効化 ボタンをクリックします。

設定ページでSeedProdライセンスキーを入力します。

ライセンスキーがアクティブになったので、ウェブサイトキットをインストールする時間です。

ステップ2:ライブラリからテンプレートキットを選択する

SeedProd のサイトキットは、テーマビルダー機能と連携します。ウェブサイト用にキットを選択するには、SeedProd » テーマビルダー に移動し、テーマ ボタンをクリックします。

WordPressのSeedProdテーマビルダーのテーマボタン。

次の画面には、SeedProd のウェブサイトキットライブラリが表示されます。これには、以下を含む複数のビジネス業界向けのクリーンなデザインが含まれています。

業界のデザインを備えたSeedProdウェブサイトキットライブラリ。
  • 自動車およびメンテナンス
  • モバイルアプリケーション
  • eコマースストア
  • 専門サービス
  • レストランおよびカフェ
  • ブログおよびファッション
  • 住宅ローンおよび不動産
  • イベントおよびゲーム

これらのカスタマイズ方法については後ほど説明しますが、まずは、気に入ったキットの上にカーソルを合わせ、オレンジ色のチェックマークアイコンをクリックします。

チェックマークアイコンを使用してSeedProdウェブサイトキットをインストールします。

SeedProd は、キット全体をテーマビルダーダッシュボードに、カスタマイズ可能なテンプレートパーツのリストとして追加します。選択したキットに応じて、以下が含まれます。

  • ヘッダーおよびフッターテンプレート
  • ホームページおよびブログテンプレート
  • シングルページおよび投稿テンプレート
  • グローバルCSSテンプレート
テーマビルダーのSeedProdウェブサイトキットテンプレートパーツ。

このプロセスの中で、私が本当に速いと感じるのはこの部分です。あのベーカリーサイトでは、組み込みのメニューと連絡フォームを備えたキットを選んだのですが、コーヒーを飲み終える前にレイアウト全体が完成していました。

追加ページが含まれるウェブサイトキットを選択した場合は、WordPress 管理画面から ページ » 全ページ に移動して見つけることができます。これらの編集については、後ほど詳しく説明します。

注意:eコマースサイトキットをインストールする場合は、SeedProd Eliteライセンスが必要であり、WooCommerceプラグインが有効になっている必要があります。

SeedProdキットを別のサイトで再利用する方法

SeedProd では カスタム WordPress テーマを作成できるため、独自のウェブサイトキットを構築し、将来のプロジェクトで再利用できます。これにより、毎回ゼロから始める必要がなくなります。

テーマビルダーでカスタムキットを構築し、.zip ファイルをカスタム WordPress テーマとしてエクスポートします。ここに SeedProd WordPress テーマのエクスポート ガイドがあります。

その後、アクティブな SeedProd がインストールされている他のサイトにキットをインポートできます。SeedProd » インポート/エクスポート に移動し、テーマファイルインポートの見出しの下にある ファイルを選択 をクリックし、テーマファイルをインポート ボタンをクリックします。

「テーマファイルのインポート」でSeedProdウェブサイトキットZIPファイルをインポートします。

数秒後、インポートが成功したことを示す緑色の通知が表示されます。

ステップ3:WordPressサイトでテンプレートキットを有効にする

SeedProd のテンプレートはデフォルトで無効になっているため、準備ができる前に現在のテーマを上書きしません。この手順を完了する前に、デモコンテンツをご自身のコンテンツに置き換えてください(方法は以下で説明します)。

ウェブサイトキットをライブにし、現在の WordPress テーマ を上書きするには、SeedProd » テーマビルダー ページに移動し、SeedProd テーマを有効化 トグルを見つけて、「オン」の位置に切り替えます。

テーマビルダーでオンに設定されたSeedProdテーマトグルを有効にします。

これで、WordPress で新しいウェブサイトキットをプレビューできます。

WordPressでのSeedProdウェブサイトキットのライブデモ。

SeedProd を使用して WordPress にウェブサイトキットをインストールするのは、数回のクリックで完了します。次に、Envato や Elementor からダウンロードしたキットをインポートする別の方法について説明します。

EnvatoまたはElementorテンプレートキットZIPをインストールする方法

Envato Elementsから既にダウンロードしたキット、またはElementor用に構築されたキットをお持ちの場合は、Template Kit Importという無料のプラグインでインポートできます。ZIPファイルを読み込み、テンプレートをセットアップし、キットの実行に必要なプラグインを通知します。

知っておくべきことの1つは、Envatoが独自のElementsテンプレートキットプラグインを廃止したため、多くの古いガイドで説明されている古い方法はもう機能しないということです。現在の方法は、wordpress.orgにある無料のTemplate Kit Importプラグインです。

インストールするには、プラグイン » 新規追加に移動し、「Template Kit Import」を検索してインストールし、有効化します。有効になったら、ツール » Template Kitに移動してZIPファイルをアップロードします。

インポーターはキットをスキャンし、必要なプラグイン(多くの場合Elementorとキット固有のアドオン)をリストします。これらを最初にインストールしてから、再度インポートを実行してテンプレートを取り込みます。

キットが空白またはエラーでインポートされた場合の対処法

空白または失敗したインポートは、ほぼ常に必要なプラグインが不足していることが原因です。インポートツールは画面の上部にこれらをフラグ付けするので、リストされているすべてをインストールして再インポートしてください。

特にElementorキットの場合、フレックスコンテナ設定がキットが構築されたものと一致していることを確認してください。インポート後にレイアウトが壊れているように見える場合、その不一致が原因であることがほとんどであり、再インポートする前に設定を切り替えることで修正できます。

WordPressでテンプレートキットをカスタマイズする方法

キットをインストールした後、いくつかの変更を加えたくなるでしょう。SeedProdのビジュアルドラッグアンドドロップエディタを使用すると、最初に触れる3つの要素は、ロゴ、ページコンテンツ、グローバルカラーとフォントです。

ウェブサイトのロゴを追加します。 SeedProd » Theme Builderに移動し、Headerテンプレートパーツを見つけて、Edit Designリンクをクリックします。

SeedProdヘッダーテンプレートパーツの「デザインを編集」リンクを編集します。

ヘッダーがビジュアルエディタで開かれ、クリック、ドラッグ、ドロップでカスタマイズできます。

SeedProdエディターでウェブサイトキットのヘッダーをカスタマイズします。

ライブプレビューのデフォルトのロゴをクリックして左側のパネルで設定を開き、ゴミ箱アイコンをクリックしてロゴ画像を削除します。これで、メディアライブラリからカスタムロゴをアップロードし、画像へのリンクを追加し、サイズと配置を調整できます。

ヘッダー設定でWordPressウェブサイトのロゴを変更します。

ナビゲーションメニュー、検索ボックス、ソーシャルメディアリンクもここでカスタマイズできます。満足したら、右上隅のSaveボタンをクリックし、サイトのフロントエンドで新しいヘッダーを確認してください。

SeedProdで構築されたカスタムWordPressヘッダーの例。

デモコンテンツを置き換えます。キットにはデモコンテンツが含まれているため、完成したサイトを視覚化できますが、独自のビジネス情報に置き換える必要があります。Freelancerテンプレートキットを使用して、ポートフォリオプロジェクト用のランディングページをすばやく作成しました。

最初から始めるのではなく、テキストと画像を入れ替えて公開するだけです。サイドギグやクライアントワークに最適で、ヘッダーのカスタマイズと同じ原則を使用しています。

WordPressのホームページをカスタマイズするにはHomepageテンプレートのEdit Designリンクをクリックします。見出しをクリックすると、プレビューまたはコンテンツ設定パネルで直接テキストを編集できます。

SeedProdプレビューでウェブサイトキットの見出しを直接編集します。

ロゴと同じ方法で画像をスワップし、コールトゥアクションボタンを編集してクリック数とコンバージョンを増やしましょう。

SeedProdでウェブサイトテンプレートのコールトゥアクションボタンをカスタマイズします。

プロのヒント: SeedProdのボタンブロックには、簡単にスタイリングできる既製のテンプレートがあります。設定パネルのテンプレートタブをクリックし、ボタンのスタイルを1回クリックするだけで選択できます。

SeedProdの事前作成済みボタンテンプレートの設定パネル。

「会社概要」、「お問い合わせ」、および「サービス」などのコンテンツページの場合は、これらはテンプレートパーツではないため、WordPress管理画面からページ » 全ページに移動してください。

「ページ」リストからSeedProdでコンテンツページを編集します。

SeedProdで編集リンクをクリックして、ページをビジュアルエディターで開きます。カスタマイズは同じように行います。プレビューのどこかをクリックして編集し、ブロックメニューからブロックをドラッグしてさらに要素を追加します。

SeedProdビジュアルエディターで連絡先ページを編集します。

たとえば、ゴミ箱アイコンを使用してオプトインフォームブロックを削除し、次にお問い合わせフォームブロックをドラッグしてWPFormsのお問い合わせフォームを追加できます。

キットページにSeedProd連絡フォームブロックを追加します。

グローバルカラーとフォントを設定します。サイト全体でブランドに合わせるには、テーマビルダーダッシュボードのグローバルCSSテンプレートにあるデザインを編集リンクをクリックします。見出しを展開し、ニーズに合わせて設定を変更します。

サイト全体のスタイリングのためのSeedProdグローバルCSS設定。

リンク、ボタン、テキスト、背景のカスタムカラーを選択し、タイポグラフィ、レイアウト、カスタムCSSを設定できます。変更はサイト全体に自動的に適用されます。

WordPressテンプレートキットのインストールに関するFAQ

EnvatoまたはElementorテンプレートキットZIPをWordPressにインストールするにはどうすればよいですか?

wordpress.orgから無料のTemplate Kit Importプラグインをインストールし、次にツール » Template Kitに移動してZIPファイルをアップロードします。インポーターはキットを読み込み、必要なプラグインをリストします。

まずこれらの必要なプラグインをインストールしてから、インポートを再度実行してテンプレートを読み込みます。

Envatoテンプレートキットプラグインがなくなりました。キットは現在どのようにインポートしますか?

Envatoは独自のElementsテンプレートキットプラグインを廃止したため、古い指示は適用されません。現在の方法は、wordpress.orgの無料のTemplate Kit Importプラグインです。

それをインストールして有効化し、次にツール » Template Kitの下にキットZIPをアップロードします。

テンプレートキットが空白でインポートされる、または要件が不足しているのはなぜですか?

空白または失敗したインポートは、通常、必要なプラグインがまだインストールされていないことを意味します。インポートツールは画面の上部でこれらをフラグ付けするため、リストされているすべてをインストールして再インポートしてください。

Elementorキットの場合、レイアウトの破損は、多くの場合、フレックスコンテナ設定がキットの期待と一致しないことが原因です。

テンプレートキットは、ページビルダーなしでブロックエディターで機能しますか?

ほとんどのテンプレートキットは、SeedProdやElementorなどの特定のビルダー用に構築されているため、標準のブロックエディターではなく、そのプラグインを通じてインストールします。WordPressコアにはブロックベースの「パターン」がありますが、完全なキットとは異なります。

数回のクリックでインストールできるコード不要のキットの場合、SeedProdのようなビルダーが最も簡単な方法です。

テンプレートキットをインストールすると、現在のコンテンツは消去されますか?

すぐにはできません。SeedProdのようなツールを使用すると、アクティブ化する前にキットをプレビューおよびカスタマイズできます。ライブにする前に、サイトをバックアップし、デモコンテンツを置き換えてください。

同じテンプレートキットを複数のウェブサイトで使用できますか?

はい、ライセンスが許可している限り可能です。たとえば、SeedProd Proを使用すると、カスタムテンプレートキットをエクスポートして、他のWordPressサイトで再利用できます。

次のステップ

キットから始め、公開への明確な道筋がない状態から、今やコーディング不要でそれが可能になりました。SeedProdを使えば、コーディングを学んだり開発者を雇ったりすることなく、WordPressサイトのあらゆる部分を簡単にカスタマイズできます。

今すぐSeedProdを使い始める

ビジネスウェブサイトに役立つ可能性のあるその他のガイドを以下に示します。

お読みいただきありがとうございます!皆様のご意見をお聞かせいただければ幸いです。お気軽に会話にご参加ください YouTubeX および Facebook で、ビジネスを成長させるための役立つアドバイスやコンテンツをさらにご覧ください。

著者アバター
ステイシー・コリン コンテンツマーケティングスペシャリスト
Stacey Corrinは、WordPress、SEO、デジタルマーケティングに関する執筆経験15年以上の認定コンテンツマーケティングおよび検索スペシャリストです。彼女はSeedProdとRafflePressのコンテンツを管理しており、自身が積極的に使用しテストしているツールや戦略を取り上げています。

開示: 当社のコンテンツは読者によってサポートされています。これは、当社のリンクの一部をクリックすると、手数料が発生する可能性があることを意味します。当社は、読者に価値をもたらすと信じる製品のみを推奨しています。

[weglot_switcher]
ChatGPTまたはClaudeとチャットして、このWordPressサイトを運営しましょう。無料プラグインです。 無料で試す