New Shopify Certification now available: Liquid Storefronts for Theme Developers

Mobile menu

Solved
Kostas_katal
New Member
9 0 0

Hello,


I would like your help with an issue that is bothering us


We have made our online store exactly how we wanted it to look,


The main problem we want to solve now is that,


When I'm on mobile, and open the menu, the banner continues to appear,

 

I would like the menu to appear 100% of the height and 50% of the width of the screen, above all,


Any solutions?


Site: https://www.petjoyfully.com

3.jpg

Accepted Solution (1)
PageFly-Henry
Globetrotter
519 132 107

This is an accepted solution.

Hi @Kostas_katal 

This is Henry from PageFly - Landing Page Builder App

 

You can try this code by following these steps: 

Step 1: Go to Online Store->Theme->Edit code.

Step 2: Search file base.css

Step 3: Paste the below code at bottom of the file -> Save

 

@media (max-width: 767px){

div#menu-drawer {

    width: 60% !important;

}}

 

Hope that my solution works for you.

Best regards,

Henry | 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.

View solution in original post

Replies 3 (3)
topnewyork
Explorer
153 22 19

Go customize > edited code > header.liquid and past this code

div#menu-drawer {
    height: 50vh !important;
}

 

Need a Shopify developer?
Hire us at topnewyorkwebdesign.com
For Shopify Design Changes | Shopify Custom Coding | Custom Modifications
Subscribe to our youtube channel
PageFly-Henry
Globetrotter
519 132 107

This is an accepted solution.

Hi @Kostas_katal 

This is Henry from PageFly - Landing Page Builder App

 

You can try this code by following these steps: 

Step 1: Go to Online Store->Theme->Edit code.

Step 2: Search file base.css

Step 3: Paste the below code at bottom of the file -> Save

 

@media (max-width: 767px){

div#menu-drawer {

    width: 60% !important;

}}

 

Hope that my solution works for you.

Best regards,

Henry | 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.

Kostas_katal
New Member
9 0 0

Hi,

 

It seems that the width is ok now, but the header still apear above the menu cart

Kostas_katal_0-1700037707650.png