Shopify themes, liquid, logos, and UX
currently my header is transparent on my homepage but color on hover and scrolldown. I also managed to make a separator bar under the header when scroll down, but i want it to show when hover, and also when i am on all the other pages. Does anyone know how to do this?
Solved! Go to the solution
This is an accepted solution.
Please try this way
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 </head>
{% style %}
sticky-header.header-wrapper:hover {
border-bottom: 1px solid white !important;
}
{% if template.name != "index" %}
sticky-header.header-wrapper.gradient.header-wrapper--border-bottom {
border-bottom: 1px solid white !important;
}
{% endif %}
{% endstyle %}
I hope this helps
Best,
Daisy
footer.footer,
.shopify-section.shopify-section-group-header-group.announcement-bar-section {
background: #252525;
}
did not work
this message pops up
This is an accepted solution.
Please try this way
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 </head>
{% style %}
sticky-header.header-wrapper:hover {
border-bottom: 1px solid white !important;
}
{% if template.name != "index" %}
sticky-header.header-wrapper.gradient.header-wrapper--border-bottom {
border-bottom: 1px solid white !important;
}
{% endif %}
{% endstyle %}
I hope this helps
Best,
Daisy
thank you so much, you have helped me alot today!
Learn what's possible with customizing Shopify Checkout beyond what's available out of...
By Shopify Feb 19, 20252m ago Learn the essential skills to navigate the Shopify admin with confidence. T...
By Shopify Feb 12, 2025Learn how to expand your operations internationally with Shopify Academy’s learning path...
By Shopify Feb 4, 2025