WooCommerceのサンキューページをカスタマイズする方法（3つの方法） 

オンラインストアで最も見過ごされがちな瞬間の1つは、販売直後に起こることです。その最後のページは単なる確認ではありません。これは、新しい顧客があなたに置いた信頼を基盤を築く最初のチャンスです。

このガイドでは、カスタムWooCommerceサンキューページを作成する3つの方法、つまりコード不要ビルダー、プラグインリダイレクト、コードとフックの方法を説明します。最も簡単なものから始めましょう。

WooCommerceサンキューページをカスタマイズする理由

デフォルトのWooCommerceサンキューページは、何かを販売するために作られていません。購入者がチェックアウトページを完了すると、次のようなシンプルな確認画面が表示されます。

あなたのサンキューページの外観は、あなたのWordPressテーマによって異なります。いずれにしても、そのデフォルト画面はコンバージョンや顧客エンゲージメントに最適化されていません。

カスタムデザインに置き換えることで、そのページを次のようなコンバージョン率の高い画面に変えることができます。

• 購入後のアップセルまたはクロスセルを追加する
• ベストセラー商品や新着商品を特集する
• 今後の購入のためのクーポンを提供する
• 商品ガイド、セットアップヘルプ、またはボーナスコンテンツへのリンクを追加する
• リーチを広げるためにソーシャル共有ボタンを追加する

WordPressでカスタムWooCommerceサンキューページを作成する方法

SeedProdを使用して、オンラインストア用のカスタムWooCommerceサンキューページを作成します。

SeedProdは、100万以上のWordPressサイトで使用されているドラッグアンドドロップ式のWordPressウェブサイトビルダーです。WordPress向けの最高のウェブサイトビルダーの1つです。

コードなしでコンバージョン率の高いランディングページ、カスタムWordPressテーマ、レスポンシブレイアウトを作成できます。開発者を雇うことなく、WooCommerceウェブサイトを作成するためにも使用できます。

SeedProdでカスタムWooCommerceサンキューページを構築するには、以下の手順に従ってください。

ビデオチュートリアル

ステップ1：SeedProdプラグインをインストールする

まず、SeedProdプラグインをダウンロードしてWordPressウェブサイトにインストールします。ヘルプが必要な場合は、WordPressプラグインのインストール方法に関するガイドをご覧ください。

SeedProdの無料バージョンを入手できますが、WooCommerceブロックにはSeedProd Eliteを使用します。Add-to-CartブロックとBest-Selling Productsブロックの両方にはEliteプランが必要なため、開始する前にプランを確認してください。

プラグインをインストールして有効化した後、WordPressダッシュボードからSeedProd » Settingsに移動し、ライセンスキーを入力します。

ライセンスキーは、SeedProdのウェブサイトのアカウントセクションで見つけることができます。

次に、SeedProd » Landing Pagesに移動します。ここでSeedProdのページモードを有効にし、新しいサンキューページを作成します。

「新しいランディングページを追加」ボタンを選択して、サンキューページを作成します。

ステップ2. SeedProdでサンキューページテンプレートを選択する

次の画面でランディングページテンプレートを選択できます。数百ものテンプレートが利用可能です。

「サンキュー」タブをクリックすると、サンキューページテンプレートのみが表示されます。次に、気に入ったテンプレートにカーソルを合わせ、チェックマークアイコンをクリックして起動します。

このチュートリアルでは、「注文完了サンキューページ」を使用します。

テンプレートを選択したら、名前とページURLを入力します。次に、「保存してページ編集を開始」ボタンをクリックします。

ステップ3：アップセルでサンキューページをカスタマイズする

これで、ドラッグアンドドロップビルダーを使用してサンキューページの編集を開始できます。ビジュアルエディターは、右側にページのライブプレビューを表示します。

いずれかの要素を編集するには、それをクリックすると、左側に設定メニューが表示されます。

左側のパネルには、ページにドラッグアンドドロップできる「ブロック」と呼ばれる要素があります。

まず、WooCommerceテーマに合わせてページのフォントを変更します。左下隅にある「グローバル設定」アイコンをクリックし、「フォント」タブを展開します。

次に、カスタムGoogleフォントを選択して、グローバルに適用できます。同じパネルで、グローバルカラー、背景、カスタムCSSを処理します。

次に、ドラッグアンドドロップビルダーを使用して、WooCommerceサンキューページをコンバージョン最適化されたポストチェックアウト画面に変換できます。

WooCommerceアップセルの追加

サンキューページに関連商品のアップセルを追加すると、平均注文額が増加し、ストアの売上が向上します。

ストアの注文確認ページにアップセルを作成する方法は次のとおりです。

左側のパネルにある「セクション」タブをクリックして、既製のコンテンツセクションの画面を開きます。「ヒーロー」タブを選択し、次にオレンジ色のプラスアイコンをクリックして「ヒーロー2」セクションを選択して挿入します。

