最新のSeedProdニュース

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

WooCommerceの「近日公開」ページを作成する方法(2つの方法)

WooCommerceの近日公開ページの作成方法(2つの方法) 

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

要約:WooCommerceの近日公開ページの作成

WooCommerceはストアを独自に閉じることができますが、プレーンな待機ページが表示されます。ストアを非表示にするためにそれを使用し、ページが何かを生み出すようにしたい場合はビルダーを使用してください。

  • 組み込み設定を使用する – WooCommerce、設定、サイトの可視性に移動し、「ライブ」から「近日公開」に切り替えます。
  • ストアのみを非表示にする – 2番目のオプションは、ストア、カート、チェックアウト、アカウントページのみを対象とし、ブログは公開されたままになります。
  • 実際のローンチページを作成する – SeedProdは、カウントダウンタイマー、メールサインアップフォーム、および制御可能なデザインを追加します。
  • オンにする – SeedProd、ページの下で、「近日公開モード」を「アクティブ」に切り替えます。
  • サインアウトして確認する – どちらのシステムもストア管理者に近日公開ページを表示しないため、通常のストアが表示され続けます。
  • 単一商品 – WooCommerceには商品ごとの近日公開設定がないため、商品をスケジュールするか、カタログから非表示にしてください。

ストアはまだ顧客の準備ができていませんが、URLは機能しており、見つけた人は誰でも半完成のショップを見ることができます。

WooCommerceの近日公開ページはそれを修正し、それを行うには2つの方法があります。WooCommerceがすでに提供している設定、または自分でデザインしたページです。両方の方法を、すでに持っているものから始めて、順を追って説明します。

このガイドでは:

WooCommerceの準備完了ページを作成する理由

近日公開ページは、未完成のオンラインストアを非表示にしておきます。エラーページや未完成の店舗を見せる代わりに、何を見せるかを自分でコントロールできます。

ただし、適切に行えば、近日公開ページはストアが閉鎖されている間にも何かを得ることができます。

  • 訪問者にストアの公開時期に関する詳細を伝える
  • カウントダウンタイマーで公開日への期待を高める
  • メールアドレスを収集する、サインアップフォームでリストを増やす
  • 公開前に顧客を引き付けるための割引やオファーを提供する
  • クロール可能なウェブページで検索エンジンのランキングを有利に進める

それを設置する方法は2つあり、最初の方法はすでにWooCommerceの設定にあります。

方法1:WooCommerceの組み込み「近日公開」モード

WooCommerce 9.1以降、ストアを非表示にするのはプラグインではなく設定になりました。WooCommerce » 設定 » サイトの可視性に移動し、「ライブ」から「近日公開」に切り替えます。

WooCommerce の設定で Coming Soon をオンにする。

これで完了です。WooCommerceはストアページを独自の待機テンプレートに置き換え、ゲストがアクセスできないようにします。これがデフォルトです。

また、どの程度非表示にするかも自分で決めることができます。そのままにしておくと、サイト全体が非表示になりますが、ストアページのみに適用をオンにすると、ショップ、カート、チェックアウト、アカウントページのみが非表示になり、ブログや「会社概要」ページは表示されたままになります。

すでにトラフィックがあるストアでは、Googleがすでにインデックスしたページがストア構築中に機能するため、私は常にこれをオンにします。

プライベートウィンドウで確認してください:WooCommerceはストアを管理できるユーザーに対して待機ページをスキップするため、お客様は近日公開画面を見ている間、あなたは通常のショップを見ることができます。

クライアントや開発者に実際のストアを見せる必要がある場合は、プライベートリンクでサイトを共有するをオンにします。そのリンクを開いた人は誰でもライブストアを閲覧でき、WooCommerceはそのユーザーを90日間記憶します。

ただし、組み込み設定には1つの実際の制限があります。それは、以下のような待機ページを提供するだけで、ローンチページではありません。

WooCommerce のデフォルトの Coming Soon ページ(見出しとログインボタン付き)。

見出しと1行のテキストが表示されます。カウントダウンタイマー、メールサインアップフォーム、デザインに対する実質的な制御はありません。

ショップを閉じることだけが目的なら、これで十分です。しかし、私が管理したほとんどのストアでは、ローンチ前のページにするために、ローンチ前にメールアドレスを収集したい場合、これは問題になります。

方法2:SeedProdでWooCommerceの近日公開ページを作成する方法

実際にローンチを販売するページが必要な場合は、自分で作成する必要があります。私が管理したストアで、SeedProdを使用して行うのはこの方法です。

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

