Как создать онлайн-гостевую книгу для свадьбы с отзывами Divi и Auto

Этот пост является частью 4 из 5 нашего мини-сериала « Как создать элегантный свадебный веб-сайт с Divi». В этой серии мы проведем вас через самые важные части создания свадебного веб-сайта для себя или клиента с помощью Divi.

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

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

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

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

Покупка плагина

Прежде всего, вам необходимо приобрести Automatic Automatic Divi Testimonials от Noou на их веб-сайте, если у вас еще нет плагина. Как только вы разместите заказ, вы получите ZIP-файл. ZIP-файл содержит все файлы, необходимые для бесперебойной работы плагина.

Загрузка плагина Automatic Divi Testimonials

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

Перейдите в Zip-файл Divi Automatic Testimonials> Divi-automatic-testimonials> Frontend> Откройте файл формы с помощью редактора кода.

В этом примере мы будем использовать Notepad ++ для редактирования файла, но не стесняйтесь использовать любой редактор кода по своему выбору.

Изменение заголовков форм

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

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

Мы должны изменить три поля: поле «Должность», «Название компании» и «URL-адрес компании». Вы можете изменить эти два поля на все, что хотите знать о человеке. Но в этом примере мы собираемся заменить их на «Семья / друг», «Роль на свадьбе» и «Ваш собственный веб-сайт».

Должность семьи / друга

Измените метку с «Должность» на «Семья / друг», а вместо метки «Пожалуйста, введите название должности» на «Скажите, кто вас пригласил».

Название компании для роли на свадьбе

Измените метку с «Название компании» на «Роль на свадьбе» и замените метку «Пожалуйста, введите название своей компании» на «Расскажите нам, какова была ваша роль на свадьбе».

URL-адрес компании на личный веб-сайт

Измените метку с "Компания / Ваш URL" на "Ваш личный веб-сайт", а метку-заполнитель с "Пожалуйста, введите адрес своей компании или личный URL, например http://google.com" на "Введите URL своего личного веб-сайта, например http: // google. .com '.

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

После изменения кода скопируйте весь код и создайте новый файл Notepad ++, который вы замените текущим. Изменения, вероятно, не сохранятся в старом файле, поэтому нам нужно заменить файл новым. Замена старого файла новым файлом, содержащим новый код, поможет вам решить проблемы.

Сохраните файл и выйдите. Позже ваша форма будет выглядеть так:

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

Когда вы вручную пытаетесь добавить отзыв на свой сайт WordPress, вы все равно увидите заголовки «Должность» и «Название компании». Однако они никогда не появляются на вашем веб-сайте, поэтому не стесняйтесь вводить ответ на новые вопросы, которые мы задали.

Загрузка плагина

Теперь, чтобы загрузить плагин на свой веб-сайт, перейдите в Плагины> Добавить новый и загрузите измененный плагин, сохраненный на вашем рабочем столе. После активации плагина Automatic Divi Testimonials он появится в вашем меню WordPress:

Автоматические настройки Divi Testimonials

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

Добавление нового отзыва

Есть два способа добавить новую характеристику в свой список отзывов; вручную или автоматически. В некоторых случаях вам придется добавить характеристику самостоятельно. Этот плагин учитывает это.

Добавление новой характеристики вручную

Вы можете вручную добавить отзывы, нажав «Добавить отзыв» в разделе «Автоматические отзывы Divi» на вашем веб-сайте WordPress.

Здесь вы заметите, что изменения, которые мы внесли ранее, не касались серверной части плагина. Поле «Семья / друг» по-прежнему называется «Должность». Вы просто должны помнить, что именно здесь вы пишете, как этот человек связан со свадебной парой.

То же самое и для двух других полей, подходящих для деловых отзывов. «Название компании» - это поле, в которое вы вводите «Роль на свадьбе», а поле «URL» не связано с компанией.

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

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

Автоматическое добавление нового отзыва

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

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

Начать

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

Теперь начните с добавления новой страницы или откройте страницу, на которой вы хотите разместить свои отзывы. Внутри этой новой страницы нам понадобится стандартный раздел со строкой полной ширины. Добавьте в строку обычный текстовый модуль. В этом текстовом модуле введите следующий шорткод [dup] в подкатегории «Текст» вкладки «Содержимое». Этот шорткод заставит форму появиться на сайте.

Вот как должна выглядеть ваша форма при предварительном просмотре:

Назначение разных категорий

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

Демонстрация отзывов на вашем свадебном веб-сайте

Использование модуля автоматических отзывов

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

И, конечно же, вы можете соответствующим образом скорректировать стиль. В этом примере мы сделаем ваши отзывы похожими на изображение, показанное ниже. Этот стиль будет соответствовать стилю первых трех частей мини-сериала.

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

Далее перейдите на вкладку Advanced Design Settings и измените цвет значка с кавычками на «# 9b857b» в подкатегории «Интервал».

Затем перейдите на вкладку Advanced и добавьте следующий код в основной элемент на вкладке Custom CSS:

border-radius: 25px;
background: -webkit-linear-gradient(-90deg, #fffaf6 , #fae4de );
background: -o-linear-gradient(-90deg, #fffaf6 , #fae4de );
background: -moz-linear-gradient((-90deg, #fffaf6 , #fae4de );
background: linear-gradient((-90deg, #fffaf6 , #fae4de );

И вы сделали. У отзывов теперь будет градиентный цвет фона, который соответствует цвету других страниц вашего свадебного веб-сайта.

Следующий

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

Обязательно подпишитесь на нашу рассылку по электронной почте и канал на YouTube, чтобы не пропустить важное объявление, полезный совет или бесплатную поддержку Divi!