How to reduce size of announcement bar? -spotlight theme

Nikxj44 · ‎05-19-2024

So, I have strange issue, on "contact" page announcement bar is unusual size, on other pages it's normal, how to fix this issue? I will attach screenshots.

Also, on shopify Admin page issue disappears. But on actual website Its incorrect.

website : https://kartbagrationvalley.com/

Passwod: KBV

Nikxj44 · ‎05-19-2024

Also strangely issue disappears on my laptop and mobile version, I have this issue only on my pc. What can cause such a issue?

PageFly-Noah · ‎05-19-2024

This is Noah from PageFly - Shopify Page Builder App

Please add code here to fix it:

Step 1: Online Stores > Themes > Edit code

Step 2: Choose file theme.liquid
Step 3: Add code above the tag </body>

<style>
.utility-bar {
    height: 30px !important;
}
</style>

Hope my solution will help you resolve the issue.

Best regards,

Noah | PageFly

Please let me know if it works by giving it a Like or marking it as a solution!

PageFly - #1 Page Builder for Shopify merchants.

All features are available from Free plan. Live Chat Support is available 24/7.

Dan-From-Ryviu · ‎05-20-2024

Hi @Nikxj44

You can solve it by adding this code to theme.liquid file, after <head> in Online Store > Themes > Edit code

<style>
.utility-bar { height: auto !important; }
</style>

- Found this helpful? Hit "Like" and "Accept as Solution"! - Feeling generous. ☕ Buy me coffee!
- Reton: Loyalty & Rewards - Earn points through tasks, redeem for discounts, and enjoy exclusive VIP rewards!
- Ryviu - Reviews & QA app: Collect product reviews, import reviews from AliExpress, Amazon, Etsy, Walmart, Shopee, Dhgate and CSV.
- Lookfy Gallery: Lookbook Image - Gain customers with photo gallery, video & shoppable image
Built for Shopify

Reelfy‑Shoppable Videos+Reels: Create shoppable videos to engage customers and drive more sales.
- En...Sign up now.

ZestardTech · ‎05-20-2024

Hello There,

1. In your Shopify Admin go to online store > themes > actions > edit code
2. Find Asset > base.css and paste this at the bottom of the file:

.utility-bar.color-scheme-4.gradient.utility-bar--bottom-border {
height: 32px;
}

Want to modify or develop new app, Hire us.
If helpful then please Like and Accept Solution .
Email: support@zestard.com
Shopify Apps URL :- https://apps.shopify.com/partners/zestard-technologies
Custom Modifications Into Shopify Theme | Shopify Private App | SEO & Digital Marketing

How to reduce size of announcement bar? -spotlight theme

How to reduce size of announcement bar? -spotlight theme

Community Blog Articles