SeedProdはドラッグ&ドロップのWordPressウェブサイトビルダーです。そのライブビジュアルエディターを使用すると、ストアの近日公開ページを作成し、変更を加えながらリアルタイムで確認できるため、コードに触れる必要はありません。

SeedProdを使用して、ドラッグ&ドロップでカスタムWooCommerceテーマを作成することもできます。

組み込み設定にはない、以下の機能が利用できます。

  • すでにオープンしているストアを変更する場合の、近日公開とは別のメンテナンスモード
  • すぐに使える近日公開テンプレートのライブラリ。空白の画面からデザインする必要はありません
  • ヘッダー、CTA、お客様の声、カウントダウンタイマー用のブロックがあり、通知ではなくページを作成できます。
  • カート追加、カート、チェックアウト用のWooCommerceブロックにより、ページ自体から事前注文を受け付けることができます。動作するチェックアウトはストアが完全に非表示ではないことを意味するため、これらの機能は発売前の販売が計画されている場合にのみ使用してください。
  • サブスクライバーダッシュボードでサインアップを追跡・管理する
  • Constant ContactやActiveCampaignなどの人気マーケティングプラットフォームと統合する
  • ボットや不正なフォーム送信に対するスパム保護

これらを行うために開発者や一行のコードは必要ありません。

ビデオチュートリアル

ステップ1: SeedProdのインストールと有効化

以下のボタンをクリックして、SeedProdのコピーを取得し、アカウントを作成してください。

無料版の制限:Coming Soonモードを処理するSeedProdの無料版があります。ここではProを使用しています。カウントダウンタイマーとメール統合が、ローンチページを構築する価値のあるものにしているからです。

次に、WordPress ウェブサイトにプラグインをインストールして有効化します。このステップでヘルプが必要な場合は、WordPress プラグインのインストールに関するこの簡単なガイドに従ってください。

SeedProd をインストールして有効化した後、WordPress ダッシュボードから SeedProd » 設定 に移動します。これにより、ライセンスキーを入力して、プラグインのアップデートや高度な機能にアクセスできるようになります。

SeedProdライセンスキーの確認

SeedProd ライセンスキーは、SeedProd ウェブサイトのアカウントのダウンロードタブの下にあります。

SeedProdライセンスキーを見つける

ライセンスキーを入力したら、キーの確認 ボタンをクリックします。これで、WooCommerce のメンテナンス中ページを作成する準備が整いました。

ステップ2:準備完了ページのセットアップ

WooCommerce のメンテナンス中ページの作成を開始するには、WordPress 管理パネルから SeedProd » ページ に移動します。

SeedProdランディングページモード

この画面には、WordPressサイトでさまざまな種類のページを作成するためのオプションがいくつか表示されます。これには以下が含まれます:

  • メンテナンス中モード建設中のウェブサイトのメンテナンス中ページを作成します。
  • メンテナンスモード – マイナーな変更やアップデートの実行中にメンテナンスメッセージを表示します。
  • ログインページ – デフォルトのログイン画面をカスタム WordPress ログインページに置き換えます。
  • 404 ページ – カスタム404 エラーページを設定して、ユーザーをサイトに長く留めます。

そのセクションの下には、好きなスタンドアロンランディングページを構築することもできます。

ただし、このチュートリアルでは、「メンテナンス中ページのセットアップ」ボタンを選択します。

WooCommerceの準備完了ページを設定する

次に、SeedProd のレスポンシブテンプレートライブラリが表示されます。メンテナンス中フィルターの下には、すぐに使用できるさまざまなメンテナンス中ページテンプレートが表示されます。

SeedProd 近日公開ページテンプレート

テンプレートの上にカーソルを置くとプレビューオプションが表示され、チェックマークアイコンをクリックするとそのデザインが選択されます。

WooCommerceの準備完了テンプレートを選択する

メンテナンス中ページテンプレートを選択すると、SeedProd が開き、ドラッグ&ドロップページビルダーに表示されます。このページで WooCommerce のメンテナンス中ページをカスタマイズできます。

ステップ3:WooCommerceのComing Soonページをカスタマイズする

ページ上のすべての要素は、SeedProdのビジュアルエディターで編集可能です。デザインの任意の場所をクリックして、テキスト、画像、またはボタンを変更すると、リアルタイムで更新されます。

ここで、機能するセクションを追加します。メールサインアップフォーム、商品グリッド、ソーシャルリンクなどです。

