Можете да вграждате видеоклипове от YouTube директно в страниците на DevSite, като използвате персонализирания елемент <devsite-video> . Всички видеоклипове са отзивчиви и поддържат съотношение 16:9 при промяна на ширината на прозореца за изглед.
За да вградите видеоклип в YouTube, добавете персонализиран елемент <devsite-video> към вашата страница и задайте атрибута video-id на стойността на v URL параметъра за видеоклипа.
Например, за да вградите видеоклипа в YouTube „Your First Script – Apps Script Tutorials“, който можете да намерите на https://www.youtube.com/watch?v=Pgfbl_o9WvM , добавете следния персонализиран елемент <devsite-video> към вашия Страница DevSite:
<devsite-video video-id="Pgfbl_o9WvM"></devsite-video>
След това обвийте персонализирания елемент <devsite-video> в елемент <div> , чийто атрибут class е зададен на една от стойностите по-долу:
<div class="video-wrapper-left">
<devsite-video video-id="Pgfbl_o9WvM"></devsite-video>
</div>
По подразбиране
Следващият пример показва как се показва вграден видеоклип в YouTube, когато <devsite-video> е обвит в <div> елемент, чийто атрибут class е зададен на video-wrapper .
На големи екрани видеото е 50% от ширината на областта на съдържанието и плава вдясно от всяко съдържание, което видеото предхожда. На малки екрани видеото е 100% от ширината на областта на съдържанието.
Код
<div class="video-wrapper">
<devsite-video video-id="Pgfbl_o9WvM"></devsite-video>
</div>
<p>Lorem ipsum dolor...</p>
Демо
Изплува наляво
Следващият пример показва как се показва вграден видеоклип в YouTube, когато <devsite-video> е обвит в <div> елемент, чийто атрибут на клас е зададен на video-wrapper-left .
На големи екрани видеото е 50% от ширината на областта на съдържанието и плава вляво от всяко съдържание, което видеото предхожда. На малки екрани видеото е 100% от ширината на областта на съдържанието.
Код
<div class="video-wrapper-left">
<devsite-video video-id="Pgfbl_o9WvM"></devsite-video>
</div>
<p>Lorem ipsum dolor...</p>
Демо
Пълна ширина
Следващият пример показва как се показва вграден видеоклип в YouTube, когато <devsite-video> е обвит в <div> елемент, чийто атрибут class е зададен на video-wrapper-full-width .
Видеоклипът е 100% от ширината на областта на съдържанието и не засяга оформлението на каквото и да е съдържание, предшествано от видеото.
Код
<div class="video-wrapper-full-width">
<devsite-video video-id="Pgfbl_o9WvM"></devsite-video>
</div>
<p>Lorem ipsum dolor...</p>
Демо
Бележки
Всички примери за кодове използват приспособлението Embed YouTube на DevSite, което автоматично проследява данните от Google Analytics. С изключение на специални случаи, когато не искате да събирате статистически данни за използването на вграден видеоклип, използвайте тази джаджа. Без него статистическите данни за употребата на вашия видеоклип няма да бъдат изпратени до Google Анализ.