CSS Help for Cartloom Storefront: Hide the Price

Classic General
1

I posted about this within another old thread, but I thought making it it’s own topic might get me some assistance, and help others with the same problem.

I’m using @yabdab’s Cartloom Storefront for an event that has many sessions requiring registration. The event is free to attend, so I want to hide the price, rather than have each session listed as $0.00. I cannot for the life of me figure out what CSS will hide the price. I’ve identified the element (I think) but that’s where I get stuck. I don’t know how to target that element in CSS, or how to make it display nothing instead. Any ideas?

(Cartloom is great for this kind of thing because the inventory tracking allows me to cap registration in any given session; allowing it to “sell out” once the registration is full.)

On a related note, I’m also interested in how to hide the “Add to Cart” button, so the site can function as a sort of catalog until registration officially opens, whereupon I would put the “Add to Cart” button back.

Thanks!

Continuing the discussion from Episode 10: RapidWeaver CMSs & upgrading to Stacks 3

2

@Fray Next Payloom update will offer “Catalog Mode”. Contact me via support and I can send you an early beta copy.

3

That’s great news! I’m excited to try it out. Thanks @yabdab for doing that!

Unfortunately, I’m in pretty deep with Storefront on my current project, and registration opens next Monday. Plus, I need the web-interface/CMS so other team members can administer, add products, etc.

It’s not a deal breaker if I can’t hide the price in Storefront; it would just make for a cleaner experience for registrants.

4

Hi,
Do you have a link to the live site so we can see it?

Thanks,
Stuart

5

Sure; it’s a work in progress, but here it is: https://sportcalgary.cartloom.com/shop/

(Details on the event are at allsportonecity.ca)

6

Try:

span.price.lead {
    display: none !important;
}

Put that in the CSS container for the page. Would probably be okay in the global CSS container too.

7

I don’t have access to that page’s CSS because it’s hosted via Storefront, not on my website. All I have access to is “Cart CSS” and “Checkout CSS” in Cartloom’s admin dashboard, where that script you posted won’t work. I think that element might be beyond the reach of the CSS I’m allowed to edit in Cartloom.

I used the “Live CSS Editor” extension in Safari on the live store page to test that code you provided, and sure enough, it works like a charm! I just can’t add it to the stylesheet on Cartloom’s backend.

Thanks for your help! What I’m looking for may not be possible currently. It’s a shame, though, because it seems just within reach…!

8

Ah… oh well, sorry it didn’t work out - thats a pity. I don’t know anything at all about Cartloom personally… though that may change in the near future!

Good luck!

9

Unrelated: yay calgary!

10

Ha ha! It’s a great city…!