This tutorial demonstrates how to integrate a Deadline Funnel countdown into your WooCommerce sales page and product page. WooCommerce does not provide product-specific cart pages, so you will be unable to add a countdown timer to that page.
This article covers:
How to integrate Deadline Funnel with a WooCommerce Sales Page (floating bar)
1. Be sure you have the WooCommerce and Deadline Funnel plugins installed, activated and setup on your WordPress site:
You can download your Deadline Funnel plugin by navigating to Your Account > Advanced > Code Snippets:
2. Navigate to Pages, add the URL for your sales page, select 'Display Floating Bar', add the redirect URL, and click 'Save':
3. Since you used the Deadline Funnel plugin to add your tracking code to your website, no other steps are needed. You can view your sales page to see your Floating Bar countdown timer. Here's an example of what the Floating Bar looks like:
4. Edit your sales page so that your Buy Button links to your Product Page
How to integrate Deadline Funnel with a WooCommerce Product Page (inline timer)
1. In the Products section of your WooCommerce settings, click the name of your product to edit it:
2. In your Deadline Funnel dashboard, under Your Account >> Advanced >> Code Snippets, copy the Deadline Funnel WordPress shortcode for an inline countdown:
3. In WordPress, scroll down to the 'product short description' box and paste your Deadline Funnel short code into the description where you want your inline countdown timer to appear and then click 'Update' to save your changes:
4. Return to your Pages and add the URL for your product page, select 'Display Inline Timer', add your redirect URL, and click 'Save':
5. View your product page and you will see your countdown timer in the location where you placed your WordPress shortcode:
How to Hide Your Lower-Priced Product from your WooCommerce Shop
Deadline Funnel's tracking will re-direct site visitors away from your sales page when their deadline expires, but you may also want to hide the sales page from your WooCommerce shop. To hide the lower-priced product from the shop:
1. Navigate to the lower-priced in your website and edit the 'Catalog visibility':
2. Select 'Hidden' to keep this product from appearing in your shop.
If you have any questions, please let us know at firstname.lastname@example.org.