How to Add a Discount Offer Popup on the Product Page in Woomen

In WooCommerce with the Woomen Theme, you can create discount offers to encourage customers to spend more and enjoy benefits such as percentage-based or fixed-amount discounts. These offers can be displayed on product detail pages as popups, guiding users about ongoing deals.

xample Discount Scenarios

• Spend $2,000 → Get 10% off

• Spend $3,000 → Get $300 discount

Step 1: Enable Spend & Save Discounts

1. Log in to your WordPress Dashboard.

2. In the sidebar, navigate to Merchant → Spend and Save Discounts.

3. Enable this feature.

4. Choose your discount type:

   • Percentage Discount (e.g., 30%)

   • Fixed Amount Discount (e.g., $300)

5. Set your threshold amount (e.g., $3,000).

6. Save your settings.

Step 2: Display Discount Popup on Product Page

By default, the discount popup will not appear automatically on the product detail page. To display it, you’ll need to use a WordPress hook.

1. Edit your product page using Elementor.

2. In the Elementor sidebar, search for the widget DoAction.

3. Drag and drop the widget where you want the popup to appear.

4. From the settings, select:

   • Predefined Action → Before Single Product.

5. Save and update the page.

Now, the discount popup will appear on the product page, informing customers about the offer.

Step 3: Test the Discount

1. Add products to your cart.

2. Increase the quantity until the total reaches the discount threshold (e.g., $3,000).

3. Check the popup—it will confirm your eligibility (e.g., Congratulations, you got a 30% discount!).

4. Go to the Cart Page and proceed to Checkout.

5. At checkout, you’ll see the discount applied:

   • Example:

     • Cart Total: $5,850

     • Discount (30%): $1,755

     • Final Payable: $4,095