Shopify themes, liquid, logos, and UX
Hello,
I would like the banner image to overlay with the header menu, ideally only on desktop, on my website. I am using the latest version of Dawn and would like to have something like this. I've tried other codes suggested in the forum but have not made it to work yet. Would you please help me out?
My store url is tiendamd.com and the password is nZFCxqqW
Thanks very much and best regards,
<style>
@media only screen and (min-width: 749px){
sticky-header.header-wrapper.color-scheme-1.gradient {
background: transparent;
}
sticky-header.header-wrapper.color-scheme-1.gradient header.header.header--middle-center.header--mobile-center.page-width.header--has-menu.header--has-social.header--has-account {
background: transparent;
}
section#shopify-section-template--17417908945078__image_banner {
margin-top: -115px;
}
}
</style>
result:
Thanks very much Gutenplayer! It is working perfectly! I just have another issue: is it possible to make the color of the header menu (not any of the submenus) white? Additionally, is there a way to have icons instead of text in the header for mobile only? Thank you very much!
Best regards
Hi @TiendasMD
Please add this code to theme.liquid file
{% if template == 'index' %}
<style>
@media (min-width: 750px) {
body .header-wrapper { background: transparent; }
body .header-wrapper .header__icon .icon,
body .header-wrapper .list-menu__item {
color: #fff;
}
}
</style>
{% endif %}
- Helpful? Like and Accept solution! OR Buy me coffee ❤️
- Ryviu - Reviews & QA app: Collect product reviews, import reviews from AliExpress, Amazon, Etsy, Walmart, Shopee, Dhgate and CSV.
- Lookfy Gallery: Lookbook Image: Easy and fast to create Photo Gallery, Lookbook, Shop The Look.
- Ryviu: Aliexpress Reviews - AliExpress Reviews Importer, one-click import aliexpress reviews, export reviews to CSV file.
- Reelfy‑Shoppable Videos+Reels: Create shoppable videos to engage customers and drive more sales.
- Enjoy 1 month of Shopify for $1. Sign up now.
The year-end shopping spree is around the corner! Is your online store ready for the ...
By JasonH Nov 10, 2024We recently spoke with Zopi developers @Zopi about how dropshipping businesses can enha...
By JasonH Oct 23, 2024A big shout out to all of the merchants who participated in our AMA with 2H Media: Holi...
By Jacqui Oct 21, 2024