Особенности плагина Divi - переключатель Divi

Divi Switch - это сторонний плагин для Divi, который добавляет в Divi множество новых функций, которые вы можете включать и выключать одним щелчком переключателя. Многие в сообществе Divi знают о Divi Switch, поскольку он существует уже несколько лет, но их обновление 3.0 принесло множество новых функций и улучшений, на которые стоит обратить внимание. Некоторые из этих новых функций включают в себя: новую панель управления, мини-плагин для импорта и экспорта, предварительные загрузчики, новые параметры настройки темы, настройки логотипа, пользовательские страницы 404 и обслуживания со встроенными макетами, поддержку изображений SVG и многое другое.

В этой статье мы рассмотрим новый переключатель Divi Switch и обратим пристальное внимание на его обновленный набор функций.

Установка Divi Switch

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

Панель управления Divi Switch

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

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

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

Давайте посмотрим на несколько вкладок и посмотрим, на что он способен.

Заголовок

Вкладка «Заголовок» добавляет 8 переключателей и настроек. Вы можете удалить подчеркивание заголовка, сделать номер телефона интерактивным, открывать социальные ссылки в новой вкладке, центрировать верхние элементы заголовка, использовать другой логотип при прокрутке, изменить текст меню гамбургера, использовать логотип для конкретной страницы и заменить полноэкранное меню с макетом Divi.

Настройки логотипа

Тема Divi имеет возможность установить собственный логотип, который может отображаться на каждой странице или в сообщении. Но что, если вам нужно использовать на своем сайте разные логотипы? Divi Switch добавляет несколько вариантов логотипа, чтобы у вас было больше логотипов для отображения, и это дает вам контроль над тем, как и где они отображаются. Настройки позволяют вам выбрать другой логотип при прокрутке, и вы можете установить другой логотип для определенных страниц.

Другой логотип на свитке

Чтобы отобразить новый логотип на прокрутке, просто загрузите логотип в экран настроек. Альтернативный логотип теперь будет отображаться, когда посетитель прокручивает страницу.

Логотип для конкретной страницы

С логотипом для конкретной страницы вы не ограничены только одним логотипом на своем веб-сайте. Вы можете иметь столько логотипов, сколько хотите, и это дает вам полный контроль над тем, какой логотип отображается на какой странице.

Если вы включили логотип для конкретной страницы в настройках, новая функция будет добавлена ​​в нижнюю часть области содержимого страниц и сообщений. Теперь вы можете установить другой логотип для домашней страницы и другой для других страниц и сообщений. Здесь вы просто загружаете логотип, который хотите отображать на этой странице или публикации.

В этом примере показаны разные страницы, на каждой из которых показан вариант логотипа сайта.

Полноэкранное меню

Заголовок также имеет несколько настроек меню. В этом примере я изменил текст меню гамбургера и выбрал макет для полноэкранного меню.

Вот гамбургер-меню с новым текстом.

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

Нижний колонтитул

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

Этот макет был добавлен в нижний колонтитул каждой страницы, просто выбрав его на вкладке Нижний колонтитул.

Основное содержание

На вкладке «Главное содержимое» добавлено 11 переключателей и настроек. Вы можете удалить разделительную линию боковой панели, добавить предварительный загрузчик домашней страницы и установить тип и цвета, изменить соотношение изображений портфолио, запретить открытие изображений в лайтбоксе, настроить анимацию ползунка, удалить тип сообщения "Проекты", добавить настраиваемую страницу обслуживания и добавить настраиваемую страницу 404.

Прелоадер

При включении предварительного загрузчика во время загрузки домашней страницы будет отображаться анимированный значок. Это замечательно показывает посетителю, что что-то происходит, пока фактическое содержимое страницы все еще загружается в фоновом режиме. Имеет 15 типов переходов и два варианта цвета.

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

Пользовательские 404 и страницы обслуживания с макетами

Эти функции позволяют вам выбрать любую страницу обслуживания и страницу 404 из вашего списка страниц. Это означает, что вы можете создавать страницы, используя макеты, которые вы создали или импортировали в библиотеку Divi.

Чтобы помочь вам в этом, Divi Switch включает в себя пакеты макетов страниц 404 и техобслуживания премиум-класса с 10 предварительно разработанными макетами, которые можно легко настроить и установить по умолчанию. Они в формате JSON. Изображение выше - одна из 404 страниц.

