Make YouTube Videos Responsive


Is it possible to make the YouTube videos on this site, such as the one below, resized smaller when viewed on a mobile device? I am using the WP Video Lightbox plugin.

Thanks in advance,


  • James Morris
    • WordPress Enthusiast

    Hello Casper,

    I hope you are well today.

    The trick with this plugin is to specify a width and height of 100%. This will make the image responsive.

    Here’s the shortcode I used:

    [video_lightbox_youtube video_id="qCwJPW78iEM" width="100%" height="100%" anchor="http://mytestsite.tld/wp-content/uploads/2017/03/wpmudevimage.png"]


    Desktop –

    Mobile –

    I hope this clarifies a bit. Let us know if you have any further questions. We’ll be happy to help! :slight_smile:

    Best regards,

    James Morris

  • Casper
    • Syntax Hero

    Hi James,

    I have this CSS in place to make the thumbnails larger on desktops.(They are pretty tiny if I don’t use it for some reason; perhaps due to the Connections Pro directory listing program I am using).

    If I make a media query so that this CSS is for desktops only and go with the 100% width would that do the trick for mobile displays?

    /*Increase Video Lightbox Thumbnail Size*/

    .wpvl_auto_thumb_box {

    width: 450px;

    height: 337px;


    /*Increase Video Lightbox Thumbnail Size*/

    .video_lightbox_auto_anchor_image {

    width: 600px;

    height: 450px;


    /*Move Video Lightbox Play Button*/


    left: 201px;

    top: 144px;


    Thanks in advance,


Thank NAME, for their help.

Let NAME know exactly why they deserved these points.

Gift a custom amount of points.