ホームページ > CMS チュートリアル > &#&プレス > WooCommerce Redeem製品ページの作成

WooCommerce Redeem製品ページの作成

尊渡假赌尊渡假赌尊渡假赌
リリース: 2025-02-18 12:56:11
オリジナル
616 人が閲覧しました

WooCommerce Redeem製品ページの作成

キーテイクアウト

  • woocommerceを使用すると、顧客が製品に対して引き換えることができる独自のクーポンコードを作成できます。 Ajax機能により、償還プロセスを強化することができます。これにより、ページの負荷の必要性を減らすことで、よりスムーズで高速なユーザーインタラクションが可能になります。これは、クーポンコードを検証し、チェックアウトのために対応する製品をカートに自動的に追加することによって実現されます。
  • スマートクーポンプラグインを使用して、複数のクーポンを生成し、使用するのを追跡し、使用するのを制限し、有効期限を設定し、特定の製品またはカテゴリにクーポンを適用し、クーポンの自動アプリケーションを有効にすることができます。
  • この記事では、顧客がすでに会議や他の同様のイベントですでに支払った製品または製品のグループを簡単に引き換えることができる独自の方法を探ります。
  • このコンセプトについてもう少し話しましょう。あなたが革新的な新製品を持っている店主であり、会議で何千人もの人々にそれを提示するとしましょう。あなたのスピーチの終わりに、あなたの製品を試してみる意思のある顧客は、事前にそれを行い、それを支払うことができます。最初の500人の顧客に価格を下げることで、それらを誘惑したかもしれません。 このシナリオでは、WooCommerceで行うことは500クーポンを作成することで、100%の製品割引があります。スマートクーポンプラグインを使用してこれらの500のクーポンを生成して、手動で作成する必要がないようにすることができます。事前に支払った各顧客はクーポンコードを取得しますが、顧客が知っている限り、それは製品を引き換えるコードにすぎないことを知っています。 クーポンコードの作成
  • オファーについて十分に真剣である場合は、ユーザーが有効なクーポンコードを作成することは不可能ではないにしても、クーポンコードをランダムに見せて難しくしようとします。後で自動的にカートに追加できるように、このクーポンに縛られている製品を選択してください。私が作成したクーポンの1つを見て、設定に細心の注意を払ってください。

WooCommerce Redeem Products Pageの作成

page.phpのコピーを簡単に作成してページテンプレートに変えることができます。そうすれば、それらの顧客に製品を引き換えることができるページに使用できます。 Page-Coupon-Redeem.php

のような名前を付けてください

次のマークアップは、そのページの顧客に表示されるフォームをフォーマットするために使用するものです。これは、コードと実際の送信ボタンを入力するための2つのフィールドを備えたフォームにすぎません。私たちは、これを顧客のために可能な限りシンプルにしようとしています。だから私たちはAjaxを介してすべてを行うので、できるだけ少ないページのロードがあります。

<span><span><span><div</span> class<span>="redeem-coupon"</span>></span>
</span>	<span><span><span><form</span> id<span>="ajax-coupon-redeem"</span>></span>
</span>		<span><span><span><p</span>></span>
</span>			<span><span><span><input</span> type<span>="text"</span> name<span>="coupon"</span> id<span>="coupon"</span>/></span>
</span>			<span><span><span><input</span> type<span>="submit"</span> name<span>="redeem-coupon"</span> value<span>="Redeem Offer"</span> /></span>
</span>		<span><span><span></p</span>></span>
</span>		<span><span><span><p</span> class<span>="result"</span>></span><span><span></p</span>></span>
</span>	<span><span><span></form</span>></span><!-- #ajax-coupon-redeem -->
</span><span><span><span></div</span>></span><!-- .redeem-coupon --></span>
ログイン後にコピー

ユーザーがコードを入力して送信ボタンにヒットすると、テキストフィールドに入力された値が検証のために送信され、有効な場合、ユーザーは「カート」ページにリダイレクトされ、製品は製品がリダイレクトされますすでに0ドルの価格でチェックアウトするためにそこにいます。たまたまコードが正しくない場合、何かが間違っていて入力されたコードが有効でないことをユーザーに通知します。

ajax機能の構築

WordPressでAjaxを行ったことがない場合は、WordPressでAjaxを簡単に紹介するために、WordPressプラグインにAjaxを追加してください。

「製品ページを引き換える」に必要なAjax機能の構築を開始して、予想どおりに機能します。以下のすべてのコードは、functions.phpファイルに掲載されています。

ajaxハンドラーを登録します

最初に、wp_ajax_ $ actionとwp_ajax_nopriv_ $アクションアクションに接続して、ajaxコールハンドラーを登録します。

同じ関数が、ログインしているかどうかにかかわらず、両方の顧客のAJAX呼び出しを処理していることに注意してください。

次に、次の可能なシナリオを説明するためにロジックの構築を開始します。

<span>add_action( 'wp_ajax_spyr_coupon_redeem_handler', 'spyr_coupon_redeem_handler' );
</span><span>add_action( 'wp_ajax_nopriv_spyr_coupon_redeem_handler', 'spyr_coupon_redeem_handler' );</span>
ログイン後にコピー
コードテキストフィールドが空です

