BigCommerce + Ghost

How to use Ghost and BigCommerce together

Embed your ecommerce products directly into you Ghost publication using the Buy Button embed integration with BigCommerce

The BigCommerce platform allows you to sell products online with full ecommerce functionality, including the option to embed your products anywhere on the web.

Using the BigCommerce Buy Button function, you can grab a code snippet for any product that you’re selling and paste it into a card in the Ghost editor. This is a great way to connect your channels and to promote your products to your audience and monetise your content! There’s a few steps to get things setup, here’s how it works.

Create a Buy Button channel in BigCommerce

In order to create embeddable versions of your range of products, you’ll first need to add the Buy Button in the channel manager within the BigCommerce dashboard.

Create a Buy Button for your product

Once your new sales channel is ready to go, create a new Buy Button. You’ll be presented with an easy-to-use menu to customise what theme and style your button uses, as well as where the button directs the reader to:

If you haven’t created a product yet, you’ll need to do that first. Buy Buttons can be created using any product that you’ve added to your BigCommerce account.

Copy the BigCommerce embed code

Once you’re happy with your Buy Button for your product in the preview, navigate to the get code screen and copy the snippet provided to your clipboard:

Paste it into a block in the Ghost editor

Create a new HTML block in the Ghost editor on the post or page you would like to embed your BigCommerce product, and paste in your embed code:

Publish your post

That’s all there is to it! Ghost allows you to paste embed code directly into the HTML block and renders the embed content in your post.

Here’s an example of the end result:

Tip: For a more advanced implementation, it is entirely possible to embed your BigCommerce Buy Button directly within a Handlebars template file in the theme layer, or into a custom front-end.

Do more with Zapier

As always, you can power up your site even further using Zapier. If you’re already using BigCommerce for ecommerce, then you might also like some of these complimentary automations: