Купить Корзина
Логотип REG.RU
  • Вход
    • Помощь
  • Помощь
  • Конструктор и CMS
  • REG.Site
  • Работа с модулями REG.Site
  • Как добавить контактную форму Contact Form 7 в REG.Site

Как добавить контактную форму Contact Form 7 в REG.Site

В статье мы расскажем, как добавить контактную форму на ваш сайт при помощи плагина и встроенного модуля: плагин — «Contact Form 7» и модуль с почти идентичным названием «Contact Form 7 формы». Мы объясним для чего они нужны, чем они отличаются и как с ними работать.

Пример формы обратной связи

Разница между модулем и плагином

Иллюстрация схожести модуля и плагина Contact Form 7 в REG.Site

Одинаковые названия элементов в этой статье могут запутать. Поэтому мы хотим объяснить разницу.

Contact Form 7 — это плагин для создания контактной формы. В нем вы сможете отредактировать поля, дать им названия, изменить положение полей и кнопок в окне. Подробная инструкция по работе с плагином по ссылке.

Contact Form 7 формы — это модуль, при помощи которого можно настроить дизайн формы без ручного написания стилей. Редактирование внешнего вида осуществляется при помощи инструментов REG.Site.

Другими словами, плагин «Contact Form 7» отвечает за работу формы, а модуль «Contact Form 7 формы» за внешний вид.

Как добавить контактную форму на сайт

Сначала установите плагин Contact Form 7 по инструкции. Затем создайте форму и настройте её шаблон.

Теперь вы можете добавить её на сайт. Для этого:

  1. 1.
    Перейдите в режим редактирования сайта.
  2. 2.
    Нажмите на серый плюс в строке, в которую хотите вставить форму обратной связи.
  3. 3.

    Выберите модуль Contact Form 7 формы:

    Список модулей в REG.Site

    Обратите внимание! Если после добавления модуля вы увидите сообщение «Contact form 7 не найдены», значит вы не создали в плагине ни одной контактной формы:

    Contact Form 7 не найдены REG.Site

    Создайте форму при помощи плагина Contact Form 7 по инструкции.

  4. 4.

    Из выпадающего списка выберите нужную форму:

    Список форм в модуле Contact Form 7 REG.Site

  5. 5.
    Чтобы сохранить изменения в модуле, нажмите на галочку.
  6. 6.
    Сохраните изменения на странице.

Готово, контактная форма добавлена на сайт. Вот так она будет выглядеть:

Пример формы обратной связи в REG.Site

Дизайн контактной формы

Чтобы форма обратной связи хорошо смотрелась на вашем сайте и сочеталась с другими элементами, настройте её внешний вид. Ниже мы расскажем об основных возможностях модуля Contact Form 7 формы.

Чтобы перейти к настройке внешнего вида:

  1. 1.
    Перейдите в режим редактирования сайта.
  2. 2.

    Наведите курсор на контактную форму и нажмите на шестерёнку:

    Редактировать модуль контактной формы

  3. 3.
    Перед вами появится окно настройки, которое состоит из вкладок: «Контент», «Дизайн», «Дополнительно».

Контент

Во вкладке «Контент» выберите блок Фон. В качестве фона можно установить:

  • сплошной цвет,
  • градиент,
  • изображение,
  • видео.

Фон контактной формы

Дизайн

Во вкладке «Дизайн» в блоке «Метки» выберите нижний интервал, шрифт, толщину и стиль шрифта, расположение и цвет текста. Также есть возможность настроить размер текста, интервал между буквами, высоту строки и тень текста:

Настройки текста в контактной форме

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

Граница поля в контактной форме

В блоке «Радио и флажок» можно настроить внешний вид чек-боксов и радиокнопок:

Настройка внешнего вида радиокнопок и чек-боксов

В блоке «Размеры» можно настроить ширину и высоту контактной формы:

Настройка размеров контактной формы

В блоке «Граница» можно настроить закругление, стиль, ширину и цвет границы контактной формы:

Настройка границы контактной формы REG.Site

Дополнительно

Блоки «ID и классы CSS» и «Пользовательский CSS» используются для работы с CSS и HTML.

В блоке «Видимость» можно можно отключить контактную форму на некоторых типах устройств:

Настройка видимости на разных устройствах

В блоке «Переходы» можно настроить скорость анимации, а в блоке «Эффект прокрутки» – поведение формы при скроллинге страницы.

Готово, контактная форма настроена.

Помогла ли вам статья?
ДаНет
раз уже помогла

Спасибо за оценку!
Как мы можем улучшить статью?

Нужна помощь?
Напишите в службу поддержки!

REG.RU
  • О компании
  • Контакты и офисы
  • Новости
  • Карьера в REG.RU
  • Руководство
  • Отзывы клиентов
Услуги
  • Стоимость услуг
  • Хостинг
  • Зарегистрировать домен
  • Конструктор и CMS
  • Создать сайт в REG.Site
  • VPS
  • Серверы и ДЦ
  • SSL-сертификат
Партнёрам
  • Партнёрские программы
  • Профессионалам IT
  • Бонусная программа
  • REG.API
  • Промоматериалы
Полезное
  • Акции и скидки
  • Мероприятия
  • Юридическим лицам
  • ЭДО
  • Whois
Помощь
  • База знаний
  • Вопросы и ответы
  • Шаблоны заявлений
  • Оставить отзыв, предложение
  • Сообщить о нарушении

+7 (495) 580-11-11

Телефон в Москве

8 800 555-34-78

Бесплатный звонок по России

           

Нашли опечатку?
Выделите и нажмите Ctrl+Enter

  • mastercard
  • visa
  • mir
  • sberbank
  • qiwi
  • yamoney
  • sbp
Все способы оплаты
© ООО «Регистратор доменных имен РЕГ.РУ» Правила пользования сайтомПолитика обработки персональных данных
Award
shop.reg.ru Магазин доменов
statonline.ru Доменная статистика
reg.ru/blog Мы пишем
  • Мы используем файлы cookie. Продолжив работу с сайтом, вы соглашаетесь с Политикой обработки персональных данных и Правилами пользования сайтом.