Some people use Shopify for everything: their CMS and their check out. If, however, you're building out a lot of landing pages, it might be easier to use another application to manage all of your content.
Today we're going to learn:
- How to create a buy button provided by Shopify, so that you can add online shopping to your existing site.
- How to add a buy button to a landing page created by another application, such as WordPress, so that people can click on it and check out.
How to Create a Buy Button:
If we go to 'sales channels,' we'll find a '+' and a circle. This is showing up because we haven't added a buy button to our dashboard yet. In this case, we need to add one.
If we click on the plus, it's going to show different sales channels. We should see one in green that says 'buy button.' Hit the plus sign and it will add it to your dashboard.
Once we've added a buy button, we can start creating it. First, we select a product.
Then, we configurate the product. As we go through the menu, we can figure out how exactly we'd like to modify it.
Once we've gone through those options, we can click on 'Shopping cart' if we'd like to make any modifications to the shopping cart.
Once you select 'Generate code,' you will get some JavaScript code which you can copy and past into the application that we're using to display the button.
In this example, I'm using WordPress to display this button. Copy the code, head over to the WordPress dashboard, paste the code into the text area provided by Shopify and hit the update button.
Note: This will work on any website that will allow you to host HTML embed code.
Then we can preview it and when we hit 'add to cart' it's going to give us a nice JavaScript cart on the right-hand side where we can modify our items and check out.
Note: When you click the checkout button, it's going to give you a pop-up window for all of your checkouts. This means the customer doesn't leave the website which is a great way to keep users on your site.
How to Create a Checkout Page:
If we want to redirect our users to a checkout page, instead of staying on the website, we go back to 'Buy button' and click on 'Create a checkout link.'
Select a product,
copy the link,
add it to the buy button on our website and paste it into the URL bar. Hit save and it will take us to a full checkout page.
Yay!
That's it!
To receive updates, drop your email in the form below and we will let you know each time we post a new blog.