Макеты профессионально разработаны, поэтому ваша страница 404 и служебные страницы будут не только информативными, но и привлекательными. Этот пример - одна из страниц обслуживания. Он включает таймер обратного отсчета.

Мобильный

На вкладке «Мобильный» можно установить точки останова для каждого размера изображения. Введите номер значения, которое должно изменить точку останова. Вы также можете свернуть меню на мобильном устройстве и показать определенный текст.

Сообщения

В сообщениях есть классная функция комментариев. Это перемещает комментарии в переключатель, поэтому по умолчанию они скрыты.

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

Щелкните, чтобы открыть и просмотреть комментарии. Это стандартная форма комментариев WordPress.

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

Архивы

Вкладка Архивы дает вам контроль над страницами архива (страницы с тегами, категориями, автором, поиском и т. Д.). Добавьте заголовок категории, удалите боковую панель, добавьте ссылку для чтения и добавьте разделительную линию под сообщениями.

Вот пример страницы автора со всеми включенными переключателями архива.

Интеграция

Вкладка «Интеграция» позволяет вставлять макеты Divi в определенные места, в том числе перед основным контентом, после основного контента и перед контентом публикации. Выберите макет из раскрывающихся списков.

Я сделал полноразмерный баннер, используя только текстовый модуль, и вставил его перед контентом. Конечно, вы можете создать макет любого типа, какой захотите. Это отличный способ создавать призывы к действию и специальные меню.

Передовой

Вкладка «Дополнительно» позволяет загружать масштабируемую векторную графику (SVG) для получения более четких логотипов, значков и других изображений. Поскольку WordPress по умолчанию блокирует SVG, это отличный способ использовать этот формат изображения с Divi.

Импорт Экспорт

Вкладка «Импорт / экспорт» позволяет экспортировать код, сгенерированный Divi Switch, в легкий и настраиваемый фирменный плагин для установки на сайтах ваших клиентов. Это упрощает использование вашего любимого кода Divi Switch без необходимости установки и настройки самого плагина Divi Switch. Введите имя плагина, введите описание, добавьте информацию об авторе, укажите версию плагина и выберите «Экспорт плагина».

Теперь вы можете загрузить свой фирменный плагин на сайты вашего клиента, как и любой другой плагин. На нем будет ваш бренд.

Настройщик тем

В настройщик тем добавлена ​​новая вкладка под названием Divi Space Settings. Здесь вы найдете еще одну вкладку под названием Divi Switch. Настройщик темы включает дополнительные настройки для создания пользовательского значка для мобильного меню, изменения фонового изображения заголовка, настройки кнопки возврата к началу страницы и настройки страниц архива - все с предварительным просмотром в реальном времени.

В этом примере я добавил фоновое изображение в заголовок. Вы можете настроить его на повтор, изменить положение изображения и изменить размер изображения. Над этой настройкой находится область выбора, где вы можете выбрать значок для мобильного меню.

В этом примере я настраиваю кнопку «Назад вверх», чтобы она соответствовала макету. Вы можете настроить размер значка, радиус, положение, цвет фона, цвет значка и цвета при наведении курсора.

В этом примере я регулирую цвет, высоту и ширину разделителя для страниц архива. В этих примерах вы также заметите, что логотип изменился при прокрутке вниз. У меня все еще активирована настройка смены логотипа (ну, я думаю, она на самом деле «переключена»).

Лицензия

Divi Switch предлагает на выбор три лицензии:

• Один сайт - 24 $
• 3 сайта - 50 $
• Безлимитные сайты - 96 $

Divi Switch также доступен в плане членства Divi Space.

Конечные мысли

Я впечатлен новыми функциями Divi Switch. Не нужно вставлять классы CSS и новая панель инструментов - это долгожданные функции. Параметры логотипа, предварительная загрузка, мини-плагин и пользовательская страница 404 и страница обслуживания сами по себе многое добавляют в Divi. Мне нравится возможность вставлять макеты Divi и выбирать собственный нижний колонтитул. Мне также нравятся функции настройки темы, чтобы добавить изображение в заголовок и настроить его, а также изменить цвет, форму и положение кнопки возврата к началу.

Divi Switch добавляет в Divi множество функций. Я обнаружил, что каждый из них прост в использовании. Если вы ищете множество настроек, которые можно было бы добавить самым простым способом, Divi Switch может быть тем, что вы ищете.

Ждем вашего ответа. Вы пробовали Divi Switch? Расскажите нам о своем опыте в комментариях ниже!

Избранные изображения через Олега Донецка / shutterstock.com