Solved

Adding an image background to mobile navigation menu (craft theme)

Iwells0130
New Member
6 0 0

I want to add an image behind the navigation menu list on mobile only that takes up the entire width and height of the background. Any thoughts on how to do this?

 

website: freakthecompany.com

 

Iwells0130_0-1700520449060.png

 

Accepted Solution (1)

ZenoPageBuilder
Shopify Partner
1052 203 217

This is an accepted solution.

Hello @Iwells0130 👋

Inside Shopify Admin, you can go to Edit theme code, open file base.css and add this code at the bottom

#menu-drawer {
    background-image: url(https://img.freepik.com/free-vector/hand-painted-watercolor-pastel-sky-background_23-2148902771.jpg);
    background-size: cover;
    background-position: center;
}

The result

Screenshot 2023-11-21 at 08.16.51.png

Hope that helps!

Zeno Page Builder - Build responsive & SEO-optimized Landing pages, Blog posts, Product pages and more...
Learn more at zenobuilder.com

View solution in original post

Replies 2 (2)

ZenoPageBuilder
Shopify Partner
1052 203 217

This is an accepted solution.

Hello @Iwells0130 👋

Inside Shopify Admin, you can go to Edit theme code, open file base.css and add this code at the bottom

#menu-drawer {
    background-image: url(https://img.freepik.com/free-vector/hand-painted-watercolor-pastel-sky-background_23-2148902771.jpg);
    background-size: cover;
    background-position: center;
}

The result

Screenshot 2023-11-21 at 08.16.51.png

Hope that helps!

Zeno Page Builder - Build responsive & SEO-optimized Landing pages, Blog posts, Product pages and more...
Learn more at zenobuilder.com
Iwells0130
New Member
6 0 0

That worked! Thank you so much 🙂