Plugin that only shows info on mobile device?

  • Hey everyone,

    I’ve been searching the web with no luck. Does anyone know of a plugin that shows certain embed codes only on mobile devices and excludes the embed from desktop devices?

    If not a plug in, then maybe a line of code that would accomplish this?

    Basically, I want to have a video only show up when it’s viewed on a mobile device and not be in the post when it is viewed on a desktop. Make sense?

    Any advice is appreciated. Thanks.

Viewing 3 replies - 1 through 3 (of 3 total)

  • You can use media queries in CSS to do that –

    https://developer.mozilla.org/en-US/docs/Web/Guide/CSS/Media_queries

    Thread Starter fdprod

    (@fdprod)

    Thank you for the link. I’m as CSS savvy as I probably should be. My eyes started to glaze over with all the info.

    Would I add the line of code to the CSS file and then add a short code to each post for the video to appear? Could you help me with a basic breakdown of how I would accomplish this?

    Thanks again.

    There’s a lot of more complicated things you can do (as that page referenced) but the most simple is based on width of browser window. Lots of responsive themes (including twentytwelve) use these. This CSS would hide the video (inside a div with the id of “myvideo”) if the browser window is wider than 600px:
    CSS – in the CSS file:

    /* Minimum width of 600 pixels. */
@media screen and (min-width: 600px) {
	#myvideo {
	   display: none;
	}
}

    HTML :

    <div id="myvideo">
video code goes here
</div>

    Note that older versions of IE won’t read media queries, so you may need a work around for that if you care.

Viewing 3 replies - 1 through 3 (of 3 total)
  • The topic ‘Plugin that only shows info on mobile device?’ is closed to new replies.