How do I remove the announcement bar in MrParker theme?

Store Design

Topic summary

A user seeks to remove the announcement bar from the MrParker Shopify theme but lacks the theme.css file mentioned in existing solutions.

Initial Solutions Provided:

  • Two responders offered CSS code to hide the announcement bar
  • First suggestion: Add code to stylesheet.css targeting .section.announcement-bar__wrapper
  • Second suggestion: Similar approach using stylesheet.css

Problem:
Both initial solutions failed to work when the user pasted the code at the bottom of stylesheet.css.

Working Solution:
PageFly-Richard provided an alternative approach:

  • Navigate to: Online Store → Theme → Edit code → theme.liquid
  • Paste CSS code in a <style> tag before the closing </body> tag
  • Code targets: section.announcement-bar__wrapper.device-hide.js-top-bar

Outcome:
The theme.liquid solution successfully removed the announcement bar. A later user reported the solutions didn’t work for them, suggesting results may vary by theme configuration.

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

Hi can someone please show me how to remove the announcement bar?

What code do i need? & where do i put it?

I’ve seen a few solutions saying to paste a code in theme.css but i do not have this file under my assets tab.

(I’m using the MrParker theme)

Thanks for your time/help.

1 Like
2

Hello There,

Please share your store URL and Password.
So that I will check and let you know the exact solution here.

3
1 Like
4

Hi @SoMaCa

I’m Richard Nguyen from PageFly- Free Landing Page Builder

You can try with this code.

Follow this:

Go to Online Store->Theme->Edit code->stylesheet.css ->paste bellow code in bottom of file

section.announcement-bar__wrapper.device-hide.js-top-bar {

display: none;

}

Hope that my solution works for you.

Best regards,

Richard | PageFly

5

Hello There,

  1. In your Shopify Admin go to online store > themes > actions > edit code
  2. Find Asset >stylesheet.css and paste this at the bottom of the file:
.aph_bar_bar {
display: none;
}

Screenshot :- https://prnt.sc/tEdC_ngo8k7Z

6

Hi Richard, I appreciate the response however that code did not work. i pasted it at the bottom of stylesheet.css.

7

Hi ZestardTech, I appreciate the response however that code did not work. I pasted it at the bottom of stylesheet.css.

8

@SoMaCa

You can try again with this code.

Follow this:

Go to Online Store->Theme->Edit code->theme.liquid->paste bellow code in tag

section.announcement-bar__wrapper.device-hide.js-top-bar { display: none; }

Please refer to this screenshot: https://prnt.sc/afpBHc_RJbvN

9

Thank you Richard, that code got rid of the bar. I appreciate it.

1 Like
10

you are welcome @SoMaCa :blush:

1 Like
11

Hello, i tried your solutions but it doesnt seem to work. Did i put it wrong?

kod.jpg
kod.jpg640×480 59.4 KB