Полное руководство по использованию SmartVideo с Divi Builder для видеохостинга WordPress

Для пользователей Divi Builder SmartVideo предлагает вам именно тот инструмент, который вам нужен для обеспечения современного, профессионального и естественного воспроизведения видео на вашем веб-сайте.

Мы живем в эпоху мощных тем WordPress и конструкторов страниц, которые помогут вам создать любой веб-сайт на свете. Одной из таких тем и визуальных конструкторов страниц является Divi Builder от крутых ребят из Elegant Themes.

Если вы являетесь присяжным пользователем Divi Builder, вам понравится сегодняшний пост. Через несколько минут мы покажем вам, как именно использовать Swarmify SmartVideo вместе с Divi Builder.

Теперь вам не нужно использовать на своем сайте загруженные ссылками видеоплееры Vimeo или YouTube. Мы предлагаем вам простой видеоплеер, который отлично смотрится на вашем веб-сайте на платформе Divi.

Каковы прямые выгоды?

• Видеопроигрыватель SmartVideo не содержит сторонних брендов (привет, YouTube) и ссылок, которые отвлекают трафик, который вы с таким трудом направляете на свой сайт. Теперь вы можете брендировать свои видеоплееры, чтобы они выглядели четко и профессионально :)
• Наша Video CDN и запатентованная технология EdgeAI позволяют предлагать сверхбыстрые, безбуферные и безошибочные видеоролики посетителям вашего веб-сайта, где бы они ни находились. Ваши пользователи будут вам благодарны.
• Мы используем ту же инфраструктуру, которую используют гиганты потоковой передачи, такие как Netflix и Hulu, потому что мы полностью привержены нашей миссии. В результате вы получаете видеоролики с мгновенным запуском и без задержек, которые помогают удерживать больше посетителей и увеличивать доход.
• Наше решение для кодирования видео набирает обороты, а это означает, что посетители вашего веб-сайта могут наслаждаться высококачественным воспроизведением видео независимо от того, какое устройство они используют. Попрощайтесь с отрывочными видео, которые выглядят ужасно на разных экранах и разрешениях.
• И многое другое, о чем вы узнаете далее в статье :)

А пока давайте узнаем больше о Divi Builder и о том, как интегрировать его со SmartVideo.

Спойлер: вы можете добавить код SmartVideo на свой веб-сайт Divi Builder вручную, но теперь вы можете пропустить все технические детали с помощью нашего нового плагина SmartVideo для WordPress. Это означает, что вы можете легко интегрировать SmartVideo с Divi Builder, даже если вы не умеете кодировать, чтобы спасти свою жизнь.

Что такое Divi Builder?

Если вы новичок, Divi — это красивая и мощная тема WordPress и визуальный конструктор страниц. Благодаря передовой технологии визуального конструктора Divi помогает вам быстро создавать потрясающие веб-сайты WordPress.

Divi поставляется с множеством готовых макетов, которые вы можете импортировать в свою установку WordPress одним щелчком мыши. Кроме того, у вас есть Divi Visual Builder , который позволяет настраивать ваш веб-сайт, перетаскивая элементы.

Правильно, вам не нужны предварительные знания в области кодирования, чтобы создать замечательный веб-сайт с Divi. Если этого недостаточно, вы даже можете использовать два разных макета одновременно, что дает вам большую свободу дизайна.

Divi поставляется с множеством удивительных функций, включая:

• Более 40 элементов веб-сайта, таких как кнопки призыва к действию, галереи, формы, блоги, слайдеры, отзывы и т. д.
• Более 800 готовых дизайнов в различных нишах, таких как бизнес, электронная коммерция, технологии, здравоохранение и т. д.
• Полный контроль конструкции
• 100% адаптивный дизайн с дополнительными настройками для всех типов устройств
• Пользовательский элемент управления CSS
• Большая библиотека эффектов, переходов и стилей
• Миллион и один вариант дизайна
• И многое другое!

Самое приятное то, что когда вы покупаете Divi, вы получаете доступ к другим темам и плагинам WordPress. У Elegant Themes более 700 тысяч клиентов, так что вы в надежных руках.

«Divi — КОРОЛЬ, когда дело доходит до простоты веб-дизайна. То, что раньше занимало неделю, теперь занимает несколько часов, а теперь мы все вместе преследуем нашу личную цель — преобразовать веб-сайты всех наших клиентов в Divi». - Скотт Лоуренс

Divi идеально подходит для фрилансеров, агентств и владельцев веб-сайтов, которые ищут мощный, интуитивно понятный и простой в использовании визуальный конструктор страниц. Умеете ли вы кодировать или нет, Divi — невероятный инструмент для создания веб-сайтов.

Тем не менее, что такое SmartVideo?

Что такое Swarmify SmartVideo?

