Hide a specific pop-up block in product page if inventory is above zero

Store Design

Topic summary

A Shopify store owner using the Dawn theme wants to conditionally hide a specific pop-up block on product pages—displaying it only when inventory reaches zero, and hiding it when stock is available.

Proposed Solutions:

  • One suggestion involves adding CSS code to the base.css file to hide the .product__accordion element using display: none;. However, this approach would hide the element universally rather than conditionally based on inventory levels.
  • GemPages support team requested the product URL to examine the issue and provide a tailored recommendation.

Current Status:
The discussion remains open. The user provided a sample out-of-stock product link for further analysis, but no inventory-conditional solution has been confirmed yet. The CSS-only approach does not address the dynamic inventory requirement.

Summarized with AI on November 24. AI used: claude-sonnet-4-5-20250929.
1

Hi all,
I am using Dawn theme in shopify. i want to hide the highlighted popup block in product page when my inventory is above zero on the product. Let me know if its possible

Store : levendonline.com

Cszpture.JPG
Cszpture.JPG1912×925 99.1 KB

2

Hello @zaan :waving_hand:

Inside Shopify Admin, go to Edit theme code, open file base.css and add this code snippet at the bottom

.product__accordion {
    display: none;
}

Hope that helps!

3

Hello @zaan ,

It’s GemPages support team and glad to support you today.

Could you please share your out-of-stock product URL then I can see and suggest something for you?

Best regards,
GemPages Support Team

4

Here is a link for a out of stock item

https://levendonline.com/products/3-5-aux-male-to-2-female-stereo-audio-splitter-cable-20cm-10738?_pos=1&_psq=10738&_ss=e&_v=1.0