首页 >CMS教程 >WordPress >创建WooCommerce兑换产品页面

创建WooCommerce兑换产品页面

尊渡假赌尊渡假赌尊渡假赌
尊渡假赌尊渡假赌尊渡假赌原创
2025-02-18 12:56:11617浏览

创建WooCommerce兑换产品页面

钥匙要点

  • WooCommerce允许您创建客户可以兑换产品的独特优惠券代码,这对于诸如会议之类的活动的预销售项目特别有用。
  • >
  • >可以通过复制您的页面。此页面将具有一个简单的表格,客户可以在其中输入其优惠券代码。
  • >可以通过AJAX功能来增强赎回过程,通过减少页面加载的需求,可以使用户交互更加顺畅,更快。这是通过验证优惠券代码并自动将相应产品添加到购物车中以进行结帐来实现的。
  • 智能优惠券插件可用于生成多个优惠券,跟踪使用情况,限制使用情况,设置到期日期,将优惠券应用于特定产品或类别,并启用自动应用优惠券。
  • >在本文中,我们将探索一种独特的方式,允许您的客户轻松兑换他们可能已经在会议或其他类似活动中已经支付的产品或一组产品。
>

>让我们更多地谈论这个概念。假设您是拥有革命性新产品的商店老板,并在会议上向成千上万的人介绍了它。在演讲结束时,那些愿意尝试您的产品的客户可以提前付款。您甚至可能通过将您的价格降低给前500名客户来吸引他们。> 在这种情况下,您将在WooCommerce中做的是创建500张优惠券,产品折扣为100%。您可以使用智能优惠券插件来生成这500张优惠券,因此您不必手动创建它们。每个提前付款的客户都会获得优惠券代码,但据客户所知,这只是赎回产品的代码。

>

创建优惠券代码

>如果您对要约的认真程度,那么您将尝试使优惠券代码看起来随机,并且使用户不可能提出有效的优惠券代码。确保选择哪些产品绑在此优惠券上,以便以后可以自动将其添加到购物车中。看看我创建的优惠券之一,请密切关注设置:>

创建WooCommerce赎回产品页面

>您可以轻松地制作page.php的副本,然后将其转换为页面模板,以便您可以将其用于我们要发送这些客户的页面,以便他们可以兑换产品。命名类似于page-coupon-redeem.php

>以下标记是我们将使用该页面上显示给客户的表单的格式。这只是一个带有两个字段的表格,一个用于输入其代码和实际提交按钮。我们正在努力使客户尽可能简单。因此,我们将通过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,请参阅我以前的文章,将AJAX添加到您的WordPress插件中,以简要介绍WordPress中的Ajax。

>让我们开始构建“赎回您的产品页面”所需的AJAX功能,以如预期的那样运行。主题的functions.php文件中的所有代码均为

>

注册我们的Ajax处理程序

第一次注册我们的AJAX调用处理程序,通过挂接WP_AJAX_ $ ACTION和WP_AJAX_NOPRIV_ $ ACTION ACTION。

请注意,无论是否登录,同一功能都在处理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

处理表单提交
<span><span><?php
</span></span><span><span>function spyr_coupon_redeem_handler() {
</span></span><span>
</span><span>	<span>// Get the value of the coupon code
</span></span><span>	<span>$code = $_REQUEST['coupon_code'];
</span></span><span>
</span><span>	<span>// Check coupon code to make sure is not empty
</span></span><span>	<span>if( empty( $code ) || !isset( $code ) ) {
</span></span><span>		<span>// Build our response
</span></span><span>		<span>$response = array(
</span></span><span>			<span>'result'    => 'error',
</span></span><span>			<span>'message'   => 'Code text field can not be empty.'
</span></span><span>		<span>);
</span></span><span>
</span><span>		<span>header( 'Content-Type: application/json' );
</span></span><span>		<span>echo json_encode( $response );
</span></span><span>
</span><span>		<span>// Always exit when doing ajax
</span></span><span>		<span>exit();
</span></span><span>	<span>}
</span></span><span>
</span><span>	<span>// Create an instance of WC_Coupon with our code
</span></span><span>	<span>$coupon = new WC_Coupon( $code );
</span></span><span>
</span><span>	<span>// Check coupon to make determine if its valid or not
</span></span><span>	<span>if( ! $coupon->id && ! isset( $coupon->id ) ) {
</span></span><span>		<span>// Build our response
</span></span><span>		<span>$response = array(
</span></span><span>			<span>'result'    => 'error',
</span></span><span>			<span>'message'   => 'Invalid code entered. Please try again.'
</span></span><span>		<span>);
</span></span><span>
</span><span>		<span>header( 'Content-Type: application/json' );
</span></span><span>		<span>echo json_encode( $response );
</span></span><span>
</span><span>		<span>// Always exit when doing ajax
</span></span><span>		<span>exit();
</span></span><span>
</span><span>	<span>} else {
</span></span><span>		<span>// Coupon must be valid so we must
</span></span><span>		<span>// populate the cart with the attached products
</span></span><span>		<span>foreach( $coupon->product_ids as $prod_id ) {
</span></span><span>			<span>WC()->cart->add_to_cart( $prod_id );
</span></span><span>		<span>}
</span></span><span>
</span><span>		<span>// Build our response
</span></span><span>		<span>$response = array(
</span></span><span>			<span>'result'    => 'success',
</span></span><span>			<span>'href'      => WC()->cart->get_cart_url()
</span></span><span>		<span>);
</span></span><span>
</span><span>		<span>header( 'Content-Type: application/json' );
</span></span><span>		<span>echo json_encode( $response );
</span></span><span>
</span><span>		<span>// Always exit when doing ajax
</span></span><span>		<span>exit();
</span></span><span>	<span>}
</span></span><span><span>}</span></span>
>现在剩下要做的就是构建jQuery代码,以将优惠券代码提交给WordPress进行处理和处理返回的JSON数据。

