Dont show widgets in responsive mode

Author Message

Posted: 3/6/2014
Quote message 

how do you not show any widgets in sidebars
or top/bottom/footer
when site is viewd in responsive mode for a phone...

as in main site i have 4 top / 4 bottom widgets that i use for
linking to content on my site with 125x125 images
and i dont want them showing in the site on a mobile phone
as you have to scroll down loads to pass them and the
sidebar widgets bfore you see the main site home page content.

Artisteer Team

Posted: 3/7/2014
Quote message 

If you want to disable the whole sidebar from the responsive view, then add the following code to the end of your style.css file:
.responsive .art-sidebar1 {
display: none;

If you have 2 sidebars, then use this code as well:
.responsive .art-sidebar2 {
display: none;

If you want to disable only some specific widgets, than you need to know their IDs.

For this right click on that widget from your front-end and choose "Inspect Element" option:

I've marked IDs of widgets that I have on my end.
You'll see the same IDs.

Now, if you want to disable, let's say "Categories" widget from the responsive view, use this code for that:
.responsive #categories-3 {
display: none;

This code for the login widget:
.responsive #loginwidget-5 {
display: none;

and so on. All code has to be added to the end of style.css file.

Please let me know if something is not clear to you.