Always show 'Add to Shopping Bag' button — quick CSS help

[douglance1]

Hey SwiftIdeas!

I’d like to always show the Add To Shopping Bag button div because I am using an External Retailers plugin and the external retailer drop down doesn’t display until the Add to Shopping bag button is displayed. I find the hidden button confusing for usability as well. Could you please help me out with the CSS changes I’d need to make this happen. I’ve looked through Firebug and can’t find the specific location to edit. Thanks guys!

All the best,

Doug

[douglance1]

Your attention requested. Thank you.

[Melanie – SUPPORT]

Your patience required 🙂

We aim to respond to all posts within 48 hours (Monday-Friday), but in most cases we usually manage to reply less than 24 hours. We work on the oldest topic first, so adding a new comment will take you to the back of the queue. We do also try our best to reply on weekends if we have time.

Where are we talking about? The shop overview or the shop single item pages for variable products?

[douglance1]

The single item page for variable products.

I’d like the “Add to shopping bag” button (and everything with it) to be displayed at all times, instead of only after options are selected.

[Melanie – SUPPORT]

.single_variation_wrap {
display: block!important;
}

Cheers!

[douglance1]

That is a step in the right direction. Unfortunately, it does not fully solve the issue. It hides the add to shopping bag button, then revels it; which is a bad customer experience.

Please see this product: http://www.fictionmagazines.com/shop/nebula-issues/nebula-rift-vol-01-no-12/

With your CSS, it still hides the “Purchase from Retailer” button until a format is selected as well.

I want to set it up so the whole thing is visible from when the page first loads.

[Melanie – SUPPORT]

Hm, I see what you mean, I tested on my installation but always have that blinking effect. I will ask the developer.

by the way I wouldn’t consider it a good usability to have the button visible before them having a variation selected, since the add to cart button won’t work.

I’ll be subscribed to this thread so I get notified about Ed’s response.

Cheers!

[Swift Ideas – Ed]

Hi there,

Even though it’s possible to override the button being hidden, it doesn’t make sense – the user won’t be able to add to cart without selecting the variation.

If you want the button to be shown when the user hits the page, all you need to do is set a default variation in the product set up – that way the button will show as an option is selected.

Hope that helps.

– Ed