How to hide widget for mobile users?


#1

Hai i am gowtham i am new to this forum. i am new blogger, i want to hide one particular widget for mobile users, how to do this? i am using blogger.com i have tried this mobile=‘no’ but this is not working. please help me. any help would be appreciated also tell me how to show widgets only to mobile users


#2

In addition to CMS, you may want to consider putting the style in an external stylesheet and assign the style to the id, like this:

@media (max-width 480px) {
 #widgetid {
display: none;
}    
}

Some time we need to add like this coz of css conflict.

@media (max-width 480px) {
#widgetid {
display: none !important;
}

}

In JavaScript

function toggleDisplay(id, displayvalue)
{    
    if ( displayvalue == "others" ) {
         document.getElementById(**Widget ID**).style.display = 'block';
    } else {
         document.getElementById(**Widget ID**).style.display = 'none';
    }
}

One of the classes available in CSS Browser Selector is actually mobile, so you could target your widget disregarding the media query on max-width that is not conclusive:

html.mobile #widget id { display: none; }

#3

where are you putting mobile=‘no’ :question: a screenshot would help.


#4

@mybloggertricks Yes it’s possible to hide any section by using “display:none” but “isMobileRequest” is better than “display:none”. I think you should always use this conditional tag.

<b:if cond='data:blog.isMobileRequest == "false"'> HTML or JavaScript Tag </b:if>

#5

you can do it as in just 1 step check it out here Mobile View Settings


#6

@GowthamVpm just put these lines in your widget section <b:if cond='data:blog.isMobileRequest == "false"'> HTML or JavaScript </b:if>