Для новичков Swarmify — это лучший сервис ускорения видео, который мы запустили еще в 2013 году после нескольких дней тщательной разработки и тестирования.

Наша платформа для видеохостинга с полным спектром услуг включает наборы инструментов для кодирования, воспроизведения, видео CDN, доставки и распространения. Мы гордимся тем, что работаем с растущим числом предпринимателей из всех слоев общества.

Мы увлечены своим делом и неустанно работаем над тем, чтобы предлагать вам видео, которые загружаются мгновенно без буферизации, что является нормой для многих видеохостингов, таких как YouTube, Wistia и Vimeo.

Swarmify гарантирует вам в 12 раз более быстрое воспроизведение видео и в 8 раз меньшую буферизацию по сравнению со средними видеоплеерами на рынке. Мы фокусируемся только на ускорении видео, и у нас это неплохо получается :)

Помимо бессовестного плагина, Swarmify невероятно легко интегрируется с несколькими платформами для создания веб-сайтов, включая WordPress, Shopify и Squarespace, среди прочих.

Хотя вы можете встроить видеоплеер SmartVideo на свой сайт WordPress вручную, вы можете сэкономить время, используя наш революционный плагин SmartVideo WordPress.

Плагин смехотворно прост в установке и настройке на вашем веб-сайте WordPress + Divi Builder. Вы будете предоставлять своим посетителям быстрое и высококачественное видео менее чем за 10 минут!

С этой справочной информацией мы теперь готовы к самой интересной части. В следующем разделе вы узнаете, как использовать Swarmify с Divi Builder. Другими словами, мы покажем вам, как добавить видео в типичный макет Divi Builder.

Как использовать Swarmify SmartVideo с Divi Builder

Для следующего раздела вам необходимо установить и активировать как плагин SmartVideo WordPress, так и Divi. Установка и активация SmartVideo или Divi — это задача четвероклассников, и мы не ожидаем, что у вас возникнут какие-либо проблемы.

Если у вас есть готовые Divi и SmartVideo, давайте приступим к работе. В целях иллюстрации я работаю с макетом веб-агентства Divi, который выглядит примерно так:

Довольно аккуратно, правда? Что я сделаю, так это добавлю видеоролик SmartVideo сразу под основным заголовком, который гласит: « Агентство веб-дизайна с полным спектром услуг» . См. изображение выше.

Давайте начнем!

В панели администратора WordPress перейдите на страницу, которую вы хотите отредактировать. В нашем случае я редактирую домашнюю страницу , показанную на снимке экрана выше.

Откройте страницу в редакторе, как обычно. Чтобы начать редактирование вышеуказанной страницы в Divi Builder, просто нажмите кнопку « Редактировать с помощью Divi Builder », как показано ниже.

Это загружает вашу страницу во внешнем интерфейсе. Затем нажмите кнопку « Включить Visual Builder », как показано ниже.

Затем прокрутите до раздела, который вы хотите отредактировать. В нашем случае мы добавляем SmartVideo сразу под основным заголовком в верхней части страницы.

При наведении курсора на раздел появляются параметры редактирования. Просто щелкните значок плюса (+) , чтобы добавить новый модуль:

Откроется всплывающее окно, позволяющее добавить новый модуль Divi:

Затем введите «SmartVideo» в поле поиска и нажмите SmartVideo , как показано ниже.

После этого пришло время настроить видео с помощью вкладки SmartVideo Settings . Как вы можете видеть на изображении ниже, вам доступно множество вариантов:

В настройках SmartVideo вы можете:

• Выберите источник видео — это может быть медиатека WordPress, YouTube, Vimeo или любой другой источник ( примечание : если ваше видео на YouTube установлено как личное , вместо этого измените его на незарегистрированное )
• Измените ширину и высоту вашего видео
• Установите собственный постер для вашего видео (SmartVideo по умолчанию использует первый кадр вашего видео, если вы не выберете собственный постер)
• Включение/выключение таких параметров, как «Автовоспроизведение», «Цикл» и «Приглушено ».
• Включение/выключение таких параметров, как элементы управления видео, адаптивный дизайн и встроенное воспроизведение видео для браузера iOS Safari.
• Управляйте дизайном своего видео с помощью параметров Divi, которые включают границы, размеры, интервалы, фильтры, затенение блоков, анимацию и многое другое :)

Когда вы закончите, просто нажмите кнопку « Сохранить », как мы подробно расскажем ниже:

После этого не забудьте сохранить изменения в Divi Visual Builder:

Теперь, если мы посмотрим наш образец сайта в интерфейсе, мы увидим новый видеоплеер SmartVideo, готовый раскачать вечеринку:

