Embed YouTube Video into Your eWaiver
It's simple to add a YouTube videos to your eWaiver, however YouTube videos do not resize by default and require a little extra code.
In order to ensure your videos will resize with all user's devices, please follow these instructions:
Inside of a Formatted Paragraph module in your eWaiver, please click the Source Code icon from the editor. Our clients tell us they prefer to add a new Formatted Paragraph module just for video so there isn't any confusion with the code, but that is not required.
COPY AND PASTE THIS CODE INTO THE SOURCE-CODE VIEW OF YOUR FORMATTED PARAGRAPH MODULE:
<code><div style="width: 100%; min-width: 300px; max-width: 800px; margin: auto;"> <div style="position: relative; width: 100%; overflow: hidden; padding-top: 56.25%;"> <p><iframe style="position: absolute; top: 0; left: 0; right: 0; width: 100%; height: 100%; border: none;" src="YOUTUBE EMBED LINK" width="560" height="315" allowfullscreen="allowfullscreen" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture"></iframe></p> </div> </div>
- After pasting this block of code, open your YouTube video in a new tab or window.
- Click SHARE, then EMBED from the options.
- Select only the Embed Link to your video, right-click and copy (the word embed will be in the link).
- Go back to the code inside your waiver template, highlight the words YOUTUBE EMBED LINK, right-click and paste the link you just coped from your video.
- It should change from: src="YOUTUBE EMBED LINK" to
src="https://www.youtube.com/embed/acbdefghijklmnop?1234567890" - Check and verify that the "quotes" are still on both sides of your link.
- It should change from: src="YOUTUBE EMBED LINK" to
- Save your eWaiver and test.
Example of final embed code:
<code><div style="width: 100%; min-width: 300px; max-width: 800px; margin: auto;"> <div style="position: relative; width: 100%; overflow: hidden; padding-top: 56.25%;"> <p><iframe style="position: absolute; top: 0; left: 0; right: 0; width: 100%; height: 100%; border: none;" src="https://www.youtube.com/embed/3YyyO1TUsDY?si=ix9pSx6Zu11zxuDz" width="560" height="315" allowfullscreen="allowfullscreen" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture"></iframe></p> </div> </div>
You can see this in action by viewing our demo eWaiver: https://ewaiverpro.app/edoc/attractions-simple