Take the 2-minute tour ×
WordPress Development Stack Exchange is a question and answer site for WordPress developers and administrators. It's 100% free, no registration required.

Is there a way I can not show something to mobile users? I have a floating social bar on my responsive theme, but it get in the middle of the content if I'm on my Android phone.

I don't want to use display:none, since the JS will still load. Is there a function I can use to only show the floating bar for desktops users, and not mobile ones?

Thanks in advance (:

share|improve this question
    
You can parse useragent and diable activation on match... –  Oleg Butuzov Nov 13 '12 at 21:44

2 Answers 2

up vote 2 down vote accepted

There is wp_is_mobile() function to conditionally display (or block) content for mobile users.

<?php if (!wp_is_mobile()) : ?>

    <!-- Stuff to hide from mobile users -->

<?php endif; ?>
share|improve this answer
    
Hmm, but with that i would show something. I want to hide something. –  Julian Fernandes Nov 13 '12 at 21:55
    
...then add an else in there to show content to non-mobile users. –  stealthyninja Nov 13 '12 at 22:32
    
@JulianFernandes Actually the exclamation mark ! denotes NOT which means if NOT mobile show x, y, z - so if your social bar function/content were wrapped inside the above conditional statement, then it would ONLY show itself if someone is NOT on a mobile device. This method is unreliable though, compared to a CSS media query as already shown. You could use JS itself to verify the media/width of the device before conditionally loading/including the JS that handles the social bar but personally, to simplify the issue, I'd just minify the plugin bar JS file and use a media query. –  userabuser Nov 13 '12 at 23:09
1  
@userabuser Thanks for the explanation! I'm not a php guy, so i did not knew about that. Helped me out a lot :) –  Julian Fernandes Nov 13 '12 at 23:39
1  
@userabuser Done! :) –  Julian Fernandes Nov 14 '12 at 9:46

Yes. Using CSS won't prevent JS from loading generally but it's more reliable than server side sniffing. Depends on project but I would go with media queries to just hide it or bring it in page's content flow.

@media (max-width: 768px) {
  .sticky-social {
    display: none;
  }
}
share|improve this answer
    
Guess i will hide it with CSS and show a horizontal social bar for mobile users with is_mobile. Thanks anyway :) –  Julian Fernandes Nov 13 '12 at 21:56

Your Answer

 
discard

By posting your answer, you agree to the privacy policy and terms of service.

Not the answer you're looking for? Browse other questions tagged or ask your own question.