次に、新しいセクションの画像ブロックをクリックし、アップセルしたい商品の画像を追加します。

商品タイトルや商品概要についても同様に行うことができます。

次に、新しいコールトゥアクションボタンを追加します。既存のボタンにカーソルを合わせ、ゴミ箱アイコンをクリックして削除します。

次に、WooCommerceブロックまでスクロールし、「カートに追加」ボタンをドラッグします。これにより、古いボタンがWooCommerce商品に接続されたボタンに置き換えられます。

ボタンをクリックして設定パネルを開き、その商品の商品IDを入力します。これにより、アイテムが自動的にお客様のカートに追加されます。

商品IDは、WordPress管理エリアから「商品 » すべての商品」に移動し、商品を見つけることで確認できます。

商品IDを追加したら、「直接チェックアウトへ」トグルをオンにします。カートに追加ブロックと直接チェックアウトは、ほとんどの初心者が見落としている部分であり、アップセルを追加のステップではなくワンタップで購入に変換するものです。

また、詳細設定タブをクリックして、ボタンの色、パディング、配置などをカスタマイズすることもできます。

次に、アップセルを宣伝するための見出しを追加しましょう。アップセルの上にヘッドラインブロックをドラッグし、購入を促す魅力的な見出しを追加します。

ベストセラー製品グリッドの追加

ベストセラー商品をサンキューページに追加することは、売上を伸ばす簡単な方法です。これらの商品は売れることが証明されているため、お客様はそれらを購入する準備ができている可能性が高いです。

これを行うには、WooCommerceブロックセクションまでスクロールし、ベストセラー製品グリッドをページにドラッグします。

ブロックを複数の商品、列、ページネーションなどを表示するように設定できます。「詳細設定」タブでは、グリッドの色、スタイル、配置、間隔をカスタマイズできます。

SeedProdを使用してサンキューページをカスタマイズする方法は他にもたくさんあります。たとえば、次のようなものを追加できます。

• 最近の商品
• セール中の商品
• 注目の製品
• 評価の高い商品

購入者がオファー終了前にセール品を確保するよう促すために、カウントダウンタイマーを追加することもできます。

変更を保存するには、右上隅にある保存ボタンをクリックすることを忘れないでください。

ステップ4. WooCommerceサンキューページの公開

注文確認ページの表示方法に満足したら、公開できます。保存ボタンのドロップダウン矢印をクリックし、公開を選択します。

これで、サンキューページにアクセスして、どのように見えるかを確認できます。

コードでWooCommerceサンキューページを編集する方法

個別のページを作成するのではなく、ネイティブの注文受信ページを編集したい場合は、コードを使用して行うことができます。この方法は開発者向けであることを正直に申し上げますが、独自のコンテンツを追加しながらWooCommerceのライブ注文詳細はそのまま保持できます。

WooCommerceの感謝ページは、ショートコードを持つ通常のページではありません。これは、thankyou.phpテンプレートから、注文受信エンドポイント（yoursite.com/checkout/order-received/のようなもの）でレンダリングされます。

そこに表示されるものを変更するには、2つの方法があります。

• woocommerce_thankyouフック：テンプレートファイルを編集せずに、注文確認の下にコンテンツを追加します。コードスニペットプラグインまたは子テーマにスニペットをドロップします。
• テンプレートオーバーライド：WooCommerceのtemplates/checkout/thankyou.phpを子テーマのwoocommerce/checkout/thankyou.phpにコピーし、templatesフォルダを削除してから、コピーを編集します。WooCommerceは、パスが正確に一致する場合にのみ、あなたのバージョンをロードします。

フックは2つのうちより安全な方です。このような短いスニペットは、確認の下にカスタムメッセージを追加します。

add_action( 'woocommerce_thankyou', 'custom_thankyou_message' );
function custom_thankyou_message( $order_id ) {
    $order = wc_get_order( $order_id );
    echo '<p>Thanks, ' . esc_html( $order->get_billing_first_name() ) . '! Your order is on its way.</p>';
}

知っておくべきことの1つは、テンプレートオーバーライドはプラグインの更新には耐えますが、テーマの更新には常に耐えるわけではないため、必ず子テーマ内のコピーを編集してください。WooCommerceの元のファイルまたは親テーマを編集すると、次の更新で変更が消去されます。

デフォルトのWooCommerceサンキューページを置き換える方法

SeedProdページを公開した後、購入者が代わりに新しい画面に着地するように、デフォルトの感謝ページをリダイレクトする必要があります。最も簡単な方法は、無料のリダイレクトプラグインを使用することです。

WordPressプラグインリポジトリで無料のThanks Redirect for WooCommerceプラグインをお勧めします。これは無料で、リダイレクトをすばやく追加できます。設定方法は次のとおりです。

1. Thanks Redirect for WooCommerceプラグインをインストールして有効化します。
2. WooCommerce » 設定に移動し、商品タブをクリックします。
3. Thanks Redirectリンクをクリックし、グローバルThanks Redirectを有効にするボックスをチェックします。
4. Thanks Redirect URLフィールドに新しい感謝ページのURLを貼り付け、変更を保存をクリックします。

リダイレクトする前に注意点が1つあります。完全に別のランディングページでは、注文番号、商品、合計金額などの顧客のライブ注文データは、動的に読み込まない限り表示されません。そのため、リダイレクトはマーケティングまたはアップセル画面として使用するのが最適です。購入者が確認の詳細を確認する必要がある場合は、注文の詳細を表示したままにするか、上記のフックメソッドを使用してください。

商品ごとに異なるサンキューページを設定することもできます。Thanks Redirectプラグインには商品ごとのリダイレクト設定があり、フックメソッドは注文内の商品IDに基づいて分岐できます。各商品が異なるアップセルを必要とする場合には、これを行う価値があります。

優れたWooCommerceサンキューページとは？

私がこれまでに見た最高のサンキューページは、いくつかのことを同時にうまくこなしています。注文を明確に確認し、残りの注意力を購入者を次のアクションに誘導するために使用します。

その価値のあるページを作成したい場合は、これらの要素を組み込んでください。

• 明確な確認：注文番号、商品、合計金額。これにより、購入者は購入が完了したことを知ることができます。
• 関連性の高いアップセル：確認画面の横に、注意をそらすような散らかったグリッドではなく、関連する商品を1つだけ表示します。
• 再来店を促す理由：次の注文のためのクーポンや、購入した商品のセットアップガイドへのリンク。
• 共有またはフォローのプロンプト：購入者をリーチに転換するソーシャルボタン。購入直後は最もハッピーな状態だからです。

焦点を絞りましょう。すべてをやろうとするサンキューページは、結局何も成果を上げられません。

サンキューページが公開されたら何をすべきか

ページの構築は仕事の半分にすぎません。公開したら、実際に機能しているかどうかを測定する方法を設定してください。

• 購入を追跡：注文受信ページにGA4購入イベントまたは広告ピクセルを追加して、コンバージョンを記録します。
• アップセルの成約率を監視：何人の購入者がアップセル商品を追加したかを確認し、反応が鈍い場合は別のオファーをテストします。

購入イベントから始めましょう。それなしでは、これらのどれかが状況を改善したかどうかを推測していることになります。

WooCommerceサンキューページFAQ

プラグインなしでWooCommerceのサンキューページを編集するにはどうすればよいですか？

コードで編集できます。`woocommerce_thankyou` アクションフックを使用してスニペットを追加し、注文確認の下にコンテンツを挿入するか、`thankyou.php` テンプレートを子テーマにコピーして、そのコピーを編集します。

フックメソッドは、テーマやプラグインのアップデートでも機能するため、より安全です。元のテンプレートファイルを編集すると、そうはなりません。

WooCommerceのサンキューページのURLは何ですか？

デフォルトのサンキューページは `order-received` エンドポイントにあり、`your-site.com/checkout/order-received/` のようになります。このエンドポイント名は、WooCommerce » 設定 » 詳細設定 » チェックアウトエンドポイントで変更できます。

商品ごとに異なるサンキューページを設定できますか？

はい。商品ごとの設定があるリダイレクトプラグインを使用すると、各商品の購入者を異なるページに誘導できます。また、注文内の商品IDに基づいて `woocommerce_thankyou` フックを分岐させることもできます。

各商品に異なるアップセルやフォローアップが必要な場合は、追加の設定を行う価値があります。

カスタムサンキューページでも、顧客は注文の詳細を確認できますか？

保持した場合のみです。別ページへのリダイレクトは、動的に取得しない限り、ライブ注文データを削除します。

確認の詳細が重要な場合は、ネイティブの注文受付済みページでフックまたはテンプレートメソッドを使用するか、カスタムページでWooCommerceの注文詳細ブロックを保持してください。

WooCommerceのサンキューページをカスタマイズする

これで、通常の確認画面を販売画面に変えるカスタムWooCommerceサンキューページができました。SeedProdを使用すると、コードなしで構築でき、午後に公開できます。

WooCommerceストアをさらに改善したいですか？次にこれらのチュートリアルを確認してください：

• WooCommerceで関連商品を制御する方法
• WooCommerceサイトのセキュリティを高める方法
• WooCommerceで在庫切れ商品を非表示にする方法
• WooCommerceの「追加情報」タブをカスタマイズする
• WooCommerceのカート表示が機能しない問題を修正する方法
• WooCommerceでショップページのタイトルを変更する方法
• WooCommerceで商品画像ギャラリーを改善する
• WooCommerce製品にスター評価を追加する方法

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