Connect with us

Обзор Divi: Как этот конструктор экономит часы на дизайн сайта

Инструменты ИИ 101

Обзор Divi: Как этот конструктор экономит часы на дизайн сайта

mm

Unite.AI is committed to rigorous editorial standards. We may receive compensation when you click on links to products we review. Please view our affiliate disclosure.

Divi review.

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

Именно поэтому Divi привлек мое внимание. Этот конструктор WordPress не просто предоставляет шаблон; он позволяет вам дизайн вашего сайта точно так, как вы хотите, без необходимости программирования. Divi сохраняет все просто, обеспечивая гибкость для создания уникальных сайтов.

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

Я закончу статью, сравнив Divi с моими тремя лучшими альтернативами (Wix, B12 и Brizy). К концу вы узнаете, подходит ли оно вам!

Вердикт

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

Плюсы и минусы

  • Интерфейс drag-and-drop, без программирования
  • Тысячи готовых шаблонов для быстрой настройки
  • Отзывчивый дизайн для всех устройств
  • Конструктор тем для настраиваемых заголовков, подвалов и шаблонов
  • Интеграция с плагинами, WooCommerce и инструментами маркетинга
  • Продвинутые варианты дизайна: анимации, эффекты наведения, CSS и глобальные стили
  • Инструменты ИИ для упрощения создания контента и дизайна
  • Регулярные обновления с новыми функциями
  • Может быть медленнее, чем некоторые конкуренты, если не оптимизирован
  • Шаблоны по умолчанию могут привести к одинаковому дизайну

Что такое Divi?

Divi – популярная тема WordPress с мощным визуальным конструктором страниц, разработанным Elegant Themes. Вы можете использовать его, чтобы создать полностью настраиваемые сайты без программирования через его интерфейс drag-and-drop.

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

Двойная природа Divi

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

Тема предоставляет чистую и отзывчивую основу для любого контента. Тем временем плагин конструктора страниц превращает редактирование сайта в опыт drag-and-drop.

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

От простой темы к визуальному мощному инструменту

Elegant Themes запустил Divi в 2013 году как тему WordPress, но он претерпел драматическую трансформацию за последнее десятилетие.

Оригинальная версия использовала интерфейс backend. Однако он не предлагал живых, визуальных вариантов редактирования.

Введение Визуального конструктора в 2016 году стало поворотным моментом. Пользователи могли теперь редактировать свои сайты прямо на frontend с реальными предпросмотрами.

Последующие обновления добавили продвинутые функции, включая:

  • Интеграцию динамического контента
  • Контроль настраиваемого CSS
  • Функциональность конструктора тем (дизайн заголовков, подвалов и整个 страницы)

Философия визуального конструирования

Divi направлен на то, чтобы сделать веб-дизайн доступным, удаляя технические барьеры. В прошлом настраиваемые дизайны WordPress требовали навыков программирования, таких как HTML, CSS и PHP, оставляя многих с базовыми шаблонами.

Визуальный конструктор удаляет технические барьеры с помощью легких контролей для цветов, шрифтов и间距. Он выходит за рамки конструирования страниц, чтобы покрыть весь дизайн сайта.

Интеграция с экосистемой WordPress

Divi работает без проблем с WordPress, сохраняя контент в стандартных форматах, которые остаются целыми, даже если Divi деактивирован.

Divi работает хорошо с популярными плагинами WordPress для SEO, электронной коммерции, форм и безопасности. Он интегрируется с WooCommerce для продажи продуктов в Интернете и поддерживает инструменты, такие как Yoast SEO, чтобы сохранить дизайны, оптимизированные для поиска.

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

Для кого лучше всего подходит Divi?

