Build a fully customisable ecommerce solution into your Ghost publication with an X-Cart Buy Button integration
X-Cart is a flexible and open source ecommerce platform that allows developers to turn websites into an ecommerce platform. It comes with plenty of features, integrations, full support and professional services.
Using the code injection feature within Ghost, it’s entirely possible to integrate with X-Cart directly and start selling products and services from your site.
Sign up for X-Cart and add your products
X-Cart offer a range of pricing options including a free edition of the open source software. Select a plan that is right for your needs and sign up. Once you’ve done that, you’ll be able to add products and adjust their details, price and inventory levels.
Grab a Buy Button code
Once you have your product catalog in place, you can use the Buy Button feature to embed products on your Ghost publication. Navigate to Sales Channels > Buy Button from the navigation panel on the left, and select a product from your catalog that you’d like to embed:
Hit the “Generate code” button and copy the code provided:
Paste it into a block in the editor
Create a new HTML block in the Ghost editor on the post or page you would like to embed your X-Cart product, and paste 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:
For a more advanced implementation, it is entirely possible to embed your X-Cart Buy Button directly within a Handlebars template file in the theme layer, or into a custom front-end.
For further information about getting the most out of X-Cart, check out their developer documentation and community support.
