Hide On Mobile

Hi shapers!
I don’t know any easy way to recognize device type, but it’s fairly easy to recognize browser screen width and hide the panel based on that information.

If that works for you, you may try it: Add the following code to your theme style.css or the CSS setting area in Admin settings:

@media screen and (max-width: 800px) {
mojo-sp-left-wrap {
display: none !important;
}

mojo-sp-right-wrap {
display: none !important;
}
}

So, when browser screen width is 800 pixels or less the panel is hidden. Fine tune the number for your needs.

I didn’t test the code myself but it should work…

Hi,
I tried but it doesn’t work for me!

Worked for me, you have to add # in front of the mojo’s
However when loading the site it comes up with 2 errors (one for left and for right), do you know how to disable this error?

Thanks!

shapers, you are right, I forgot # in front of the tags:

@media screen and (max-width: 800px) {
#mojo-sp-left-wrap {
display: none !important;
}

#mojo-sp-right-wrap {
display: none !important;
}
}

shapers, what type of errors do you get? If you are talking about warning pop-ups with text “MojoPlug warning: This page contains element(s) blocking visibility…” there is a separate discussion with subject “MojoPlugin Warning – Off/On”. Check it out…