Discount Bar at top of Product Page

Store Design
, ,

Topic summary

A store owner is experiencing an issue where a coupon/discount bar briefly appears at the top of product pages before disappearing, and wants to remove it completely.

Proposed Solutions:
Multiple developers offered CSS-based fixes to hide the discount bar element:

  • Method 1: Add CSS code to the theme.scss.css file targeting #countdown_container with display: none !important

  • Method 2: Insert CSS code in the theme.liquid file before the </head> tag, targeting div#countdown_container.dtimer with display: none !important

All solutions follow a similar approach: accessing the theme code editor through Shopify Admin and adding CSS to permanently hide the countdown/discount container element. The issue appears to be a visibility timing problem with a promotional banner component that can be resolved through custom styling.

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

The coupon bar at the top appears for a second then goes away, How can I fully remove?

Thanks so much.

https://suzannebartonfineart.com/collections/abtracts/products/koi-pond

or here

https://suzannebartonfineart.com/collections/aqua-essence/products/through-the-looking-glass-iv

2

Go to your online store → edit code → look for this file “theme.scss.css”
and paste this code in start of this file

#dcounter_container{
display: none !important;
}
3

You can try this code by following these steps:
Step 1: Go to the online store ->Theme ->Edit Code.
Step 2: Find the theme.liquid file and add the following code before the tag

Result:

AnneLuo_0-1731457078234.png
AnneLuo_0-1731457078234.png1295×373 140 KB

Hopefully it will help you. If yes then Please don’t forget hit Like and Mark it as solution!

4

Hi @SuzanneBarton

This is Richard from PageFly - Shopify Page Builder App

Please add this code to your theme.liquid above the to get this solved

Step 1: Online Stores > Themes > More Actions > Edit code

Step 2: click on theme.liquid and paste the code above the

Hope this can help you solve the issue

Best regards,

Richard | PageFly

5

Hi @SuzanneBarton

In order to fulfill your request, please follow these steps

Step 1: Go to Shopify Admin → Online Store ->Theme → Edit code
Step 2: Search file theme.liquid
Step 3: Insert this code above 

{% style %}
div#dcounter_container.dtimer {
    display: none !important;
}
{% endstyle %}

I hope this helps

Best,

Daisy