画面の右側には、デザインのライブプレビューが表示され、リアルタイムで編集および変更を確認できます。

SeedProd WooCommerce準備完了ページビルダー

そして左側には、デザインの構築とカスタマイズのためのさまざまなセクションとブロックがあります。

要素を編集するには、それをクリックすると、そのブロックの設定が左側に開きます。たとえば、見出しをクリックすると、そのコンテンツ設定パネルが開きます。

WooCommerceの準備完了ページのヘッダーをカスタマイズする

そこからコンテンツを編集したり、フォントの色とサイズを変更したり、見出しタグを変更して検索エンジンがページの構造を正しく読み取れるようにしたりできます。

ページ上の他のすべての要素についても同様に行うことができます。たとえば、カウントダウンタイマー、段落テキスト、ソーシャルメディアアイコンなどです。

たとえば、ソーシャルメディアアイコンブロックをクリックすると、ソーシャルメディアプロフィールのリンクを追加できます。また、テンプレートタブをクリックして、アイコンの色とスタイルをすばやく変更することもできます。

WooCommerceの準備完了ページのソーシャルメディアアイコンをカスタマイズする

標準、高度、またはWooCommerceのブロックセクションからブロックを選択して、ページにコンテンツを追加できます。

  • 標準ブロックには、箇条書きリスト、画像、ボタン、ビデオなどが含まれます。
  • 高度なブロックには、オプトインフォーム、プレゼント企画、カウントダウンタイマー、およびその他の多くのリードジェネレーションツールが含まれます。
  • WooCommerceブロックを使用すると、ショッピングカート、チェックアウト、商品グリッド、およびカートに追加ボタンを準備完了ページに追加できます。

リストを成長させるためにオプトインフォームを追加し、緊急性を生み出すために準備完了カウントダウンタイマーを追加することをお勧めします。

WooCommerceの準備完了ページにメールニュースレター登録フォームを追加する

ページ全体の色のフォントとスタイルを一度に設定することもできるため、すべてのブロックを手動でスタイル設定する手間が省けます。

画面左下隅にある歯車アイコンをクリックすると、グローバル設定パネルを見つけることができます。そこから、いずれかの見出しをクリックして、グローバルカラースキーム、フォント、背景画像などを追加します。

SeedProd グローバル設定パネル

たとえば、デフォルトの背景画像を削除し、より目を引くものに置き換えました。

WooCommerceの準備完了ページの背景画像を変更する

また、の見出しをクリックして、見出し、テキスト、ボタン、リンクの色を変更しました。

WooCommerceの準備完了ページの色を変更する

オンラインストアの準備完了ページに満足したら、上部にある保存ボタンを押して進行状況を保存します。

WooCommerceの準備完了ページを保存する

ステップ4:メールマーケティングサービスを接続する

WooCommerceの準備完了ページにメールサインアップフォームを追加した場合は、メールマーケティングサービスに接続することをお勧めします。これにより、リードを収集し、購読者を管理し、潜在顧客にメールを送信できます。

SeedProd のメール統合は、画面上部の 接続 タブの下にあります。

SeedProd メールマーケティング連携

そこから、希望するメールサービスプロバイダーをクリックし、指示に従ってアカウントを承認して接続してください。

ステップ 5: ページ設定の構成

公開する前に、いくつか設定しておくと良いことがあります。ページ設定タブに切り替えて、左側のナビゲーションパネルを確認してください。

WooCommerceの準備完了ページの設定

まず、一般 タブでページのタイトル、URL、ステータスを変更できます。

次に、SeedProd Pro ユーザーの場合、アクセス制御 タブが表示されます。この画面では、WooCommerce の近日公開ページを誰が見ることができるか、またサイトが構築中の間に誰がアクセスできるかを選択できます。

SeedProd アクセス制御

その結果、サイトで作業している開発者やフリーランサーにアクセスを許可できます。また、ご自身が開発者であれば、クライアントに進捗状況を示すために一時的なアクセスを提供できます。

次のパネルは SEO 設定で、SEO タイトルと説明を追加できます。この情報は検索エンジンに表示され、検索結果に表示されます。

WooCommerceの準備完了ページのSEO設定を構成する

さらに、ファビコンやソーシャルメディアのサムネイルを追加することもできます。検索エンジンがページをインデックスに登録するのをブロックしたい場合は、「インデックス作成しない」オプションをオンにできます。

最後に、Google Analytics トラッキングコードや Facebook ピクセルなどのサードパーティスクリプトをスクリプトタブの下に追加できます。

