Cannot close my menu on mobile/tablet/responsive

edited January 2017 in Theme support
Hello guys!

I love the BeTheme Options ->Responsive -> Header -> Style Side Slide. However, if we open the menu the cross to close the menu does not exist anymore. It is blocked by the side wide store message from woo commerce. Can you please help us fix this?

1. Is there a way to move it below the message on the phone/tablet?
2. If it is impossible to have side slide with the message on WooCommerce, can we have CSS to hide the message on phones/tablets but keep it on other devices? :)

It is so amazingly beautiful and functional, it'd be so great if I could just close the menu also like you can without the message.

Thank you so much for this amazing help! :)

Comments

  • edited January 2017
    Yeah it is definitely the WooCommerce Side Wide message that is causing it. When I disable this it works again. So is there any way to make the two work together or to disable it from phone/tablet as worst case? 
  • Hi,

    please show us on the screenshot what exactly you want to remove and also please send us link to page where you faced issue.
  • Of course, my bad. Sorry! :)


    We just need an option to close the menu on phones/tablets/responsive. The WooCommerce message seems to interfere with it. Whenever we turn off the message from WooCommerce, the button appears. Is there a way to make them work together and if not, can we turn off the WooCommerce for tablets and phones only? :)
  • Ok, we checked your site but we didn't noticed anything wrong and side mobile menu can be easily closed on mobile. We didn't found anything wrong between the button and WooCommerce message.
  • Thank you so much for looking into it.

    I have had three people check now, and none of us can close it with the icon. We all see the same as on the picture I sent you.

    What phone are you using? It also does not work on an iPad 4.
  • We checked on iPad 3, 4 and iPhone5 and 6 and Samsung Galaxy and on each we can close the menu by clicking in any place out of the menu. However, if something does not work on your end as you wish, then you need to remove WooCommerce stripe from the top of site.
  • Hello. Yes you can click outside to close the menu, but there is normally an X in the corner. Most customers don't know how to just click outside, so they need some sort of X. Your menu without the WooCommerce has the X which works perfectly. 

    Is it possible to have code to hide the WooCommerce Stripe from the top of the site on phone+tablet? :) We don't want it gone on desktop, because there's no such menu there. :) 
  • So if you mean to display X, you need to remove the WooCommerce Stripe because there is no other way to show it. To get this stripe rid off the smaller screens, you can try to use the following css:
    @media only screen and (max-width: 1239px) {
        p.demo_store { display: none !important; }
    }
    but please notice that we can not guarantee if it would work as you expect.
  • Hello!

    Thanks so much. We actually figured out the problem. The X is there in the WooCommerce Stripe it is just gray like the stripe, so you cannot see it. So we just need to change the color of the X to white. How do you change the color? I looked in BeTheme Options color, but see nothing for the close menu button? :) 
  • It's color can be changed with custom css only:
    #Side_slide .close-wrapper a.close { color: #FFF !important; }
  • Hmm okay, so the WooCommerce thing seems to just bug it. We tried the color change and it won't work. We added the code below, and it fixes the menu. But now there is a white area above everything where the stripe was before that's empty, is there no way to just remove it completely from phones? :) 

    @media only screen and (max-width: 1239px) {
        p.demo_store { display: none !important; }
    }
  • Sorry but we do not have any other solution to make it possible.
Sign In or Register to comment.