d
Topic
Posts:
15
August 15, 2007

Stay in Place, Add to Cart Button This post is outdated

Hello, I need an "Add to Cart" button when after clicking, one stays on the same page. Example, uk/product/?productid=1029">http://www.couverture.co.uk/product/?productid=1029. When the item is added, the shopper is not scurried to the checkout page but encouraged to linger and buy more. The shopper chooses when to checkout instead of being sent there directly. This will be a great benefit to all. Please stay and shop! Thanks in advance. Note: This differs from the "continue where shopping" button referenced here: http://forums.shopify.com/categories/2/posts/3773
i
Replies
Posts:
2055
August 15, 2007

Our research indicated that customers are confused by this but you can implement this very simply in shopify:

Either you can use AJAX to add the item to the cart like showroom does or you add the following hidden element in the add to cart form:

<input name="return_to" value="back" />

Tobias Lütke - Shopify CEO // http://twitter.com/tobi
Jared Burns Shopify Advisor get.sy
Posts:
496
August 15, 2007

Don’t forget to put the hidden attribute in Tobi’s field above…

<input type="hidden" name="return_to" value="back" />
Jared Burns, CEO at Getsy (http://get.sy)
Posts:
15
August 15, 2007

Thank you.

Ideally, generating a recommended list of products (after clicking “buy”) would make this less confusing (especially if the list was not present before).

And some type of confirmation that this item was added to the cart, other than the small change in qty present in most cart (as displayed in the upper right-hand corner).

Popping a little bit of text in place “this item was added to your shopping cart” should solve the confusion too.

Posts:
2055
August 15, 2007

The showroom theme does a good job with these kind of things. I agree, most people should consider to display a collection of recommended items on the cart page.

Tobias Lütke - Shopify CEO // http://twitter.com/tobi
Posts:
15
August 15, 2007

In reference to one of your earlier comments about seeing everything that’s in the shopping cart, while the showroom theme is wonderful, showing everything that’s in the shopping cart COULD have the opposite effect. That is, “OMG! I have 14 items already. Time to put something back.” It’s preferred to get a buyer to the register. If a shopper going to “abandon the cart (or items), strong preference would that it occurs later in the shopping experience not earlier.

Posts:
2055
August 16, 2007

interesting point, i never actually thought of that.

Tobias Lütke - Shopify CEO // http://twitter.com/tobi
Posts:
15
August 16, 2007

The salient fact to remember is empirical data trumps polls. People/buyers do what they do. It’s hard enough getting people to a site, let’s give them every opportunity to buy.

Addison Member
Posts:
133
September 21, 2007

I added this to my site. How can I put some sort of notification that the product has been added to the cart. Maybe kind of like the shopify admin screen where it pops up a little bar at the bottom of the screen “Asset uploaded successfully”.

Posts:
5634
Last edited February 24, 2009

My jury was out on this for a few weeks.

Verdict arrived this morning:

Do not use this hidden field unless you’re able notify the buyer that the item was successfully added to the cart. Otherwise, it looks like the form is broken. Which makes you want to click one more time on that damn button.

How can I put some sort of notification that the product has been added to the cart. Maybe kind of like the shopify admin screen where it pops up a little bar at the bottom of the screen “Asset uploaded successfully”.

As we know, HTTP requests are stateless, and unless one uses a web cookie it’s hard to know after the submission if any add to cart action took place. So the trick is to assume beforehand that the submission will work.

Attach an event listener to the ‘submit’ event of your form. Run an animation when someone submits the form. Use a callback so that when the animation ends you then submit the form. Not sure how this would look.

Here is a notification jquery plugin: http://kitchen.net-perspective.com/open-source/purr/

[edit] Looks like we can’t use a callback with above plugin.

Caroline from http://11heavens.com ∴ mllegeorgesand AT gmail DOT com
Posts:
5634
Last edited February 24, 2009

This one plugin, jGrowl, does use a callback. It can execute code when the notification box has closed.

Use the close param.

Caroline from http://11heavens.com ∴ mllegeorgesand AT gmail DOT com
Posts:
145
February 24, 2009

I have been using the Showroom theme and I now hate it. The customer experience is very poor and as this thread points out may be confusing. Lots of sites are rushing to use Ajax “add to basket” code but we need to prove whether it improves conversion or not.

Currently redesigning with a clearer “add” device.

Jonathan

The Market Quarter http://www.marketquarter.com French Foie Gras and Food Hampers from London's Borough Market. Follow me @jonathanbriggs
Posts:
50
March 19, 2009

Hi Guys,

I’m trying to Implement the JGrowl plugin on my add to cart buttons.

Not sure if this is even possible because once the user clicks on “add to cart”, it redirects to the cart page, then back to the original page, not leaving much time for the growl notification. Is there a way around this?

Here’s the page : http://supermarchepa.myshopify.com/collections/all

Right now, it works as intended, but it would be great is I could avoid the redirect altogether.

Thanks a million

qtime Member
Posts:
42
March 24, 2009

that works! :-)

the address at the top of the page did not change.. were you able to fix the redirect issue?

for a site i am working on right now, we need to show an image saying “already in cart” if the item is already there.. perhaps the redirect would be the best for us to work with in that situation.

Posts:
50
March 24, 2009

I think it depends on how fast the shopify server is or your internet connection is at the time you add something to the cart. On my end, in optimal conditions, the whole process goes so fast that you hardly see the JGrowl notification before the page goes to the cart page and comes back immediately. Basically looking like one big flash in the end and as Caroline mentions above, the user may view this as the site being broken.

In my case, users will be buying many items at once so I want to avoid useless clicks like going back and forth the cart everytime they add something to their cart. This is what attracted me to the showroom theme in the first place but that had it’s own faults as well. I do have a cart quantity area next to the cart link (top-right) but I’m not sure if this is clear enough for all users.

In your case, I’m no coder at all, but what if you use what I currently have on my cart page, a text box with the current # ordered per item. Just a thought….

Log in or sign up for an account to reply.

This thread has been closed! You will not be able to reply.