ランディングページスクリプト設定

ステップ 6: WooCommerce のメンテナンス中ページを公開する

オンラインストアで近日公開ページを公開する前に、SeedProd のモバイルプレビュー画面でプレビューすることをお勧めします。そうすれば、モバイルデバイスで見た目が良いことを確認できます。

これを行うには、下部ツールバーのモバイルプレビューアイコンをクリックすると、ページのライブモバイルプレビューが表示されます。

WooCommerceの準備完了ページをモバイルでプレビューする

そこからデザインを編集したり、デスクトップまたはモバイルに表示されないように特定の要素を非表示にしたりできます。

たとえば、モバイルでソーシャルアイコンを非表示にするには、要素をクリックし、高度な設定 タブを選択し、デバイスの可視性の見出しの下にある モバイルで非表示 オプションをオンにするだけです。

デバイスの表示設定で準備完了ページのエレメントを非表示にする

ソーシャルアイコンはライブプレビューではグレー表示されますが、ライブページではまったく表示されません。

WooCommerce の近日公開ページを公開する準備ができたら、保存ボタンの横にあるドロップダウン矢印をクリックし、公開 をクリックします。

WooCommerceの準備完了ページを公開する

ステップ7:Coming Soonモードをオンにする

これで、WordPress ダッシュボードパネルの左側にある SeedProd » ページ をクリックして、SeedProd ダッシュボードに戻るだけです。

次に、近日公開モードの見出しの下で、トグルボタンを「アクティブ」に切り替えます。

WooCommerceの準備完了ページを有効にする

訪問者はストアではなくComing Soonページにアクセスし、開店日を確認してメールにサインアップできるようになります。

WooCommerceの準備完了ページの例

WooCommerceのComing Soonページを後で編集する方法

発売日は変更されます。日付を変更するには、ダッシュボードのSeedProd » Pagesに移動します。そこでは、ボタンが「セットアップ」ではなく「ページを編集」と表示されます。

SeedProd の WooCommerce Coming Soon ページの編集ボタン

最初に始めたのと同じビルダーが開くので、テキストを変更したり、画像を入れ替えたり、色を調整したり、新しいセクションを追加したりできます。最初の時とまったく同じように。

完了したら、保存 ボタンをクリックすると、変更がライブページにすぐに反映されます。

両方をオンにするとどうなりますか?

何も壊れませんが、何も積み重なりません。SeedProdとWooCommerceは、互いの存在を知らない別々のComing Soonシステムを実行します。これは、両方のプラグインのコードを読むことで確認しました。推測したわけではありません。

SeedProdの勝ちです。WooCommerceよりもページの読み込みが早い段階でページを構築するため、訪問者はSeedProdのデザインを取得し、WooCommerceのプレーンテンプレートは表示されません。

どちらも選択したページを公開状態に保ち、残りを非表示にすることができます。WooCommerceはストアページを対象とした1つの制限でこれを実行し、SeedProdは自分で入力したURLのリストでこれを実行します。これはより手間がかかりますが、どのページを公開状態に保つかを正確に選択できます。

そのため、どちらか一方のみを実行してください。同じ作業を行う2つのスイッチは、どちらがストアを非表示にしているのか判断できなくなる原因となるため、SeedProd を使用している場合は、WooCommerce の設定を「Live」のままにし、すべてを SeedProd » Pages から管理してください。

単一の WooCommerce 商品を近日発売として表示する方法

WooCommerce には、個々の商品に対する近日発売の設定はありません。この機能はストア全体にのみ適用されるため、商品ごとのトグルはなく、商品画面に近日発売のバッジが表示されることもありません。

オンラインには反対のことを示唆するアドバイスがたくさんあるため、確実にするためにプラグインのコードを調べました。Coming Soon モードのために WooCommerce が提供するすべてのものは、サイトまたはストアレベルで機能し、個々の商品には影響しません。

代わりに何をするかは、商品を表示したいかどうかによって異なります。

発売日にスケジュールする

商品の公開日を未来の日付に設定すると、WordPress はその日まで商品を非表示にし、その日に自動的に公開します。発売日がすでにわかっている場合に最もクリーンなオプションです。

WooCommerce の商品を特定の日時に公開するようにスケジュールする

カタログから非表示にする

「公開」ボックスの「カタログの可視性」には、4 つの選択肢があります: ショップと検索結果、ショップのみ、検索結果のみ、非表示。

WooCommerce の商品を商品カタログから非表示にする

