• Hi,

    I’m using the wordpress plugin and add videos using the below short-code. My question is If I use image=”…” code, the player shows the same preview for both mobile and desktop. I want to use different image previews.

    In the below format, how can I use different image previews for mobile and desktop?

    [jwplayer aspectratio=”16:9″ width=”100%” autostart=”true” primary=”flash” controls=”false” sources=”{ file:’rtmp://xxx.cloudfront.net/cfx/st/mp4:xxx.mp4′ },{ file:’http://xxx.s3.amazonaws.com/xxx.mp4′ }”]

    Thanks a lot for the answer.

    https://wordpress.org/plugins/jw-player-plugin-for-wordpress/

Viewing 15 replies - 1 through 15 (of 15 total)
  • Plugin Author JW Player

    (@longtail-video)

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

    Thread Starter JayLo13

    (@jaylo13)

    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.

    Plugin Author JW Player

    (@longtail-video)

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

    Thread Starter JayLo13

    (@jaylo13)

    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.

    Plugin Author JW Player

    (@longtail-video)

    Do you have a link?

    Thread Starter JayLo13

    (@jaylo13)

    Hi,

    The site is:
    http://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()?”http://internetzengini.com/wp-content/uploads/2015/02/mobileimage.png&#8221;:”http://internetzengini.com/wp-content/uploads/2015/02/desktopimage.png&#8221;;

    But it’s not working.

    Plugin Author JW Player

    (@longtail-video)

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

    Thread Starter JayLo13

    (@jaylo13)

    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?

    Plugin Author JW Player

    (@longtail-video)

    The code should be:

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

    Thread Starter JayLo13

    (@jaylo13)

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

    Plugin Author JW Player

    (@longtail-video)

    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
    }

    Thread Starter JayLo13

    (@jaylo13)

    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.

    Plugin Author JW Player

    (@longtail-video)

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

    It will not work with shortcode.

    Thread Starter JayLo13

    (@jaylo13)

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

    Plugin Author JW Player

    (@longtail-video)

    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
    }

Viewing 15 replies - 1 through 15 (of 15 total)
  • The topic ‘Using Different Image Previews For Mobile and Desktop on WordPress’ is closed to new replies.