Sizing of WebHelp YouTube Videos

Please post all questions on Help+Manual 8 here

Moderators: Alexander Halser, Tim Green

Post Reply
User avatar
Sheri Steeves
Posts: 146
Joined: Tue Aug 05, 2008 5:06 pm
Location: Ottawa, Ontario,CANADA
Contact:

Sizing of WebHelp YouTube Videos

Unread post by Sheri Steeves »

Hi,

I'm trying to make our webhelp to be more responsive and have some questions about the YouTube Media link.

Is there any way to have a media link set to size as 100% of the page size but only up to a maximum size, like the % of page width, maximum is physical size option for screenshots?

Right now when I'm full screen on a desktop, the web media image is huge. I know I can set it to a lower percentage, then it seems so much smaller when viewed using mobile emulation or on my phone/tablet.

Thanks,

Sheri
User avatar
Tim Green
Site Admin
Posts: 23156
Joined: Mon Jun 24, 2002 9:11 am
Location: Bruehl, Germany
Contact:

Re: Sizing of WebHelp YouTube Videos

Unread post by Tim Green »

Hi Sheri,
Is there any way to have a media link set to size as 100% of the page size but only up to a maximum size, like the % of page width, maximum is physical size option for screenshots?
This isn't possible in that way. The only option there is to set a smaller percentage and use the lightbox option instead of having the video play inline. That way you get a reasonably-sized placeholder image with a video also playing in a reasonable size on all devices, because the lightbox will scale to the size of the current window.
Regards,
Tim (EC Software Documentation & User Support)

Private support:
Please do not email or PM me with private support requests -- post to the forum directly.
User avatar
Sheri Steeves
Posts: 146
Joined: Tue Aug 05, 2008 5:06 pm
Location: Ottawa, Ontario,CANADA
Contact:

Re: Sizing of WebHelp YouTube Videos

Unread post by Sheri Steeves »

TIm,

Unfortunately the powers that be do not want the lightbox; I may have to go with the percentage for now.

Is there anyway to customize the CSS or styles for this, override it somehow? I looked the the embed tab but that didn't seem to have anything to do with styling, just the iframe hosting the video.
User avatar
Tim Green
Site Admin
Posts: 23156
Joined: Mon Jun 24, 2002 9:11 am
Location: Bruehl, Germany
Contact:

Re: Sizing of WebHelp YouTube Videos

Unread post by Tim Green »

Sheri Steeves wrote: Tue Mar 01, 2022 3:56 pm Unfortunately the powers that be do not want the lightbox; I may have to go with the percentage for now.
Okay, tough noogies. 8)
Is there anyway to customize the CSS or styles for this, override it somehow? I looked the the embed tab but that didn't seem to have anything to do with styling, just the iframe hosting the video.
Please don't mess with it.
Regards,
Tim (EC Software Documentation & User Support)

Private support:
Please do not email or PM me with private support requests -- post to the forum directly.
User avatar
Martin Wynne
Posts: 2656
Joined: Mon May 12, 2003 3:21 pm
Location: West of the Severn, UK

Re: Sizing of WebHelp YouTube Videos

Unread post by Martin Wynne »

Sheri Steeves wrote: Mon Feb 28, 2022 8:28 pmIs there any way to have a media link set to size as 100% of the page size but only up to a maximum size, like the % of page width, maximum is physical size option for screenshots?
Hi Sheri,

You can do that if you enter the YouTube code manually into the topic using the Insert HTML Code Object function.

Insert something like this:

Code: Select all

<div style="max-width:1600px;">
<div style="position:relative; width:100%; height:0; padding:0 0 56.25% 0; overflow:hidden;">
<iframe style="position:absolute; left:0; top:0; width:100%; height:100%; border:0;"
  src="https://www.youtube-nocookie.com/embed/LNvZY6cOijo?rel=0&wmode=opaque&start=0"
  frameborder="0" allowfullscreen="true" scrolling="no" width="100%" height="100%"></iframe>
</div>
</div>
n.b. Important: tick the box below the HTML editor to not include the code in a block tag.

The YouTube video will scale up and down on different screens and devices, but won't go wider than you set for max-width on the top line. Edit it to whatever you want. It won't be in a lightbox, just inline on the page.

The 56.25% setting is for the usual 16:9 video aspect ratio. Change it if your video has a different aspect ratio.

Edit the src= YouTube URL accordingly. The nocookie version of the YouTube URL restricts the number of tracking cookies YouTube puts on your users' computers. The rel=0 setting prevents YouTube showing random video links at the end of your video.

cheers,

Martin.
User avatar
Sheri Steeves
Posts: 146
Joined: Tue Aug 05, 2008 5:06 pm
Location: Ottawa, Ontario,CANADA
Contact:

Re: Sizing of WebHelp YouTube Videos

Unread post by Sheri Steeves »

Martin,

Thanks for the information, will definitely test it out. I was sort of on the right track with putting the html code in manually, I just tried the Embed tab on the Media object; completely forgot about the embedded HTML.

Sheri
Post Reply