Вот типы людей, для которых Divi лучше всего подходит:

  • Фрилансеры и веб-дизайнеры могут использовать Divi, чтобы создать полностью настраиваемые сайты без программирования.
  • Малые и средние предприятия могут использовать Divi, чтобы построить профессиональные сайты, такие как портфолио, блоги и страницы услуг с полным контролем над дизайном.
  • Агентства и разработчики могут использовать Divi, чтобы ускорить проекты веб-дизайна с предварительно созданными макетами.
  • Владельцы интернет-магазинов могут использовать Divi, чтобы спроектировать магазины WooCommerce с настраиваемыми страницами продуктов и потоками оформления заказа.
  • Маркетологи могут использовать Divi, чтобы запустить тестирование A/B и построить сайты, оптимизированные для SEO.
  • Образовательные учреждения и некоммерческие организации могут использовать Divi, чтобы создать несколько сайтов под одной лицензией для управления различными отделами или программами.

Ключевые функции Divi

Вот ключевые функции Divi AI:

  • Конструктор drag-and-drop: без кода, живое визуальное редактирование на frontend и backend.
  • Конструктор тем: проектирование заголовков, подвалов, шаблонов и многое другое.
  • Макеты и шаблоны: тысячи шаблонов дизайна и стартовых сайтов.
  • Отзывчивые контролы: настройка для настольных компьютеров, планшетов и мобильных устройств.
  • Глобальные стили: многократное использование секций и синхронизированные обновления дизайна.
  • Продвинутые варианты: шрифты, цвета,间距, анимации, эффекты наведения и настраиваемый CSS.
  • Инструменты ИИ: генерация контента и ускорение построения.
  • WooCommerce: 20+ модулей для настраиваемых страниц магазина и продуктов.
  • Хранилище и управление: Divi Cloud и Dash для облачного хранилища и управления.
  • Динамический контент: авто-вставка заголовков, изображений, дат и многое другое.
  • Богатая библиотека модулей: текст, изображения, формы, слайдеры, галереи и многое другое для построения макетов сайта.
  • Производительность: оптимизировано для скорости, SEO и доступности.

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

Вот как я установил плагин Divi AI и использовал его, чтобы сгенерировать всю статью за несколько минут:

  1. Зарегистрироваться в Divi AI
  2. Войти в Elegant Themes
  3. Скачать Divi
  4. Добавить плагин Divi
  5. Загрузить и установить плагин Divi
  6. Активировать плагин
  7. Настроить настройки плагина Divi
  8. Сгенерировать статью
  9. Отредактировать с помощью конструктора Divi
  10. Начать построение
  11. Сгенерировать макет с помощью ИИ
  12. Аутентифицировать подписку Elegant Themes
  13. Доступ к имени пользователя и ключу API
  14. Сгенерировать ключ API
  15. Аутентифицировать аккаунт
  16. Описать страницу
  17. Выбрать изображения и шрифты
  18. Сгенерировать макет

Шаг 1: Зарегистрироваться в Divi AI

Регистрация в Divi AI.

Я начал с перехода на elegentthemes.com и перехода к “Получить Divi AI.”

Шаг 2: Войти в Elegant Themes

Вход в Elegant Themes.

После получения Divi Pro я был перенаправлен на страницу входа в Elegant Themes.

Шаг 3: Скачать Divi

Скачивание плагина Divi.

После входа я был представлен двумя способами скачать Divi:

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

В моем случае у меня уже была установлена тема на моем сайте WordPress, и я был доволен ею. Я выбрал “Скачать плагин Divi.”

Шаг 4: Добавить плагин Divi

Добавление плагина на WordPress.

Немедленно плагин Divi начал скачиваться на мой компьютер.

Из моего панеля управления WordPress я навел курсор на “Плагины” и перешел к “Добавить плагин.”

Шаг 5: Загрузить и установить плагин Divi

Загрузка плагина, выбор файла и установка.

Далее я нажал “Загрузить плагин”, выбрал файл плагина Divi ZIP и выбрал “Установить сейчас.”

Шаг 6: Активировать плагин

Активация плагина, загруженного на WordPress.

Оттуда я нажал “Активировать плагин.”

Шаг 7: Настроить настройки плагина Divi

Выбор Divi из пунктов меню на WordPress.

После установки и активации плагина я заметил новый пункт меню “Divi” в моем панели управления WordPress. Это было место, где я мог настроить настройки плагина, создать шаблоны сайта, добавить макеты и назначить.

Шаг 8: Сгенерировать статью

Использование конструктора Divi на посте в WordPress.

