Главная страница / DataLife Engine / Скрипты и другая информация / Lite YouTube Embed - ускоряем загрузку страниц с плеером ютуба

Lite YouTube Embed - ускоряем загрузку страниц с плеером ютуба

25 октября 2021, Понедельник
2 802
7
Lite YouTube Embed - ускоряем загрузку страниц с плеером ютуба

Данный скрипт будет актуален тем, кто на сайте использует в качестве плеера — плеер от ютуб. Все знают что когда на странице много плееров ютуб — скорость загрузки страниц существенно падает, и даже отложенная загрузка плеера не всегда помогает. Данный скрипт выводит вместо плеера сначала изображение, и при клике на неё — загружает уже непосредственно сам плеер ютуба.

Установка скрипта:
  1. Подключить CSS в main.tpl
  2. Подключить JS в main.tpl


<!-- Include the CSS & JS.. (This could be direct from the package or bundled) -->
<link rel="stylesheet" href="node_modules/lite-youtube-embed/src/lite-yt-embed.css" />

<script src="node_modules/lite-youtube-embed/src/lite-yt-embed.js"></script>


Вместо стандартного вывода плеера iframe нужно использовать такую конструкцию:
<!-- Use the element. You may use it before the lite-yt-embed JS is executed. -->
<lite-youtube videoid="ogfYd705cRs" playlabel="Play: Keynote (Google I/O '18)"></lite-youtube>


Источник
lite-youtube-embed-master.zip [13.13 Kb] (cкачиваний: 78)


Аналогичный скрипт
Комментарии:
{login}

Твой комментарий..

  1. Александр 25 ноября 2021 00:35

    Вместо стандартного вывода плеера iframe нужно использовать такую конструкцию

    Вот тут доп.поле: lite-youtube videoid="Доп.поле"  


    P.S: Евгений, добавь инструкцию в описание для обычных юзеров с доп полями, раз не понимают как сделать 

  2. europa1988 24 ноября 2021 20:03

    Объясните нормально как подключить, стили и скрипт подключил, доп поле создал, как плеер вывести?

    1. Александр 24 ноября 2021 22:49
      У меня так .
      Ссылка выглядит так youtube.com/embed/DNX2b3Ppfs4 выставляешь только это в Доп поле DNX2b3Ppfs4
      1. byroot Администраторы 24 ноября 2021 23:59
        Всё верно.


        А про стиль ксс скрипты всё написано, там всего две строки.
  3. Александр 16 ноября 2021 16:57

    В шаблоне MusicSoul от webrambo, плеер не погружается почему-то, помогает только перезагрузка страницы

    1. byroot Администраторы 21 ноября 2021 15:02
      нужно смотреть в сторону скриптов, возможно нужно поменять порядок подключения скриптов в шаблоне, не видя самого шаблона трудно сказать что то более конкретное. а если шаблон был куплен у вебрембо, то он без проблем может помочь добавить данный скрипт в свой шаблон.
      1. Александр 25 ноября 2021 00:41
        Шаблон куплен у вебрембо, написал ему, вдруг захочет добавить этот скрипт в шаблоны в будущем и получил ответ :
        Привет. Спасибо, но я вряд ли использую. Потому что не сторонник использовать сторонние скрипты Когда в принципе можно сделать всё без них. Во-первых в дле есть отложенная загрузка которая работает для iframe, также есть и нативная отложенная загрузка в браузере. Это решает проблемы с тестами pagespeed. ну а если нужна заглушка при клике на которую будет генерироваться iframe то как-то опять же выберу написать её сам, это всего несколько строк.
Модули для создания киносайта и не только на базе DataLife Engine, и многое другое...
Просто блог Евгения Попова, он же - byroot © 2015-2025 | Карта сайта