How to create a Buy Button on a page or blog

Shopify has a feature which allows you to add a custom Buy Button into places like one of your shop's pages or blog posts. This allows you to embed a product, collection or multiple items to any Shopify page and blog. The wizard helps you create an embed code which you can add to the standard Rich Text Editor. The same embed code can be used on external blogs and websites as well. 

Some examples of button types you can create:

Add to Cart - Shows a sample of the product and price. Allows the customer to quickly add the product to their cart

Buy Now - Sends customer directly to Checkout

View Product - Creates a modal window with more information about the product (like Quick View), includes additional customization options and a floating cart

View Product - Example of a collection:

Example of modal window and settings:

Checkout links

Another option included is to create checkout links which you can share on social media or other sites. These links will allow customers on social media, blogs and other websites to send the customer directly to checkout on your store with the product chosen. 

Example:

https://pipeline-theme.myshopify.com/cart/2048945923:1?channel=buy_button

Clicking on that link will send you to our demo store checkout with that product. 

Example of setup:


How to add Shopify's Buy Button and Checkout links

The Buy Button feature is found under Sales Channels. You can add the feature by clicking on the plus icon next to Sales Channels:

Choose and add:

Once added, you'll see Buy Button:

Here is a link to Shopify's article on how to setup and brand your Buy Button:

https://help.shopify.com/en/manual/sell-online/buy-button/create-buy-button


Important note about using this feature

When using Shopify's Buy Button feature, you are using a separate Cart which is outside of Pipeline theme. For that reason, your customers can run into a situation where they have products in their cart with Pipeline but they won't be shown Shopify's Buy Button Cart. 

Here's an example if your page/blog has the View Product or Add to Cart button type - The customer might be confused with two carts:

The Pipeline cart might be empty but they've added the Straight Razor product to the cart using the Buy Button feature:

Both carts shown at the same time:

Using the Buy Now version (Directs shoppers to checkout), might help as it sends the customer right to checkout. However, if they have items in the standard Pipeline Cart, they won't appear in checkout. 

If you are going to use Shopify's Buy Button feature, be aware of these separate systems and consider the issues you might run into with your customers. 


Alternative Solution

Have a look at this app which allows you to create add to cart buttons which interact with Pipeline's cart:

https://apps.shopify.com/pagefly