Using Different Image Previews For Mobile and Desktop on WordPress

The player only gets one preview image, it isn’t possible to set different ones for mobile vs desktop, I’m afraid.

Hi,

In the html code, I was using:
image: (jwplayer.utils.isMobile()?”images/girism.jpg”:”images/girisd.jpg”)
to differentiate the images between mobile and desktop.

Is this code still legit and usable?

Can we use it with short-code as well?

Thanks a lot for your answer.

Yes, you can do that, for sure, but there isn’t a shortcode version of this.

Hi,

Can you help on its jawa form please.

I’ve tried to use:

<script>
jwplayer.utils.isMobile()?”images//wp-content/uploads/2015/01/Videoimage.png”:”images//wp-content/uploads/2015/01/Videoimage.png”;
</script>

But it isn’t working.

How can I add it as script?

Thanks a lot.

Do you have a link?

Hi,

The site is:
https://internetzengini.com/deneme/

I’m using autostart with no controls. I’ve added this code to JS:
jwplayer().onDisplayClick(function() { jwplayer().play(); });

And it works perfectly fine for start and stop on clicking video.

I use this one for differentiating the images:

jwplayer.utils.isMobile()?”https://internetzengini.com/wp-content/uploads/2015/02/mobileimage.png&#8221;:”https://internetzengini.com/wp-content/uploads/2015/02/desktopimage.png&#8221;;

But it’s not working.

jwplayer.utils.isMobile() is for a standard jw player setup. It won’t work with shortcode.

Hi,

I’m not using it in the shortcode. I’m trying to add it as JavaScript.

What’s the Java code for that differentiation?

The code should be:

jwplayer.utils.isMobile()?”image”:”https://internetzengini.com/wp-content/uploads/2015/02/desktopimage.png&#8221;;

That one didn’t worked. Can the notation be different? Because I couldn’t find any example like that.

The best way to do this would be to do a different set up entirely for mobile vs desktop.

if (navigator.userAgent.match(/iPad/i) != null || navigator.userAgent.match(/iPhone/i) != null || navigator.userAgent.match(/android/i) != null){
//SET UP PLAYER WITH ONE PREVIEW IMAGE HERE
} else {
//SET UP PLAYER WITH A DIFFERENT PREVIEW IMAGE HERE
}

I’m adding the player via shortcode, and I was able to start/stop on video clicking by using this code as Java:
jwplayer().onDisplayClick(function() { jwplayer().play(); });

Is there any way to format the code the same way, because it is easier for me to set it up as Java.

jwplayer.utils.isMobile() is for standard embed code.

It will not work with shortcode.

No, not as a shortcode. How can I use it as Java?

JavaScript.

The best way to do this would be to do a different set up entirely for mobile vs desktop.

if (navigator.userAgent.match(/iPad/i) != null || navigator.userAgent.match(/iPhone/i) != null || navigator.userAgent.match(/android/i) != null){
//SET UP PLAYER WITH ONE PREVIEW IMAGE HERE
} else {
//SET UP PLAYER WITH A DIFFERENT PREVIEW IMAGE HERE
}