最终结果

>表格的样式完全取决于您。我已经使用了默认的20个主题和WooCommerce的虚拟数据,并且使用了几个CSS规则,这就是我下面的内容。
<span>jQuery( document ).ready( function() {
</span>       <span>jQuery( '#ajax-coupon-redeem input[type="submit"]').click( function( ev ) {
</span>
        <span>// Get the coupon code
</span>        <span>var code = jQuery( 'input#coupon').val();
</span>
        <span>// We are going to send this for processing
</span>        data <span>= {
</span>            <span>action: 'spyr_coupon_redeem_handler',
</span>            <span>coupon_code: code
</span>        <span>}
</span>
        <span>// Send it over to WordPress.
</span>        jQuery<span>.post( woocommerce_params.ajax_url, data, function( returned_data ) {
</span>            <span>if( returned_data.result == 'error' ) {
</span>                <span>jQuery( 'p.result' ).html( returned_data.message );
</span>            <span>} else {
</span>                <span>// Hijack the browser and redirect user to cart page
</span>                <span>window.location.href = returned_data.href;
</span>            <span>}
</span>        <span>})
</span>
        <span>// Prevent the form from submitting
</span>        ev<span>.preventDefault();
</span>    <span>}); 
</span><span>});</span>
>
空字段错误消息
创建WooCommerce兑换产品页面
>无效的代码错误消息
创建WooCommerce兑换产品页面
>有效的代码/卡车填充
创建WooCommerce兑换产品页面

结论

>即使这种情况可能不适用于那里的每个商店,WooCommerce也可以通过其API为我们提供一组工具,以便我们几乎可以完成任何想法。将WordPress添加到混音中,您将获得一个完整的电子商务解决方案,这是首屈一指的。

>

>我希望通过本文,我对优惠券如何在WooCommerce中的工作提供了一些见解,并且您在下一个项目中使用它会更加自在。

>

>创建WooCommerce赎回优惠券页面的常见问题(常见问题解答)

>如何在WooCommerce中创建唯一的优惠券代码?

>在WooCommerce中创建唯一的优惠券代码是一个简单的过程。首先,导航到WordPress仪表板的WooCommerce部分。单击“营销”选项卡下的“优惠券”。单击“添加优惠券”,您将被指向新页面,您可以在其中创建唯一的优惠券代码。您可以根据需要自定义优惠券代码,折扣类型,优惠券金额和其他设置。请记住要单击“发布”以保存您的新优惠券代码。

我可以为我的WooCommerce优惠券设置到期日期吗?在创建或编辑优惠券时,您会在“常规”选项卡下找到“优惠券到期日期”选项。在这里,您可以选择要优惠券到期的日期。设置日期后,请记住单击“发布”或“更新”以保存更改。

我如何限制WooCommerce优惠券的使用?

woocommerce允许您限制用法您的优惠券。在创建或编辑优惠券时,在“使用限制”选项卡下,您可以设置优惠券的次数,可以应用的项目数,或者单个用户可以使用的次数优惠券。设置限制后,请记住单击“发布”或“ Update”以保存您的更改。

我可以将优惠券应用于特定产品或类别吗?特定产品或类别的优惠券。在创建或编辑优惠券时的“用法限制”选项卡下,您可以选择优惠券将适用的特定产品或类别。您还可以从优惠券的折扣中排除某些产品或类别。设置限制后,请记住单击“发布”或“更新”以节省您的更改。>

>我如何使客户自动应用优惠券?

使客户能够自动应用优惠券,您需要使用诸如“ smart优惠券”之类的插件。安装并激活后,导航到插件的设置。在这里,您可以启用“自动申请”选项,当客户的购物车符合优惠券的条件时,它将自动应用优惠券的折扣。

>

我可以创建一个提供免费礼物的优惠券吗?

​​

是的,您可以创建免费礼物的优惠券。您需要使用诸如“ WooCommerce的智能优惠券”之类的插件。安装并激活后,导航到插件的设置。在这里,您可以创建新的优惠券,并将折扣类型设置为“免费礼物”。然后,您可以在使用优惠券时选择将作为免费礼物提供的产品。

>我如何与客户共享我的WooCommerce Coupon?与客户的优惠券。您可以在营销电子邮件中包含优惠券代码,在网站上显示,或在社交媒体上共享。您还可以使用诸如``WooCommerce for WooCommerce for WooCommerce''之类的插件直接通过电子邮件将优惠券发送给客户。

我可以跟踪我的WooCommerce优惠券的使用吗?您的WooCommerce优惠券的使用。在WooCommerce仪表板的“报告”部分下,您可以查看有关优惠券使用情况的详细报告。您可以看到每张优惠券已使用了多少次,给出的总折扣金额等等。

>我可以创建适用于运输成本的优惠券吗?适用于运输成本的优惠券。在创建或编辑优惠券时,请在“折扣类型”下拉菜单下选择“运输折扣”。然后,您可以设置折扣金额。请记住要单击“发布”或“更新”以保存您的更改。

我只能将优惠券限制在新客户吗?

是的,您只能将优惠券限制在新客户身上。在创建或编辑优惠券时的“使用限制”选项卡下,您可以选中“仅允许新客户”的框。这将确保只有首次购买的客户才能使用优惠券。设置限制后,请记住单击“发布”或“更新”以节省您的更改。>

以上是创建WooCommerce兑换产品页面的详细内容。更多信息请关注PHP中文网其他相关文章!

声明:
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系admin@php.cn