Лайтбокс с видео

Как сделать лайтбокс с видео ?

Здравствуйте !

Сегодняшняя статья будет посвящена созданию Лайтбокса с видео, лайтбокс — это окно для удобного просмотра видео или фотографии, на передний план экрана выводится видео или фото, а остальная часть экрана затемняется, чтобы не отвлекать вашего внимания.

Пример:

Смотреть видео !

Я сделал кнопку для просмотра видео, но можно сделать просто фотографию или текст, дальше я объясню как это делается. Лайтбокс с видео мы будем создавать с помощью плагина — Shortcodes Ultimate, с помощью данного плагина можно сделать не только лайтбокс с видео, но и множество других функций и веб элементов для сайта.

Как установить и настроить плагин, а так же как с ним работать, я уже рассказывал, можете прочесть — ЗДЕСЬ ! там всё просто. Если вы уже установили плагин, и узнали как им пользоваться, тогда движемся дальше, и приступим к созданию лайтбокса с видео. Откройте запись куда вы хотите поместить лайтбокс с видео, и нажмите на кнопку —Вставить шорткод.

27-05-2015 21-03-21

.

Выберите из списка функцию — Лайтбокс.

24-06-2015 21-47-12

 

 

У вас откроется окно для создания Лайтбокса.

24-06-2015 22-28-11

 

Подробней о настройках:

 

Тип содержимого, здесь нужно указать тип содержимого, который будет отображаться в лайтбоксе. Фрейм — для видео., Изображение — понятно для изображений., HTML элемент — любой html элемент.

Источник Содержимого, чтобы в лайтбоксе отобразилось видео, укажите здесь ссылку на видео.

Класс, если не разбираетесь, то оставьте поле пустым, это необязательная функция.

 

Содержимое, здесь можно указать любой текст или одно слово при нажатии на которое будет появляться лайтбокс с видео. Так же здесь можно указать фотографию или кнопку, как я вам показывал в начале записи. Как сделать кнопку я уже объяснял — Здесь ! после создания кнопки вам нужно будет просто скопировать получившийся шорткод, и вставить его в поле Содержимое при создании Лайтбокса.

А если вы хотите, чтобы изначально показывалась фотография, то вам нужно добавить в запись фото, перейти во вкладку Текст, скопировать html код фотографии и вставить его в поле Содержимое при создании Лайтбокса.

Всё, далее жмёте на кнопку — Вставить шорткод, заходите на сайт, и смотрите что у вас получилось. Как видите всё просто. На этом всё, вы узнали как можно создать лайтбокс с видео, до новых встреч !

 

Как сделать лайтбокс с видео ? обновлено: Сентябрь 2, 2016 автором: Илья Журавлёв
 
 

Комментарии

Добавить комментарий

Ваш e-mail не будет опубликован. Обязательные поля помечены *


5 + 7 =



super-infa-top
Стрелка вверх