With BookGrail everyone can recommend books via email, Twitter and Facebook, but did you know that you can also embed a BookGrail-powered shopping cart and checkout process on your website… in just three simple steps?
Include the following reference in your webpage header:-
Your ‘Add to Basket’ button will need to include a few BookGrail specific data attributes.
Firstly, there are two attributes that must be included on your button:
- data-cart – add with the ISBN of the book as its value
- data-cart – open with the name of your container for your shopping cart as its value
Here’s a complete list of parameters you can use to further customise your BookGrail shopping cart:
- data-price – takes an ISBN as its value and makes a call to BookGrail to populate the price
- data-cart-add – takes an ISBN as its value, adds the book to the user’s shopping basket and displays an appropriate alert message
- data-cart-open – inserts an iframe containing the BookGrail cart into the container denoted by the attribute’s value
- data-cart-close – removes the iframe from the container denoted by the attribute’s value
- data-theme-color – used along with the data-cart-open attribute to set the cart button background colours using this attribute value
- data-book-message – used along with the data-cart-open attribute to display a html entry under each book title
Add a call to initialise the BookGrail connection in your webpage footer.
You can find your BookGrail referrer key by clicking on a book in Bookgrail, selecting Recommend and navigating to the Html tab.
You’ll see a URL:
Your referrer key is the string in bold.
Putting it all together, here’s a bare-bones demo that links to London publisher Head of Zeus’s BookGrail Account. Publishers are also able to set discount coupons, as Head of Zeus have done here:
Coming soon: a WordPress plugin to do the same.