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

Установка модуля календаря событий Divi

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

Затем загрузите и активируйте модуль Divi Events Calendar Module и активируйте его.

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

Модуль Календарь событий Divi

В Divi Builder добавлены два новых модуля. Первый из них, называемый «Календарь событий Divi», отображает события в виде карточек в списке, как сообщения в блогах. Второй, называемый представлением календаря событий Divi, отображает события в календаре. Модуль просмотра календаря все еще находится в стадии бета-тестирования. В настоящее время он имеет ограниченную функциональность. Мы рассмотрим оба модуля.

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

Контент

Модуль автоматически отображает события. Он включает стандартные вкладки Divi. Вкладка Содержание Добавь немного содержание и элементы. По умолчанию добавляется синий фон.

Содержание

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

Элементы

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

Закладка

На вкладке «Дизайн» добавлены параметры макета, эскиза, текста заголовка, текста сведений, извлеченного текста и кнопки «Показать еще». Текст работает так же, как и обычный текстовый модуль. Мы более подробно рассмотрим макет, эскиз и кнопку «Показать еще». Затенение границ и рамок работает для отдельных карточек. Это то, что я хотел видеть во многих модулях Divi.

Предоставление

Макет позволяет выбрать количество столбцов (1–4), выравнивание изображения (по левому или верхнему краю), цвет фона, поля и отступы. Я поместил изображение сверху и изменил фон на белый. Между картами событий всегда появляется синий цвет.

В этом примере я установил столбцы на 2 и добавил поля и отступы, чтобы карточки соответствовали синему фону, создав границу.

Вот пример с 3 столбцами. Я могу настроить текст URL по размеру. На 3 столбца размещение изображения не вариант.

У этого есть 2 столбца с изображениями слева.

Стикер

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

В этом примере я установил углы на 36 пикселей и дал ширину границы 9 пикселей. Я изменил цвета границы и придал ей стиль вставки.

Текст

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

Показать больше кнопки

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

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

В этом примере я установил в макете 3 столбца. Я удалил границу кнопки и выровнял ее по центру. Я также удалил URL-адрес, изменил цвет текста детали, изменил текст кнопки и дал карточкам тень, чтобы они выделялись на фоне.

Модуль Divi Event Calendar View

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

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

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

Вы также можете настроить границу, фон, тени блоков и т. Д. В этом примере я установил текст модуля в верхний регистр. Сюда входит текст месяца и дня. Я также скорректировал фон, дал модулю рамку (используя стиль двойной границы) и придал ему тень блока. Граница того же цвета, что и текст.

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

Цены и документация

Вы можете получить модуль Календарь событий на сайт разработчика за 35 долларов. Включает в себя неограниченное использование Веб-сайт, пожизненная поддержка и обновления, а также 30-дневная гарантия возврата денег.

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

Другие Ресурсы

• Как создавать календари с календарем событий
• Как настроить плагин WP Events Manager
• 10 плагинов для интеграции календаря на WordPress
• 10 плагинов для управления событиями на WordPress

Конец мысли

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

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

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