コードが無効であるため、意味は有効なクーポンコードではありません

有効なクーポンを正常に提示します

    クーポンロジックの処理
  • アクションが登録され、何をすべきかがわかったので、可能なシナリオを処理する実際の関数を記述する必要があります。
  • jquery
  • でフォームの送信を処理します
今やるべきことは、jQueryコードを構築して、jsonデータを処理および処理するためにクーポンコードをWordPressに送信することだけです。

最終結果

フォームのスタイリングは完全にあなた次第です。デフォルトのTwellve ThemeとWooCommerceのダミーデータを使用しましたが、いくつかのCSSルールを使用して、これは以下にあります。
空のフィールドエラーメッセージ
WooCommerce Redeem製品ページの作成
無効なコードエラーメッセージ
WooCommerce Redeem製品ページの作成
有効なコード/カートが存在する
WooCommerce Redeem製品ページの作成

結論

このシナリオはそこにあるすべての店には適用されないかもしれませんが、WooCommerceはAPIを介して一連のツールを提供して、私たちが心を設定したほとんどすべてのものを達成できるように輝いています。ミックスにWordPressを追加すると、誰にも負けない完全なeコマースソリューションがあります。

この記事を通して、クーポンがWooCommerceでどのように機能するかについての洞察を提供し、次のプロジェクトで使用するのがより快適に感じることを願っています。

WooCommerce Redeemクーポンページの作成に関するよくある質問(FAQ)

WooCommerceで一意のクーポンコードを作成するにはどうすればよいですか?

WooCommerceで一意のクーポンコードを作成することは、簡単なプロセスです。まず、WordPressダッシュボードのWooCommerceセクションに移動します。 [マーケティング]タブの下で「クーポン」をクリックします。 「クーポンの追加」をクリックすると、一意のクーポンコードを作成できる新しいページに向けられます。ニーズに応じて、クーポンコード、割引タイプ、クーポン額、その他の設定をカスタマイズできます。 「公開」をクリックして新しいクーポンコードを保存してください。

WooCommerceクーポンの有効期限を設定できますか?クーポンを作成または編集するときは、「一般」タブの下に「クーポンの有効期限」オプションがあります。ここでは、クーポンの有効期限を切る日付を選択できます。日付を設定した後、「公開」または「更新」をクリックして変更を保存してください。あなたのクーポンの。クーポンを作成または編集するときに「使用制限」タブで、クーポンを使用できる回数、適用できるアイテム数、または単一のユーザーが使用できる回数に制限を設定できます。クーポン。制限を設定した後、「公開」または「更新」をクリックして変更を保存することを忘れないでください。

特定の製品またはカテゴリにクーポンを適用できますか?特定の製品またはカテゴリへのクーポン。クーポンを作成または編集するときに「使用制限」タブで、クーポンが適用される特定の製品またはカテゴリを選択できます。クーポンの割引から特定の製品またはカテゴリを除外することもできます。制限を設定した後、「公開」または「更新」をクリックして変更を保存してください。

顧客がクーポンを自動的に適用できるようにするにはどうすればよいですか?

顧客がクーポンを自動的に適用できるようにするには、「WooCommerce用のスマートクーポン」などのプラグインを使用する必要があります。インストールしてアクティブになったら、プラグインの設定に移動します。ここでは、顧客のカートがクーポンの条件を満たしているときにクーポンの割引を自動的に適用する「Auto Apply」オプションを有効にすることができます。 >はい、無料のギフトを提供するクーポンを作成できます。 「WooCommerce用のスマートクーポン」などのプラグインを使用する必要があります。インストールしてアクティブになったら、プラグインの設定に移動します。ここでは、新しいクーポンを作成して、割引タイプを「無料ギフト」に設定できます。その後、クーポンの使用時に無料ギフトとして与えられる製品を選択できます。顧客とのクーポン。クーポンコードをマーケティングメールに含めるか、ウェブサイトに表示するか、ソーシャルメディアで共有できます。 「WooCommerceのスマートクーポン」などのプラグインを使用して、メールでクーポンを顧客に直接送信することもできます。 WooCommerceクーポンの使用。 WooCommerceダッシュボードの「レポート」セクションでは、クーポンの使用に関する詳細なレポートを表示できます。各クーポンが使用された回数、与えられた総割引額などを確認できます。送料に適用されるクーポン。クーポンを作成または編集するときは、「割引タイプ」ドロップダウンの下で、「配送割引」を選択します。その後、割引額を設定できます。変更を保存するには、「公開」または「更新」をクリックしてください。

クーポンを新規顧客のみに制限できますか?

はい、クーポンを新規顧客のみに制限できます。クーポンを作成または編集するときに「使用法制限」タブの下で、「新しい顧客のみを許可する」というボックスを確認できます。これにより、最初の購入を行っている顧客のみがクーポンを使用できるようになります。制限を設定した後、「公開」または「更新」をクリックして変更を保存してください。

以上がWooCommerce Redeem製品ページの作成の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

このウェブサイトの声明
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。
人気のチュートリアル
詳細>
最新のダウンロード
詳細>
ウェブエフェクト
公式サイト
サイト素材
フロントエンドテンプレート