Чтобы добавить SmartVideo в любой раздел, просто повторите процесс. Запустите страницу, которую вы хотите отредактировать, в Divi Visual Builder, щелкните значок плюса (+) , чтобы добавить новый модуль, выберите модуль SmartVideo, добавьте параметры и сохраните изменения.

Все просто, как А, В, С!

Добавление видео SmartVideo на ваш веб-сайт Divi еще никогда не было таким простым. Вы можете забыть о брендинге YouTube, рекомендуемых видео и ссылках, которые крадут ваш трафик.

Кроме того, вы можете полностью настроить видеоплеер SmartVideo в соответствии со стилем вашего сайта.

Что еще?

Если у вас уже есть видео на вашем веб-сайте Divi, SmartVideo автоматически конвертирует их, как только вы настроите наш плагин.

Убедитесь, что вы включили Оптимизировать фон и существующие видео в настройках SmartVideo.

Как?

В панели администратора WordPress перейдите в SmartVideo > Settings . Затем включите Оптимизировать фон и существующие видео :

После этого нажмите кнопку Сохранить настройки внизу страницы:

Вот и все — SmartVideo автоматически конвертирует все ваши существующие видео.

Вот так; больше ничего делать не надо :)

Как настроить видеоплеер SmartVideo

Прежде чем мы дойдем до конца, давайте рассмотрим некоторые параметры настройки видеоплеера SmartVideo.

Изменение формы и цвета видеоплеера

По умолчанию видеопроигрыватель SmartVideo использует желтую шестиугольную кнопку воспроизведения. Однако вы можете изменить форму и цвет в соответствии с вашим веб-сайтом. Вот как.

В панели администратора WordPress нажмите SmartVideo:

Когда вы окажетесь на панели инструментов SmartVideo, щелкните вкладку « Настройки », как показано ниже.

На экране настроек прокрутите вниз, и вы найдете разделы, которые позволяют изменить форму и цвет кнопки воспроизведения:

Вот еще несколько заметок о снимке экрана выше.

1. Чтобы изменить форму кнопки проигрывателя, выберите « По умолчанию », « Прямоугольник » или « Круг» в раскрывающемся меню.
2. Выберите собственный цвет для кнопки проигрывателя.
3. Нажмите кнопку Сохранить настройки , чтобы сохранить изменения.

Теперь вы можете наслаждаться новой настроенной кнопкой плеера :)

Дополнительные параметры

SmartVideo предлагает больше возможностей для добавления скрытых субтитров из источников YouTube, включения/выключения ускорения загрузки, переключения на альтернативные макеты, добавления пользовательского водяного знака и мониторинга ваших видео с помощью рекламы.

Вот как найти указанные выше параметры на странице настроек SmartVideo. Чтобы добавить субтитры из источников YouTube, установите флажок, показанный ниже, и не забудьте сохранить настройки:

Чтобы запустить дополнительные параметры, прокрутите вниз и нажмите « Дополнительные параметры », как показано ниже.

В разделе « Дополнительные параметры » у вас есть следующие параметры:

1. Включите или выключите альтернативный метод компоновки , что поможет, если у вас возникают проблемы с размером видео или полноэкранным режимом.
2. Включите или выключите ускорение загрузки, если у вас возникли проблемы с загрузкой.
3. Установите собственный водяной знак/логотип на свой видеоплеер.
4. Добавьте URL-адрес объявления VAST , чтобы продавать рекламу из AdSense, Spotx, DFP и т. д.

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

Заключительные слова

Divi — замечательная тема WordPress и визуальный конструктор страниц. Это поможет вам создавать красивые веб-сайты до того, как следующий парень съест бутерброд. Процесс так же прост, как импорт макета и его настройка до отказа.

Функция перетаскивания упрощает настройку любого макета. Вам вообще не нужны навыки кодирования, плюс вы редактируете свой веб-сайт в интерфейсе, наблюдая, как ваши изменения вступают в силу в режиме реального времени.

Если вы используете видео на своем веб-сайте, SmartVideo поможет вам обеспечить быстрое, безбуферное и профессиональное видео на вашем сайте. Даже если вы размещаете свои видео на YouTube или в другом месте, наш видеоплеер без помех устраняет сторонние бренды и ссылки.

Divi + SmartVideo — выигрышная комбинация. Теперь у вас в руках идеальная комбинация для быстрого создания веб-сайтов и предоставления непревзойденных возможностей видео для посетителей вашего веб-сайта или клиентов веб-дизайна.

Кроме того, у нас нет ограничений по пропускной способности или объему хранилища, как у других сервисов, а это означает, что вы можете размещать неограниченное количество видео по доступным ценам :) Попробуйте Divi + SmartVideo сегодня и наслаждайтесь быстрым и высококачественным видео, не заморачиваясь.

Дайте нам знать, как это происходит. Удачного строительства!