Обзор Divi: как этот конструктор экономит время на дизайне веб-сайтов

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

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

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

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

Вердикт

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

Что такое Диви?

Divi is a popular WordPress theme с мощным визуальным конструктором страниц, разработанным Элегантные темыВы можете использовать его для создания полностью настраиваемых веб-сайтов. без написания кода через интерфейс перетаскивания.

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

Двойственная природа Диви

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

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

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

От простой темы до визуального эффекта

Запущен Elegant Themes Divi в 2013 году как тема WordPress, но за последнее десятилетие она претерпела кардинальные изменения.

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

Введение Visual Builder в 2016 году Это стало переломным моментом. Теперь пользователи могли редактировать свои веб-сайты прямо на сайте с предварительным просмотром в режиме реального времени.

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

• Динамическая интеграция контента
• Пользовательские элементы управления CSS
• Функциональность Theme Builder (дизайн заголовков, нижних колонтитулов и целых шаблонов страниц)

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

Divi’s Цель — сделать веб-дизайн доступным, устранив технические барьеры. Раньше для создания индивидуальных проектов на 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’s ключевая особенность:

• Drag-and-Drop Builder: визуальное редактирование в реальном времени без написания кода как на фронтенде, так и на бэкенде.
• Конструктор тем: создавайте заголовки, нижние колонтитулы, шаблоны, ошибки 404, записи в блогах, продукты и многое другое.
• Макеты и шаблоны: тысячи шаблонов дизайнов и стартовых сайтов.
• Адаптивные элементы управления: настраиваются для настольных компьютеров, планшетов и мобильных устройств.
• Глобальные стили: повторно используемые разделы и синхронизированные обновления дизайна.
• Расширенные параметры: шрифты, цвета, интервалы, анимация и пользовательские CSS.
• Инструменты ИИ: Создавать контент и ускорить сборку.
• WooCommerce: более 20 модулей для создания пользовательских страниц магазинов и товаров.
• Хранение и управление: Диви Облако и Dash для облачного хранения и управления.
• Динамический контент: Автоматическая вставка заголовков, изображений, дат и т. д.
• Богатая библиотека модулей: текст, изображения, формы, слайдеры, галереи и многое другое для создания макетов веб-сайтов.
• Производительность: оптимизировано для скорости, SEO и доступности.

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

Вот как я установил Divi AI Plugin и использовал его для создания целой статьи за считанные минуты:

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

Шаг 1: Зарегистрируйтесь в Divi AI

Я начал с того, что пошел в elegentthemes.com и переходим к «Получить Divi AI».

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

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

Шаг 3: Загрузите Divi

После входа в систему мне было предложено два способа загрузки Divi:

• Divi Theme (универсальная тема WordPress и конструктор страниц)
• Плагин Divi Builder (визуальный конструктор страниц)

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

В моём случае на моём сайте WordPress уже была установлена ​​тема, которая меня устраивала. Я выбрал «Загрузить плагин Divi».

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

Плагин Divi сразу же начал загружаться на мой компьютер.

На панели инструментов WordPress я навел курсор на «Плагины» и перешел к «Добавить плагин».

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

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

Шаг 6: Активируйте плагин

Далее я нажимаю «Активировать плагин».

Шаг 7: Настройте параметры плагина Divi

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

Шаг 8: Создайте статью

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

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

Далее я выбрал «Редактировать с помощью Divi Builder».

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

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

Шаг 11: Создайте макет с помощью ИИ

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

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

Разумеется, меня больше всего заинтересовал третий вариант: сборка с помощью ИИ. Это был не только самый простой способ разработки с помощью Divi, но и мне хотелось посмотреть, на что способен Divi AI.

Шаг 12: Подтвердите подписку на Elegant Themes

Перед генерацией текста с помощью Divi AI мне пришлось подтвердить свою подписку на Elegant Themes с помощью ключа API и имени пользователя.

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

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

Шаг 14: Создайте ключ API

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

Шаг 15: Подтвердите свою учетную запись

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

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

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

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

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

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

«Этот сайт предлагает лучшие инструменты дизайна, ресурсы и источники вдохновения, которые оцениваются и проверяются графическим дизайнером».

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

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

1. Стоковые изображения
2. Изображения, созданные AI
3. Изображения-заполнители

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

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

После того как все было заполнено, я нажал «Создать макет».

Шаг 18: Создайте макет

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

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

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

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

Wix

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

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

С другой стороны, 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 позволяет легко создавать привлекательные, адаптивные веб-сайты с помощью функции редактирования с помощью перетаскивания, более 180 готовых шаблонов и понятным интерфейсом.

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

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

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

Обзор Divi: нужный вам инструмент?

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

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

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

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

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

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

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

Divi лучше Wix?

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

Divi лучше Squarespace?

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

Подходит ли Divi для новичков?

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

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

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