[TS-VCSC-Spacer height=”20″]

YOUTUBE VIDEOS & PLAYLISTS

EASILY EMBED VIDEOS & PLAYLISTS FROM YOUTUBE

[TS-VCSC-Spacer height=”40″]

Visual Composer Extensions makes it easy for you to embed a YouTube video on your page. You can show the video in a lightbox or embed it directly. There are also a variety of triggers available to call the lightbox.

YouTube Video Features:

[TS-VCSC-Spacer height=”20″][TS_VCSC_Fancy_List list_type=”image” marker_image=”http://www.composium.krautcoding.com/wp-content/plugins/ts-visual-composer-extend/images/bullets/bullet_arrow_blue.png”]

Embed video or playlist directly into page via iframe or show in lightbox
Directly embedded video can have an image overlay (video will only be loaded after click or hover event to remove overlay)
Includes multiple trigger options for lightbox (image, buttons, icons, text only, custom code)
Player is provided and controlled by YouTube
Option to autoplay video
Set video start and end time (single video only)
Show/hide related videos at the end
Show/hide top video information bar
Use YouTube modest branding for player
Add tooltip to direct video or lightbox trigger

[/TS_VCSC_Fancy_List][TS-VCSC-Spacer height=”20″][TS_VCSC_Content_Export toggle_switch=”true” toggle_background=”#fe6e6e” clipboard=”true”]

[TS-VCSC-Spacer height=”40″]

[TS-VCSC-Spacer height=”20″]

SINGLE YOUTUBE VIDEOS

EASILY EMBED VIDEOS & PLAYLISTS FROM YOUTUBE

[TS-VCSC-Spacer height=”40″]

[TS-VCSC-Youtube content_youtube=”https://www.youtube.com/watch?v=csltI1qcgEw” height=”10″ content_tooltip_css=”true”]

[TS-VCSC-Youtube content_youtube=”https://www.youtube.com/watch?v=Fprp5Cz2BXI” content_lightbox=”true” content_youtube_trigger=”image” content_youtube_image=”21685″ content_youtube_title=”This is a Youtube Video” overlay_background=”rgba(24,24,24,0.3)” overlay_title_back=”rgba(0,0,0,0.4)” content_tooltip_content=”Click on the icon to view the Youtube video.” height=”10″ content_tooltip_css=”true”]

[TS-VCSC-Youtube content_youtube=”https://www.youtube.com/watch?v=ZNXwl5qQ2u4″ content_lightbox=”true” content_youtube_trigger=”winged” content_youtube_title=”This is a Youtube Video” content_youtube_subtitle=”Click to view the video” content_tooltip_content=”Click on the icon to view the Youtube video.” content_tooltip_css=”true”][TS-VCSC-Spacer height=”20″][TS-VCSC-Youtube content_youtube=”https://www.youtube.com/watch?v=QT_oTgLP1dE” content_lightbox=”true” content_youtube_trigger=”simple” content_tooltip_content=”Click on the icon to view the Youtube video.” content_tooltip_css=”true”][TS-VCSC-Spacer height=”20″][TS-VCSC-Youtube content_youtube=”https://www.youtube.com/watch?v=QT_oTgLP1dE” content_lightbox=”true” content_youtube_trigger=”flaticon” content_youtube_icon=”fa fa-youtube” content_youtube_buttonstyle=”ts-dual-buttons-color-alizarin-flat” content_youtube_buttonhover=”ts-dual-buttons-preview-pomegranate-flat ts-dual-buttons-hover-pomegranate-flat” content_youtube_title=”This is a Youtube Video” content_tooltip_content=”Click on the icon to view the Youtube video.” content_tooltip_css=”true”][TS-VCSC-Spacer height=”20″][TS-VCSC-Youtube content_youtube=”https://www.youtube.com/watch?v=QT_oTgLP1dE” content_lightbox=”true” content_youtube_trigger=”flat” content_youtube_buttonstyle=”ts-dual-buttons-color-orange-flat” content_youtube_buttonhover=”ts-dual-buttons-preview-carrot-flat ts-dual-buttons-hover-carrot-flat” content_youtube_title=”This is a Youtube Video” content_tooltip_content=”Click on the icon to view the Youtube video.” content_tooltip_css=”true”]

[TS-VCSC-Spacer height=”40″]

[TS-VCSC-Spacer height=”20″]

DIRECT EMBED WITH COVER

EASILY EMBED VIDEOS & PLAYLISTS FROM YOUTUBE

[TS-VCSC-Spacer height=”40″]

[TS-VCSC-Spacer height=”40″][TS_VCSC_Info_Notice panel_layout=”notice” panel_type=”info” panel_icon=”fa fa-info-circle” font_title_family=”Default:regular” font_content_family=”Default:regular”]

The following videos are directly embedded into the site via iFrame, but have an image overlay placed on top of it. The overlay will automatically be removed when clicking on or hovering over it. Optionally, a short text string can be added as well. Can be used for single video and playlist iFrame embeds alike.

[/TS_VCSC_Info_Notice][TS-VCSC-Spacer height=”20″]

Click Trigger

[TS-VCSC-Spacer height=”20″][TS-VCSC-Youtube content_youtube=”https://www.youtube.com/watch?v=csltI1qcgEw” content_overlay_use=”true” video_infobar=”false” video_modest=”true” lightbox_play=”true” content_overlay_image=”23483″ content_overlay_quality=”large” content_overlay_text=”SGFtYnVyZyUyMGluJTIwTW90aW9u” el_file=”” height=”10″ content_tooltip_css=”true”]

Hover Trigger

[TS-VCSC-Spacer height=”20″][TS-VCSC-Youtube content_youtube=”https://www.youtube.com/watch?v=csltI1qcgEw” content_overlay_use=”true” video_infobar=”false” video_modest=”true” lightbox_play=”true” content_overlay_image=”23484″ content_overlay_quality=”large” content_overlay_trigger=”hover” content_overlay_text=”SGFtYnVyZyUyMGluJTIwTW90aW9u” el_file=”” height=”10″ content_tooltip_css=”true”]

[TS-VCSC-Spacer height=”40″]

[TS-VCSC-Spacer height=”20″]

YOUTUBE PLAYLISTS

EASILY EMBED VIDEOS & PLAYLISTS FROM YOUTUBE

[TS-VCSC-Spacer height=”40″]

Predefined Playlist via ID

[TS_VCSC_Info_Notice panel_layout=”notice” panel_type=”info” panel_icon=”fa fa-info-circle” font_title_family=”Default:regular” font_content_family=”Default:regular” seperator_6=””]

The following playlist has been created on YouTube and is embedded simply by using the playlist ID as assigned by YouTube.

[/TS_VCSC_Info_Notice][TS-VCSC-Spacer height=”20″]

[TS-VCSC-Youtube content_type=”playlist” content_playlist=”http://www.youtube.com/playlist?list=PL2wGH1HeGNkUh78sWuByLgRcd79X-moC-“]

[TS-VCSC-Youtube content_type=”playlist” content_playlist=”http://www.youtube.com/playlist?list=PL2wGH1HeGNkUh78sWuByLgRcd79X-moC-” content_lightbox=”true” content_youtube_trigger=”image” content_youtube_image=”23488″ overlay_background=”rgba(24,24,24,0.3)” overlay_title_back=”rgba(0,0,0,0.4)”]

[TS-VCSC-Spacer height=”40″]

Dynamic Playlist via Search Term(s)

[TS_VCSC_Info_Notice panel_layout=”notice” panel_type=”info” panel_icon=”fa fa-info-circle” font_title_family=”Default:regular” font_content_family=”Default:regular”]

The following playlist is generated automatically by YouTube, using the search terms “Timelapse, Berlin”. Search playlists are limited by YouTube to 20 videos.

[/TS_VCSC_Info_Notice][TS-VCSC-Spacer height=”20″]

[TS-VCSC-Youtube content_type=”searchterm” content_search=”Timelapse, Berlin”]

[TS-VCSC-Youtube content_type=”searchterm” content_search=”Timelapse, Berlin” content_lightbox=”true” content_youtube_trigger=”image” content_youtube_image=”23488″ overlay_background=”rgba(24,24,24,0.3)” overlay_title_back=”rgba(0,0,0,0.4)”]

[TS-VCSC-Spacer height=”40″]

Manual Playlist via Video ID’s

[TS_VCSC_Info_Notice panel_layout=”notice” panel_type=”info” panel_icon=”fa fa-info-circle” font_title_family=”Default:regular” font_content_family=”Default:regular”]

The following playlist is generated automatically through YouTube, by manually providing the ID’s of up to 20 YouTube Videos, separated by comma.

[/TS_VCSC_Info_Notice][TS-VCSC-Spacer height=”20″]

[TS-VCSC-Youtube content_type=”combination” content_combination=”OiXctCR1YFA,l5sOpO4kz9s,MnvRa3pvn-k”]

[TS-VCSC-Youtube content_type=”combination” content_combination=”OiXctCR1YFA,l5sOpO4kz9s,MnvRa3pvn-k” content_lightbox=”true” content_youtube_trigger=”image” content_youtube_image=”23489″ overlay_background=”rgba(24,24,24,0.3)” overlay_title_back=”rgba(0,0,0,0.4)”]

[TS-VCSC-Spacer height=”40″]

Playlist via User Uploads

[TS_VCSC_Info_Notice panel_layout=”notice” panel_type=”info” panel_icon=”fa fa-info-circle” font_title_family=”Default:regular” font_content_family=”Default:regular”]

The following playlist is generated automatically through YouTube, by using the last 100 videos uploaded by a specific user, identified by user ID.

[/TS_VCSC_Info_Notice][TS-VCSC-Spacer height=”20″]

[TS-VCSC-Youtube content_type=”uploads” content_uploads=”photohod”]

[TS-VCSC-Youtube content_type=”uploads” content_uploads=”photohod” content_lightbox=”true” content_youtube_trigger=”image” content_youtube_image=”23490″ overlay_background=”rgba(24,24,24,0.3)” overlay_title_back=”rgba(0,0,0,0.4)”]

[TS-VCSC-Spacer height=”40″]