「非表示」にすると、商品がショップとサイトの検索の両方から除外されますが、直接リンクは引き続き機能します。これにより、すべての人に公開することなく、少数の人にプレビューを送信するのに役立ちます。

表示するが、販売はブロックする

在庫状況には 3 つの設定があります: 在庫あり、在庫切れ、予約注文。

在庫切れ」は、購入ボタンなしで商品ページを表示したままにするため、人々は何が来るかを確認し、説明を読むことができます。「予約注文」は、ページを表示したまま注文を受け付けるため、実際の予約注文に近いものです。

発売日が記載された実際の近日発売バッジが必要な場合は、予約注文またはウェイトリストプラグインが必要です。WooCommerce はそれを自動的に表示しません。

または、商品に独自のランディングページを作成する

本当にやりたいことが、リリースされていない 1 つの商品用のページである場合、それは商品設定ではなくランディングページの仕事であり、私が取るアプローチです。

商品自体を非表示にし、SeedProd でページを作成して、商品の写真、発売日までのカウントダウン、メールフォームを追加します。そのページにティーザートラフィックを誘導すれば、商品が公開された瞬間にメールを送信できるウェイトリストが用意されます。

私の WooCommerce サイトに「近日発売」と表示されるのはなぜですか?

2 つの近日発売設定のいずれかがオンになっているためであり、それをオンにしたのがあなたではない可能性があります。

紛らわしいのは、サインインしている間はそれが見えないことです。どちらのシステムもストア管理者はそのまま通過させるため、あなたにとってはショップは完全に正常に見え、他の人には閉鎖されているように見えます。

まずプライベートウィンドウでサイトを開いてください。これにより、実際に問題があるのか、それともあなた自身の管理者ビューを見ているのかがわかります。

次に、オンになっている方をオフにします:

  • WooCommerce: WooCommerce > 設定 > サイトの可視性に移動し、「Live」に戻します。
  • SeedProd: SeedProd > Pages に移動し、「Coming Soon Mode」を「Inactive」に切り替えます。

まだ表示されている場合は、両方を確認してください。これらは独立しているため、一方をオフにしても他方には影響しません。

バッジがオンになっている限り、WooCommerce が通知してくれます。管理バーにサイトの可視性バッジを表示する設定は、管理ツールバーのサイト名の横にサイトの可視性ステータスを表示するため、一目で確認できます。

よくある質問

「近日公開」モードの間、顧客はまだ購入できますか?

通常のストアページからはできません。それらのページは非表示になっているからです。Coming Soon ページに SeedProd のカート追加またはチェックアウトブロックを追加することで、意図的に収益を得ることはまだ可能です。これは予約注文の仕組みです。ただし、ライブチェックアウトはストアが実際には閉まっていないことを意味することを忘れないでください。

woocommerce_coming_soon オプションとは何ですか?

これはサイトの可視性画面の背後にあるデータベース設定であり、2番目の設定でサイト全体を対象とするか、ストアページのみを対象とするかが決まります。どちらにも直接触れる必要はありません。WooCommerce の設定でサイトの可視性を変更すると、それらが自動的に書き込まれます。

サイトの大部分を非表示にしている間、一部のページを公開したままにできますか?

はい、どちらの方法でも可能です。WooCommerceには、ショップ、カート、チェックアウト、アカウントページのみを非表示にする単一のオプションがあります。代わりにSeedProdでは、到達可能なままにしておきたいURLのリストを作成できます。これは設定に時間がかかりますが、訪問者がまだ読み取れるものを正確に制御できます。

WooCommerceの「近日公開」ページをどのくらいの期間表示しておくべきですか?

実際に起動する直前までです。Coming Soon ページは数週間リストを構築するのに役立ちますが、数か月間そのままにしておくと、Google が対応できるページは保留ページだけになります。ビルドに時間がかかる場合は、ショップのみを非表示にし、コンテンツの公開を続けてください。

WooCommerce は 2 回クリックするだけでストアを閉じてくれます。メールアドレスを収集して開店日にカウントダウンするページを作成してくれるわけではありません。

テンプレートとカウントダウンブロックはすでに用意されているため、最初からデザインする必要もありません。今すぐ SeedProd を使い始めましょう。今日の午後にローンチページを公開できます。

以下のWooCommerceガイドも役立つ場合があります。

お読みいただきありがとうございます。この記事が気に入ったら、ビジネスを成長させるための役立つコンテンツをさらにご覧になるために、YouTubeTwitterFacebookでフォローしてください。

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

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

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