CSS to hide Add To Cart buttons, but still show product options & pricing.

[DanL]

DanL

August 31, 2016 at 10:15 pm

Ben,

The CSS below worked to remove all Add To Cart buttons, but it also hid the variable selections/drop-downs on the individual product pages. I want to hide the Add To Cart buttons everywhere (shop and category pages, related items, anywhere Add To Cart appears) but I also want users to be able to still choose options to see the various pricing for each option-combination on the individual product pages. I just don’t want them to be able to Add To Cart.

Is there a variation on this CSS that displays the variation options (drop-downs on individual product pages) while still hiding the Add To Cart button? Maybe an override using the ‘important’ directive in CSS or something like that?:

.product_item .kad_add_to_cart, div.product form.cart{
display:none;
}

Also, is there some CSS that can be added for the addition of a text line (maybe even simply HTML with a link, etc. – not sure what’s all doable with just CSS) in place of the Add To Cart button on the individual product pages, such as: ‘Online purchasing will be coming soon! Feel free to continue to browse our catalog. Please call 1-800-PRODUCT for more information or to make a purchase over the phone.’? (This would just appear globally for all individual produce pages in place of the Add To Cart button.)

Thanks in advance!
-Dan