Как добавить форму подписки Mailrelay с помощью WordPress

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

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

На этом этапе вы можете подумать: мне интересно, но что мне нужно сделать, чтобы создать форму подписки на моем сайте WordPress? Я не знаком с кодом HTML, и мне нужно что-то простое и легкое.

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

Интересно, правда?

Важное уточнение: в этом руководстве мы будем предполагать, что вы уже создали форму подписки в своей учетной записи и что вы уже скопировали HTML-код. Поэтому мы сосредоточимся на объяснении, как добавить этот код в WordPress. Если вы еще не создали форму или не скопировали HTML-код, мы советуем вам сначала прочитать этот другой пост и выполнить указанные шаги: Формы подписки Mailrelay V3

· Как интегрировать форму подписки Mailrelay без использования плагинов

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

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

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

При этом, если вы хотите избежать перегрузки своего сайта или просто не хотите устанавливать дополнительные плагины на свой сайт WP, вы можете интегрировать HTML-код прямо на свой сайт без каких-либо плагинов.

Как?

Следуя этим шагам:

Для начала вам нужно будет войти в свой WordPress и нажать « Внешний вид» и «Виджет».

В разделе «Виджеты» мы должны найти виджет с именем « Пользовательский HTML. «Как только мы его найдем, мы можем перетащить его в область виджетов, где мы хотим добавить нашу форму согласия.

По умолчанию WordPress имеет область виджетов на боковой панели страницы.

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

В этом случае мы собираемся добавить его в наиболее распространенную область виджетов, потому что все веб-сайты WordPress имеют эту опцию по умолчанию; Добавим HTML-код на боковую панель.

Нам просто нужно перетащить виджет в эту область, добавить заголовок и вставить код, сгенерированный Mailrelay. Помните, что вы уже сгенерировали HTML-код перед тем, как начать читать это руководство.

После присвоения имени виджету (в разделе заголовка) и вставки кода (в разделе содержимого) вам нужно будет нажать кнопку сохранения.

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

* Важно помнить, что форма будет иметь стили (цвета и шрифты), настроенные в вашем шаблоне или теме.

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

Результат будет таким же; Единственное отличие состоит в том, что ваша форма согласия будет отображаться в указанной области, а не на боковой панели.

· Как интегрировать форму подписки Mailrelay в WordPress с Elementor (бесплатная версия)

Как интегрировать форму подписки Mailrelay в WordPress с Elementor (бесплатная версия)

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

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

Elementor - это плагин, который в настоящее время доступен бесплатно с более ограниченными функциями и с платной / премиум-версией с некоторыми дополнительными опциями.

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

Первое требование - установить на нашем сайте плагин Elementor. Если вы еще не установили его, перейдите на вкладку «Плагины» и нажмите « Добавить новый».

Найдите «Elementor page builder» в репозитории WordPress и нажмите «Установить».

После установки не забудьте включить его, и мы будем готовы интегрировать наш код.

Чтобы начать интеграцию, вы должны открыть страницу или раздел, в котором вы хотите ввести форму подписки. После доступа к этому разделу вам нужно будет найти модуль кода HTML.

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

После ввода HTML-кода вы увидите, как форма будет доступна в форме подписки в выбранном разделе или столбце. Убедитесь, что все правильно, и опубликуйте изменения. Результат будет виден на вашем сайте:

Как мы упоминали ранее, как в этом случае, так и в предыдущем, важно помнить, что форма будет иметь стили, установленные в вашем шаблоне или теме.

Чтобы внести изменения или модификации стиля, вам нужно будет отредактировать HTML или использовать специальные плагины, которые позволяют нам настраивать наши формы подписки (например, Bloom).

· Как интегрировать форму подписки Mailrelay в WordPress с Bloom

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

После доступа к панели администратора первое, что вам нужно сделать, это нажать на формы Bloom / Opt-in. На этой вкладке вы можете найти все формы подписки, которые вы уже создали. В этом случае мы собираемся создать новую форму с нуля, чтобы узнать, как легко интегрировать ее с Mailrelay.

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

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

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

После этого нам нужно будет выбрать провайдера электронной почты. В этом случае, поскольку у нас есть HTML-код от Mailrelay, мы можем перейти непосредственно к нижней части раскрывающегося списка и выбрать опцию «Custom HTML form» .

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

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

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

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

Итак, мы можем скорректировать изображение. Большинство стандартных шаблонов Bloom включают изображение вверху, но если вы хотите изменить его и / или заменить, например, своим логотипом, вам придется сделать это в этом разделе.

Мы дошли до раздела стилей. Если вы хотите дополнительно настроить форму подписки, изменить шрифты, цвета, фон или любой другой эстетический аспект, это место. В Opt-in Styling и Form Styling вы можете выбирать из множества вариантов и альтернатив.

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

После настройки всех полей мы можем нажать «Сохранить», чтобы сохранить нашу работу. Когда мы нажимаем «Сохранить», плагин убирает нас с экрана и отображает все активные формы подписки.

Что ж, мы уже создали и настроили нашу форму Bloom. Следующим шагом будет его правильная интеграция на наш сайт.

Для этого в формах Bloom / opt-in мы будем искать только что созданную форму, и слева мы найдем этот символ «[]».

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

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

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

Поэтому мы должны открыть страницу или раздел, чтобы отредактировать его. После доступа к нему мы нажмем кнопку «+» и в виджетах выберем блок «Шорткод». После этого мы должны ввести код или шорткод, который мы сохранили ранее. Здесь вам нужно только вставить содержимое и сохранить изменения.

После выполнения этих шагов ваша новая форма будет доступна на вашем сайте. Процесс намного проще, чем вы думали, правда?

· Заключение

Как мы видели на протяжении всей статьи, существует множество вариантов интеграции HTML-формы Mailrelay с помощью WordPress. В этом посте мы хотели сосредоточиться на методах, которые мы считаем простыми, чтобы вы перестали бояться манипулировать кодом.

Как мы видели, вы можете интегрировать Mailrelay с WordPress без плагинов, через раздел виджетов или даже с помощью Gutenberg, новой функции, предлагаемой WordPress.

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

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

А теперь вы хотите интегрировать свою форму Mailrelay на свой сайт WordPress?