I'm writing a series of blog posts on my eCommerce site. For example, "10 easy breakfasts for the busy mom/dad". Under each "breakfast idea", I want to put a small block like "Items you'll need". This "items you'll need" will have links to products in our shopping site.
The idea is that if someone likes a blog post or one of the "receipes", they can immediately click on the products below and add them to cart. I don't want them to be taken away from the page they are reading though, because that would be annoying.
They will need some indication that the product was added to cart, so maybe a green tick or "Added!" label will need to show up.
When you get to bottom of the blog post, there should be a block "Products you have in your cart" so that they review and can choose to check out if they want.
I've found these articles & modules:
Creating Drupal Commerce add to cart links ,
But I'm not sure which is the way to go considering my requirements:
- Curated product links / thumbnails in blocks
- Clicking sends ajax signal to cart to add product
- There is an indication that the product was added "Added!" or a tick or border highlight.
- If the same product is on multiple blocks in the page, when I click one block, it should update on all the blocks.
- Ajax stuff should be robust on mobile devices
I've never done this before, Drupal ajax & custom cart stuff, so I wanted to ask your advice on what to consider before moving ahead. I want to do it in the simplest and most robust way possible. If I can avoid custom code and sandbox code, that would be ideal. Thanks.