[How to] setup a Woocommerce Checkout on your Unbounce landing page

The team at Webistry put together a step-by-step tutorial on how to quickly send traffic from your Unbounce landing page to your Woocommerce checkout. Webistry has a ton of experience with ecomm landing pages, with samples of their work featured in the Unbounce Ecommerce Lookbook.

Here’s a link to the lookbook for some more ecomm inspiration. :shopping: :desktop_computer:

Without further ado, scroll on for a quick guide to connect your Unbounce landing page to your Woocommerce site.

:rotating_light: WARNING :rotating_light:

This is not an official Unbounce feature. This functionality is based entirely on third party code, and has only been tested in limited applications. Since this isn’t a supported Unbounce feature, our support team will be unable to assist if things go awry. So if you are not comfortable with HTML, Javascript and CSS, please consider consulting an experienced developer.

Step 1.

Locate your product ID in Woocommerce, (here’s an article that explains how to find it)

Step 2.

Create a permalink using the following template:

Step 3.

Drag and drop the Button widget onto your Unbounce landing page

1

Step 4.

Select “Go to URL” as your action, paste your permalink in the URL field, tick the box “Pass through URL parameters”, under “Target” select “Same tab or window”

2

Step 5.

Style your CTA button

Step 6.

Copy paste your button in other sections where needed

Boom, you’re done :boom:


Want to take your Unbounce landing pages + Convertables™ to the next level?
:spinbounce: Check out the Ultimate List of Unbounce Tips, Scripts & Hacks

3 Likes

Hey @Stefano, this is great! Super quick and simple. Wondering if you’ve had a go at load the shopify “Buy Now” buttons on your landing pages. Also super seamless, and some nice user friendly customisations.

Oh that does look seamless!

Is that very different from this workaround here?

Yes, absolutely! We’ve also released some instructions on how to have on-page checkout with Shopify that was shared above :point_up:

1 Like

@Stefano & @Jess, yes Stef’s previous article is exactly it. Was pretty sure someone would have dropped this nugget in the community to already. We love testing this with higher ticket items or new launches. Think so often shopify can limit you from a value delivery pov, in the form of product / collection content - something that shouldn’t be taken for granted for audiences that know little to nothing about the brand or the product make-up.

2 Likes