terrymacsurfer

Hi Kirsty,

try this link for a detailed explanation of using the html version of the shortcode. Again, the width=100% should be used as a parameter of the thumbnail.

https://www.tipsandtricks-hq.com/wp-content/uploads/docs/wp-video-lightbox-plugin-usage-instructions.pdf

Regards

Terry

Hi Kirsty

same problem again.

Contact me on [email protected] and I’ll send the code in an email

Regards

Terry

Hi Kirsty,

The site has changed a lot since I last used it, but here is a link to using CSS to style the anchor image, which is what I think what you want to be responsive : https://lightbox.tipsandtricks-hq.com/wp-content/uploads/lightbox-ult-doc/lightbox-ultimate-fancy-anchor-styles.pdf

I don’t use shortcode the exact way they show in the examples, but do it in <a href tags. The ″ width=”640″ height=”480″ parameters you use are for the video display and can be set as a default in the Pretty Picture settings, so aren’t needed here unless each video will be a different size. I had this exact same problem to start with and I found the support on Video Lightbox to be very quick and very helpful, if this doesn’t solve your problem.

To make the thumbnail responsive in all situations, you need to add the “width=100%” parameter to the thumbnail image. I don’t use an auto thumb, but supply a url to my own image, so, leaving out the opening and closing <a href tags, my shortcode would be

opening tag =”https://www.youtube.com/watch?v=your reference here;rel=0″ rel=”wp-video-lightbox”> closing tag

Hope this helps with making your thumbnails responsive for mobile.

Regards

Terry

Sorry, the code is active, so tries to load a video. Best to look at options on Tips and Tricks pages, all the options are there.

Terry

Hi Kirsty

the following code is placed on the web page in the text section, not the visual and adding the 100% here will make the video completely responsive. See the Tips and Tricks pages for details of what all the options are: https://www.tipsandtricks-hq.com

“”

Regards
Terry

Hi Kirsty

the following code is placed on the web page in the text section, not the visual and adding the 100% here will make the video completely responsive. See the Tips and Tricks pages for details of what all the options are: https://www.tipsandtricks-hq.com

Regards
Terry

Apologies, bit of a facetious comment. I’ve noticed that some comments ask for features that you seem to incorporate within a short time. There are obviously lots of new features that would be really useful, so I just decided to add a small wish – a bit tongue in cheek.
It’s easy to add the play button to the source image, but a live overlay button would with hover function would be icing on th cake, especially if there were different versions that could be added through the Pretty Picture settings.
I won’t be surprised or upset if I don’t see this soon though )

There’s no need to edit the js, just add width=100% to the HTML code of the src image and it is completely responsive