Follow the steps outlined below to embed a YouTube video within a custom responsive website designed by INSYTE:

  1. First observe the video at YouTube.com
  2. Beneath the video, click the Share link (as highlighed in yellow within the screenshot below)
  3. Wait for the these available choices: 'Share', 'Embed', and 'Electronic mail'
  4. Select the option labeled:Embed
  5. A text box with the <ifame> embed code volition display and is able to exist copied to the clipboard.
  6. Before coping the lawmaking, used the selectable options below the video to decide if you lot want suggested videos to testify upwardly after your video is finished. (Our recommendation is to plough this feature OFF, because yous cannot command the videos YouTube suggests, and sometimes they are irrelevant and inappropriate for your site.)
    1. To turn OFF the suggested videos, uncheck the checkbox next to 'Testify suggested videos when the video finishes', located under the video preview and beneath the 'Video size' choices. (When you click this, you should see slight changes in the <iframe> lawmaking offered in the textbox.)
    2. Use the Video size option to select the maximum size y'all want your video to be displayed in your website, by using the the Video Size dropdown carte.(Again, you will see slight changes here to the lawmaking provided.)
      How to embed YouTube Code
  7. Once you lot have the video preferences prepare the way you like them, click to select and utilize Ctrl-A to highlight ALL of the code provided in the text box as referenced in greenish <iframe> area ini the screenshot higher up.
  8. Copy the code to your clipboard by using: Ctrl-C
  9. Log into the CMS and scan to the page you wish to embed the video on.
  10. In the WYSIWYG on that page, click the Source push button (It is the very first button in the WYSIWYG as displayed in the screenshot below.) Clicking the Source push, the HTML source code is displayed, which produces what is displayed on that page.
  11. Within the code, try to reference textual content tolocate the best spot to embed the video.
    YouTube Embed Code in iFrame
  12. Paste the code by using: Ctrl-V

Add the responsive video embed lawmaking: Required to allow the video to display properly on any size screen or mobile device.

Video Wrapper in DIV Span

  1. Paste the following lawmaking before the YouTube embed code: <div course="videoWrapper" style="text-align: center;">
  2. Paste the following code afterward the YouTube embed lawmaking: </div>
  3. Click Source once again.
  4. If you lot have done this right, you will meet a white box with the phrase "IFRAME" inside it in red, after yous click the Source push button.
  5. You can employ the WYSIWYG buttons to center the video or motility it to the right or move it up and downwards if you wish. (The video volition show upwards in the IFRAME box, just some website may have a CSS manner that can over-ride the style related to how the responsive YouTube video can be displayed within the pages of websites adult by INSYTE eCommerce.)
  6. Click Save to publish the changes to the page.
  7. Later saving the changes,preview to the page live by navigating to the page where the video is on the site, and likewise be sure test the how the video displays on unlike size screens and devices. It is also a proficient thought to watch the new video on your site all of the way through to see if the suggested videos show upwards or if the video just starts over. (Go on in mind the settings selected at YouTube, volition cause the video on your website to carry as such.)

Please contact the INSYTE support team at present if yous have any questions or issues while peforming any operations outlined higher up.