Далее я хотел сгенерировать пост с помощью Divi. Я перешел к своим постам и выбрал один из них. Я выбрал фиолетовую кнопку Divi вверху.

Шаг 9: Отредактировать с помощью конструктора Divi

Редактирование поста с помощью конструктора Divi.

Далее я выбрал “Отредактировать с помощью конструктора Divi.”

Шаг 10: Начать построение

Начало построения с Divi.

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

Шаг 11: Сгенерировать макет с помощью ИИ

Сгенерировать макет с помощью ИИ Divi.

Divi представил мне три варианта, как я хотел начать построение:

  1. Использовать существующий контент: сохранить существующий контент страницы, используя конструктор Divi.
  2. Выбрать предварительно созданный макет: выбрать из сотен готовых макетов, использовать один из своих сохраненных макетов или дублировать существующую страницу.
  3. Построить с помощью ИИ: описать контент страницы и пусть Divi ИИ построит страницу с помощью одного клика.

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

Шаг 12: Аутентифицировать подписку Elegant Themes

Divi запрашивает аутентификацию перед сгенерированием текста с помощью ИИ Divi.

Прежде чем сгенерировать текст с помощью ИИ Divi, мне нужно было аутентифицировать мою подписку Elegant Themes с помощью ключа API и имени пользователя.

Шаг 13: Доступ к имени пользователя и ключу API

Доступ к имени пользователя и ключу API из аккаунта Elegant Themes.

Чтобы найти мое имя пользователя и ключ API, я вошел в свой аккаунт Elegant Themes, навел курсор на “Аккаунт” и выбрал “Имя пользователя и ключ API.”

Шаг 14: Сгенерировать ключ API

Сгенерировать новый ключ API на Elegant Themes.

Внизу я выбрал “Сгенерировать новый ключ API.”

Шаг 15: Аутентифицировать аккаунт

Предоставление Divi имени пользователя и ключа API для аутентификации.

Оттуда я скопировал и вставил мое имя пользователя и ключ API в пустые поля на WordPress и нажал “Отправить.”

Шаг 16: Описать страницу

Построение страницы с помощью ИИ Divi, описывая страницу и сайт.

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

Вот подсказка, которую я дал Divi:

“Создать обзор Kittl, включая вердикт, плюсы, минусы, что это такое, для кого оно лучше всего подходит, его ключевые функции, как его использовать и три лучших альтернативы.”

Я также предоставил Divi с описанием моего сайта:

“Этот сайт предлагает лучшие инструменты дизайна, ресурсы и вдохновение, которые ранжированы и рассмотрены графическим дизайнером.”

Шаг 17: Выбрать изображения и шрифты

Сгенерировать изображения и шрифты с помощью плагина ИИ Divi.

Были также три типа изображений, которые я мог попросить Divi использовать на моей странице:

  1. Изображения из стока
  2. Изображения, сгенерированные ИИ
  3. Плехолдерные изображения

Наконец, я мог настроить шрифты и цвета моей страницы.

Я решил позволить ИИ сгенерировать изображения для меня и выбрать цвета и шрифты, чтобы увидеть, что он придумает.

Как только все было заполнено, я нажал “Сгенерировать макет.”

Шаг 18: Сгенерировать макет

Статья, сгенерированная с помощью плагина ИИ Divi.

Через несколько минут Divi сгенерировал всю статью в организованном макете, который был полностью настраиваемым. Я мог навести курсор на любой блок, чтобы переместить его, дублировать, удалить и многое другое. Я также мог получить доступ к настройкам, чтобы обновить контент и дизайн.

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

Три лучших альтернативы Divi

Вот лучшие альтернативы Divi, которые я бы рекомендовал.

Wix

Первая альтернатива Divi, которую я бы рекомендовал, – это Wix. Wix – это удобный конструктор сайтов с редактированием drag-and-drop. Он предназначен для тех, у кого есть мало или нет технического опыта веб-дизайна.

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

С другой стороны, Divi предлагает более продвинутые варианты дизайна с конструкторами frontend и backend, полным конструктором тем и интеграцией с плагинами WordPress и WooCommerce.

Для все-в-одном хостинга и дизайна с помощью ИИ выберите Wix. Для полного творческого контроля и интеграции с WordPress выберите Divi!

Посетите Wix или прочитайте мой обзор Wix!

B12

Следующая альтернатива Divi, которую я бы рекомендовал, – это B12. B12 – это платформа ИИ, которая специально помогает бизнесу быстро строить и запускать профессиональные сайты с минимальными усилиями или техническими навыками.

B12 использует ИИ, чтобы ускорить дизайн и создание контента. Это отличный вариант для тех, кто хочет быстро сгенерировать профессиональный сайт с встроенным SEO.

Тем временем Divi выделяется своим визуальным конструктором и вариантами настройки. Divi делает легко создание персонализированных сайтов с контролем над каждым элементом. Он также интегрируется с WooCommerce и большой библиотекой предварительно созданных макетов.

Для глубокой настройки дизайна и полного контроля над элементами сайта выберите Divi. Для мгновенного создания сайта с помощью ИИ выберите B12!

Brizy

Последняя альтернатива Divi, которую я бы рекомендовал, – это Brizy. Brizy делает легко создание привлекательных, отзывчивых сайтов с редактированием drag-and-drop, 180+ предварительно созданных шаблонов и чистым интерфейсом.

Brizy фокусируется на простоте и скорости. Он также предлагает облачное сотрудничество и более легкую, быструю производительность.

Тем временем Divi выделяется своим конструктором тем для полного контроля над заголовками, подвалами и шаблонами. Он также поддерживает WooCommerce с посвященными модулями электронной коммерции и функциями глобальной настройки.

Выберите Divi для полного контроля над дизайном, настраиваемыми шаблонами и сильной поддержкой WooCommerce. В противном случае выберите Brizy для скорости, простоты и сотрудничества.

Обзор Divi: Правильный инструмент для вас?

После тестирования Divi я могу с уверенностью сказать, что он балансирует между гибкостью и простотой использования. Конструктор drag-and-drop, тысячи шаблонов и настройка дали мне больше контроля, чем у меня было с большинством инструментов. Кроме того, функции ИИ помогли мне строить быстрее.

Для меня Divi – отличный выбор, потому что я ценю творческую свободу, глубокую настройку и возможность масштабировать проекты без программирования. Однако, если вы интересуетесь лучшими альтернативами Divi, вот что я бы рекомендовал:

  • Wix – лучший как все-в-одном хостинговое решение с без технической настройки и конструктором ИИ.
  • B12 – лучший для быстрого создания профессиональных бизнес-сайтов.
  • Brizy – простой, быстрый, легкий конструктор с функциями сотрудничества.

Спасибо за чтение моего обзора Divi! Надеюсь, вы нашли его полезным. Попробуйте тему Divi или конструктор плагина и посмотрите, как вам понравится!

Часто задаваемые вопросы

Какие недостатки у Divi?

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

Лучше ли Divi, чем Wix?

Wix – лучший для начинающих, которые хотят все-в-одном сайт с шаблонами и помощью ИИ. Тем временем Divi лучше для полного контроля над дизайном, настройки и интеграции с WordPress/WooCommerce.

Лучше ли Divi, чем Squarespace?

Divi – лучший для полной настройки, контроля над каждым элементом дизайна и интеграции с WooCommerce. Squarespace – лучший как все-в-одном хостинговое решение с шаблонами для быстрой настройки.

Подходит ли Divi для начинающих?

Да, Divi – хороший выбор для начинающих. Его конструктор drag-and-drop делает легко проектирование сайтов без программирования, а библиотека шаблонов помогает быстро создать профессиональные сайты.

Использует ли Divi ИИ?

Divi интегрирует функции ИИ через Divi AI, который встроен в Divi 5 и его визуальный конструктор. С помощью Divi AI вы можете сгенерировать текст, изображения, фрагменты кода и даже целые сайты с помощью простых подсказок.

Janine Heinrichs - создатель контента и дизайнер, помогающий творческим людям оптимизировать свой рабочий процесс с помощью лучших инструментов дизайна, ресурсов и вдохновения. Найти ее можно на janinedesignsdaily.com.