Форма зворотнього зв'язку WordPress: п'ять кращих плагінів. Модулі для створення форм на Wordpress Чи не працює форма зворотного зв'язку wordpress

Веб-форми можуть використовуватися з різних причин, але їх головна мета - отримати зворотній зв'язок і зібрати необхідну інформацію. Однак, їх застосування виходить за рамки збору інформації, і вони використовуються для реєстрації на сайті, додатків і так далі.

Якщо ваш сайт на WordPress, і ви в пошуках багатофункціонального конструктора для створення форм будь-яких призначень, погляньте на плагін Form Maker.

WordPress Form Maker

Це один з найпопулярніших плагінів для створення форм в каталозі WordPress.org, який йде зі зручною адмінкой, вбудованим конструктором форм і безліччю варіантів налаштувань. На момент виходу цього огляду у плагіна більш 1,5 млн завантажень, 90 тис. Активних установок і середній рейтинг 4,6 зірок.

Опис Демо Завантажити

Давайте ретельно вивчимо плагін Form Maker і подивимося, які функції і можливості в нього включені.

Плагін Form Maker можна скачати або з каталогу WordPress, Або з офіційної сторінки плагіна на Web-Dorado.com. Плагін поставляється з докладною документацією і демо версією для адмінки і самих форм.

створення форми

Створювати форми з Form Maker дуже легко, і це не вимагає багато часу. Після установки і активації плагіна ви знайдете його в бічному меню вашої Консолі, де можна створювати і управляти своїми формами.

На відміну від інших плагінів, де вам доведеться створювати форми з нуля, Form Maker поставляється з 12 готовими шаблонами, Які в подальшому можна редагувати і налаштовувати по своєму бажанню.

Крім того, плагін дозволяє редагувати і зберігати форму як копію, а це значить, що шаблон не зазнає ніяких змін.

Ось, наприклад, шаблон для стандартної форми зворотного зв'язку. Ви можете перетягнути поля вгору / вниз, змінити порядок
і перемістити їх вліво або вправо для створення стовпців в формі:

Однак, якщо ви хочете створювати свої власні форми з нуля, просто натисніть на кнопку Add New (Додати нову), і плагін направить вас на сторінку створення форми.

По-перше, необхідно буде придумати назву, вибрати тему форми, а потім можна приступити до додавання полів. Form Maker має інтуїтивно зрозумілий конструктор форм, Який дозволяє додавати потрібну кількість полів в формах і переглядати зроблені вами зміни:

існують різні варіанти полів, Які можна додати в форми. Вони призначені для введення тексту, часу і дати відправлення файлів, інтеграція з PayPal, захисту Captcha та інше.

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

Кожен параметр кожного поля можна налаштувати, що дозволяє регулювати властивості полів згідно з вашими потребами і бачити всі зміни при попередньому перегляді:

Налаштування форми

Тепер давайте поговоримо про налаштування вашої форми. Ви можете надати формі відмінний вид завдяки доступним шаблонами оформлення. В даний час в плагіні налічується 37 тем для форми, Які можна редагувати за допомогою призначених для користувача CSS.

Крім того, плагін дозволяє створювати свої власні теми з нуля.

Щоб налаштувати шаблон форми, необхідно зайти в його параметри (іконка з жовтим олівчиком Edit).

Після того, як ви зніміть прапорець автоматичного створення макета, ви зможете відредагувати HTML код, а також змінювати положення, додавати in-line стилі оформлення і так далі. Натисніть на відповідні кнопки, щоб додати потрібну вам поле.

параметри форми

Тут передбачений широкий спектр параметрів форми, які дозволяє налаштовувати плагін Form Maker. Наприклад, загальні параметри форми, параметри електронної пошти, способи оплати, дії після подачі форми, JavaScript, опції MySQL і умовні поля.

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

У розділі параметрів електронної пошти ви можете знайти настройки повідомлень, що відправляються користувачам і адміністраторові. Вказуйте адресу електронної пошти, тему і вставляйте текст в повідомлення для адміністратора.

В розділі відправки можна вибрати, що станеться, коли ваші відвідувачі заповнять і відправлять форму. Ви можете вибрати один з доступних варіантів, таких як залишитися в формі, зупинитися на конкретній сторінці або пості, перенаправити їх на певний URL-адресу або додати власний текст, який буде відображатися для відвідувачів після відправки форми.

Form Maker також забезпечує можливість інтеграції з PayPal. В розділі способів оплати можна регулювати налаштування оплати, як наприклад включення системи PayPal, вибір валюти платежу, податкової ставки та інше.

умовні поля - це одна з фішок плагіна Form Maker. Ця функція дозволяє приховати або відобразити поля форми в залежності від конкретних режимів, що ви встановили.

Наприклад, можна задати умовне поле, щоб запросити назва штату, якщо користувач вибрав США, як свою країну. Це буде означати, що поле з назвою штату не буде доступний широкому для інших користувачів не з США:

У розділі відправки ви можете знайти все представлені форми. Для кожної форми доступна зведення аналітичних даних таких як кількість записів, кількість переглядів форми, показник переходів і так далі.

Цей розділ також призначений для пошуку, а значить, ви можете шукати в базі даних всі поля даної форми. Крім того, ви можете редагувати або видаляти будь-які матеріали та впорядковувати поля відправки в тому порядку, який відповідає вашим потребам.

Плагін дозволяє експортувати матеріали в CSV або XML-формат для перегляду даних в Microsoft Exсel.

Form Maker дозволяє блокувати IP-адреси, Якщо вам відправляють спам через ваші форми. Для цього потрібно просто перейти в розділ Blocked IPs, вказати IP-адресу, який ви хочете заблокувати у відповідне поле і натиснути кнопку Додати IP.

Ви також можете блокувати IP-адреси з розділу відправки плагіна. Список заблокованих IP можуть бути розблоковані в будь-який час.

Add-ons

Form Maker - це багатофункціональний плагін, який поставляється з рядом доповнень, які дозволять розширити технічні можливості вашої форми.

Ось повний список доповнень Form Maker:

• Import / Export
• Save Progress
• Stripe Integration
• Google PDF Integration
• Mailchimp Integration
• User Registration
• Post Generation
• Conditional Emails
• Dropbox Integration
• Google Drive Integration
• Pushover Integration
• Calculator

підсумки

Онлайн форма незамінний інструмент абсолютно будь-якого сайту. Це найголовніший джерело зв'язку з відвідувачами вашого сайту. Форми дозволяють збирати зворотний зв'язок, проводити опитування, робити email підписки, збирати платежі клієнтів і багато іншого. Якщо ви знаєте програмування, то без праці можете створити форму для сайту. В інших випадках є безліч хороших плагінів, які можуть бути легко встановлені на сайт і використовуватися для створення форм.

stepFORM

stepFORM - WordPress плагін для створення форм будь-якої складності на базі візуального конструктора. У ньому є вбудований захист від спаму, збір відповідей на email і CRM, інтеграція з Google Analytics і Яндекс.Метрика, розрахунок вартості за формулами, прийом оплат на PayPal, Wallet One, Яндекс.Деньги і Яндекс.Касса, використання форми по посиланню в соцмережах і багато іншого.

uCalc

uCalc - популярний плагін WordPress для створення форм розрахунків різного ступеня складності. Плагін відмінно підійде для форм, в яких необхідно не тільки отримувати інформацію від відвідувачів сайту, але і виробляти автоматичні розрахунки за формулами або приймати оплати клієнтів за продаж товарів або послуг. Плагін підключається в кілька кліків і не вимагає знань програмування. Додавання форми розрахунку відбувається при редагуванні сторінки або публікації.

Contact Form 7

Contact Form 7 - один з найпопулярніших плагінів для створення форм на WordPress. За допомогою цього плагіна ви можете дуже гнучко налаштовувати вміст форм і налаштовувати відправку даних на пошту. Форми включають в себе ajax відправку, а також Captcha і Akismet проти спаму.

WPForms

WPForms дозволяє створювати красиві форми зворотного зв'язку, форми підписки, форми оплати та інші форми для вашого сайту в лічені хвилини. WPForms будуть мати гарний вигляд на всіх пристроях (мобільних, планшетних, портативних і настільних).

Ninja Forms

Ninja Forms допомагає створювати онлайн форми для WordPress за лічені хвилини за допомогою простого переміщення полів форми використовуючи мишу. Для розробників можна використовувати вбудовані хукі, фільтри і призначені для користувача шаблони полів, щоб робити все, що потрібно, на будь-якому етапі створення або відправки форми з використанням форм Ninja в якості основи.

Form Maker

Form Maker створює адаптивні форми для WordPress через простий і зрозумілий інтерфейс. Плагін дозволяє створювати різні анкети з будь-якими полями, варіантами питань і відповідей. Вам знадобиться всього кілька кліків для створення форм і пара хвилин, щоб налаштувати їх за допомогою доступних тим, стилів і параметрів відображення.

Caldera Form

Caldera Form - це безкоштовний і потужний плагін для WordPress, який створює адаптивні форми за допомогою простого візуального редактора. Плагін має безліч безкоштовних зручних доповнень як для початківців, так і для веб-розробників. Антиспам, AJAX, електронні листи з повідомленнями та відстеження записів в базі даних включені за замовчуванням.

Visual Form Builder

Visual Form Builder - це плагін, який дозволяє вам створювати і управляти всіма видами форм для вашого сайту в одному місці. Створення повнофункціональної контактної форми займає всього кілька хвилин, і вам не потрібно писати ні краплі PHP, CSS або HTML.

У цей список увійшли найпопулярніші плагіни WordPress для створення онлайн форм. Якщо ви використовуєте інші цікаві плагіни, яких немає в даному списку, то пишіть в коментарях.

Наявність контактної форми є необхідним атрибутом більшості сайтів. Так, вони дозволяють здійснювати безпосереднє спілкування з відвідувачем, особливо якщо на сайті не представлено інших способів зв'язку. Офіційний каталог WordPress налічує величезну кількість різноманітних безкоштовних плагінів, серед яких і такі, які дозволяють без будь-яких знань мов програмування створювати красиві і функціональні форми зворотного зв'язку. Розглянемо найбільш популярні з них.

Якщо Ви використовуєте теми Yelly або Root, то Вам немає необхідності встановлювати будь-які плагіни, - все вже реалізовано! Для цього досить вставити на сторінку контактної форми шорткод .

Активувати промокод на 15% для Root

Contact Form 7

Плагін Contact Form 7, про який ми писали в з наших статей, є найбільш популярним (понад мільйон установок) інструментом для створення форм на сайті WordPress. Серед його переваг можна виділити:

• передавання даних за допомогою технології AJAX;
• підтримка плагінів;
• повна підтримка плагіна Akismet Anti-Spam;
• створення як простих, так і складних форм;
• проста кастомизация як самих форм, так і всього процесу передачі даних і відправки;
• наявність спеціальних полів для певної інформації: телефонні номери, адреси електронної пошти, дати.

Ninja Forms

Ninja Forms є універсальним плагіном з Drag'n'Drop-Інтерфейс для створення контактних форм. В арсеналі доповнення велика кількість різноманітних функцій, що включають AJAX handler, Антиспам-модулі і можливість імпорту / експорту даних. Плагін підійде як новачкові (завдяки інтерфейсу Drag'n'Drop), Так і просунутому користувачеві (можливість HTML-Редагування). Ninja Forms підійде не тільки для простих форм, але також і для складних і багатосторінкових. Крім того, є можливість приймати платежі. Плагін має підтримку (з можливістю інтеграції) багатьох сторонніх сервісів, включаючи PayPal, MailChimp, Insightly та ін.

Visual Form Builder

Visual Form Builder - ще один плагін з Drag'n'Drop-Інтерфейс, що дозволяє з одного місця створювати і управляти всіма видами форм на вашому сайті. Він був спеціально створений з метою полегшення процесу створення форм. Так, одним кліком Ви зможете додавати нові поля, редагувати вже існуючі, а також застосовувати анти-спам. Легко змінити порядок полів допоможе технологія Drag'n'Drop. Також плагін підтримує експорт даних, що вводяться в CSV-Файл, настроюються повідомлення з підтвердженням, введення безлічі emailадрес.

Formidable Forms

Formidable Forms - черговий плагін для створення контактних форм, який прекрасно Вам підійде, якщо необхідні гнучкість і можливості кастомізації. Доповнення акцентовано на створенні дружніх до користувачів інтерфейсів і роботі з контактними формами. Працюючи з плагіном, Ви зможете використовувати кастомізіруемие HTML і хукі, а також візуальний стайлер і перетягування. Formidable Forms, Завдяки більш 30 опцій для полів, дозволить створити абсолютно різні контактні форми. Слід зазначити також і можливість інтеграції рішення з популярними платформами MailChimp, iContact, AWeber та ін. CRM. Крім цього, в плагін є підтримка цілого списку сторонніх платіжних систем. Крім того, в системі передбачені визначники геолокації, провайдери тим, маркетингові інструменти та ін.

Contact Form by BestWebSoft

Плагін Contact Form by BestWebSoft є простим у використанні інструментом для створення контактної форми. Серед переваг доповнення можна виділити:

• використання шорткодов для показу форми в будь-якому місця Вашого сайту;
• інтеграція з плагіном Captcha для боротьби зі спамом;
• відправка на email копії відісланого повідомлення;
• підтримка багатомовності для полів форм.

Contact Form Builder WordPress Plugin by vCita

плагін Contact Form Builder WordPress Plugin by vCita, Завдяки спеціальній функції Active Engage, Дозволить створити унікальний вид для Вашої контактної форми. Завдяки цьому модулю, контактна форма попередньо завантажується на кожну сторінку і показується в її правому нижньому кутку. Поява форми можна ініціювати за допомогою одного кліка. Також залишається можливою звична інтеграція форми в запису, сторінки або віджети.

Forms - Form builder and Contact form

Головна особливість безкоштовного плагіна Forms - Form builder and Contact form - наявність великої кількості встановлених шаблонів форм, що робить його ідеально відповідним для початківців користувачів. Крім того, рішення поставляється з Drag'n'Drop-Інтерфейс і кастомайзером полів, що з легкістю дозволить створити складні змішаного типу контактні форми.

Contact Form by WPForms

Contact Form by WPForms є полегшеною версією потужного модуля WPForms, Забезпечуючи створення як простих, так і більш складних контактних форм. Плагін використовує звичний Drag'n'Dropконструктор. За заявами розробників, плагін розцінюється як один з найшвидших в своїй сфері і доброзичливим в плані SEO. Варто відзначити ще одну особливість Contact Form by WPForms - наявність встановлених шаблонів форм.

Pirate Forms

Pirate Forms - плагін з інтуїтивно зрозумілим інтерфейсом, що дозволяє створювати прості контактні форми. Рішення, в силу своєї простоти, не володіє просунутим функціоналом, таким як створення форм підписки або інтеграція послуг оплати.

Form Maker by WD

Безкоштовне рішення Form Maker by WD, завдяки 11 попередньо встановлених шаблонів і 4 макетів, забезпечить просте створення форми контактів протягом декількох хвилин. Плагін має повну підтримку Drag'n'Drop, Призначений для користувача редактор CSS, А також підтримку декількох сторінок.

Breezing Forms

В арсеналі безкоштовного плагіна Breezing Forms є велика кількість різноманітних функцій, серед яких можна виділити наступні:

• багатосторінкові форми;
• створення полів з різними умовами без знання мови JavaScript;

Breezing Forms володіє багатьма функціями, доступними тільки в платних версіях аналогічних рішень. З його допомогою можна створювати форми контактів, форми зворотного зв'язку, опитування, форми оплати, розрахунків і різні складні форми.

Contact Form Manager

Contact Form Manager - досить популярний серед WordPress-користувачів плагін контактних форм, що дозволяє створювати кілька користувальницьких форм і розміщувати їх на Вашому сайті, використовуючи шорткоди. Доповнення включає в себе можливість відправки автоматичного відповіді. Підтримує всі найбільш поширені елементи форми, має вбудований захист від спаму і взагалі включає в себе все необхідне для створення веб-форми.

Натисніть, будь ласка, на одну з кнопок, щоб дізнатися сподобалася стаття чи ні.

I like it Не подобається

Добрий день друзі! У цьому уроці я навчу вас як створити контактну форму на WordPress за допомогою плагінів. Форма зворотнього зв'язку на WordPress служить ідеальним рішенням для тих, хто хоче підтримувати контакт зі своєю аудиторією або отримувати заявки на адресу електронної пошти на замовлення будь-яких послуг. Ми навчимося з вами робити спливаючу форму в модальному вікні. Після прочитання цієї статті ви зможете самостійно вставляти форму на свої сайти. Отже, поїхали.

Навіщо вам потрібна контактна форма WordPress?

Ви можливо будете здивовані питанням чому мені потрібна форма зворотного зв'язку на сайт вордпресс? Чому б просто не додати адресу електронної пошти на сайт, щоб люди просто мені написали?

Це найбільш поширений питання від новачків, які бояться додавати код форми на сайт, без знання програмування. По правді сказати вам взагалі не потрібен код при створенні форми зворотного зв'язку на WordPress. У цьому керівництві ми крок за кроком створимо контактну форму і зробити її може навіть самий абсолютний новачок.

Нижче приведу 3 головні причини, чому використання форми краще, ніж просто додати адресу пошти на сайт.

• - спам боти із завидною регулярністю вицепляют через свої парсери адреси пошти, де є згадка поштового домену та заносять його до себе в базу, щоб потім надсилати вам небажану кореспонденцію. З іншого боку при використанні форми зворотного зв'язку для WordPress ви рятуєтеся від проблеми засилля спамние листів на свій ящик.
• Повнота інформації - при відправці пошти люди не завжди посилають всю інформацію, яка потрібна вам. За допомогою контактної форми ви самі визначаєте, які поля вам потрібні, щоб полегшити користувачам можливість відправити вам лист (ім'я, email, номер телефону, коментар і багато іншого).
• Економія часу - форма зворотного зв'язку WordPress допоможе вам заощадити час. Крім повноти інформації, яку ви запросили у користувача і яку він вам відправить, ви також можете вказати, що чекає на наступному кроці, наприклад «Ваша заявка буде розглянута протягом 24 годин» чи Дивіться відео і багато інших корисних речей.

Нижче наведено приклад контактної форми, яку ми будемо створювати в цьому посібнику.

Почнемо-с, панове.

Крок 1: Вибираємо кращий плагін форми зворотного зв'язку для WordPress

На даному етапі нам необхідно визначитися з вибором відповідного плагіна форми. Їх існує безліч як безкоштовних, так і платних. У цьому уроці я розповім вам про різні плагіни, щоб у вас багатий був вибір. У першому випадку буде задіяний плагін WPForms.

Нижче наведені причини, через які WPForms є найкращим плагіном зворотного зв'язку:

1. По-перше це самий доброзичливий до новачків плагін. Методом простого перетягування потрібних блоків ви можете створити контактну форму в кілька кліків.
2. WPForms Lite повністю безкоштовний.
3. Коли ж ви будете готові до більш потужному функціоналу і якщо він дійсно для вас буде важливим, тоді можете перейти на версію Pro.

Дуже добре, якщо ці причини виявилися достатніми і я вас переконав, тоді рухаємося вперед.

Крок 2: Установка плагіна контактної форми WordPress

Для цього уроку ми використовуємо версію Lite, тому що це безкоштовно і зручно в роботі. Ви можете встановити його увійшовши в блогу і перейшовши в Модулі - Додати новий.

У рядку пошуку набираємо назву нашого плагіна і тиснемо Install now (Установити зараз).

Після встановлення плагіну переконайтеся, що ви його активували. Це показано тут:

Крок 3: Створення контактної форми в WordPress

Отже, після успішного завершення активації плагіна, саме час створити нашу форму зворотного зв'язку. Для цього в панелі адміністратора блогу клікніть на вкладку WPForms Menu і перейдіть в Add New (Додати нову).

Це дозволить відкрити вам конструктор Wpforms, де простим перетягуванням потрібних блоків ви можете створити контактну форму зворотного зв'язку WordPress. У безкоштовної версії Lite доступні два попередньо вбудованих шаблону (порожній і проста форма). Ви ж можете використовувати їх разом, щоб скласти потрібну і зручну для вас. У цьому прикладі для вас ми вибрали другий варіант, тобто простий контактної форми. У неї додамо ім'я, Email і текстове поле.

Ви можете клікнути на кожне поле, щоб відредагувати його. Також за допомогою миші ви можете перетягувати і міняти порядок полів форми.

Якщо ви хочете додати нове поле, просто виберіть потрібно зі списку зліва і перетягніть в робочу область.

Коли все зроблено, просто натисніть кнопку Зберегти (Save).

Крок 4: Налаштування повідомлень і Підтверджень

Після того, як ви успішно створили форму зворотного зв'язку на WordPress, дуже важливо правильно налаштувати форми повідомлень і підтверджень.

Форма підтвердження це те, що бачать ваші користувачі, коли відправляють вам заявку з форми. Це може бути повідомлення подяки або ви їх можете перенаправити на іншу спеціальну сторінку.

Форма повідомлення - це повідомлення, які отримуєте ви, коли до вас приходить нова заявка або email лист з вашого WordPress сайту.

Ви можете налаштувати обидва цих поля, перейшовши в Налаштування (Setting) всередині плагіна конструктора фор WPForms.

Ми за замовчуванням не ставили чіпати і залишили як є поле Форми Підтвердження з повідомленням «Спасибі за ваше звернення». Однак, ви маєте право поміняти його на інший текст або перенаправити користувача на окрему сторінку.

Кращим в цьому плагіні є те, що налаштування, які йдуть за замовчуванням, просто ідеальні для новачків. Їм не потрібно додумувати, що зробити або що поміняти. Все дуже інтуїтивно зрозуміло і просто. Коли ви переходите в налаштування повідомлень, все поля будуть предзаполнени динамічно.

Повідомлення за замовчуванням відправляються на ту пошту, яку в настройках вказали ви. Якщо ви хочете змінити адресат для відправки повідомлень, то його також можна легко змінити. Якщо хочете вказати декілька адрес пошти (вказуються через кому), то будь ласка, карти в руки, як то кажуть 🙂

Поле Тема email буде автоматично заповнено c вашим ім'ям форми. Поле ім'я буде братися з імені користувача (вашого імені). Коли ви будете відповідати на лист, то воно буде йти на пошту з ім'ям користувача, який заповнив контактну форму.

Крок 5: Додавання контактної форми WordPress на сторінку

На даному етапі, коли ви побудували і налаштували форму зворотного зв'язку, потрібно створити для неї окрему сторінку «Контакти», куди ви зможете її помістити. Або ви створюєте нову, або редагуєте вже існуючу сторінку, де ви можете її додати.

Ми будемо використовувати простий шорткод для вставки форми на сторінку. Просто клікніть на кнопку «Add form» і виберіть назву вашої форми, щоб вставити її на сторінку.

Відмінно. Тепер зберігаєте і сторінку і відкриваєте попередній перегляд, щоб побачити зміни.

Ось як приблизно буде виглядати форма на простий WordPress сторінці:

Якщо ви хочете просто додати форму на сторінку, то вітаю вас. Всі кроки зроблено успішно. Якщо ви хотіе додати її у вигляді віджета в сайдбар, то продовження нижче.

Крок 6: Додавання контактної форми WordPress в сайдбар

Плагін WPForms поставляється з вбудованим віджетом форми зворотного зв'язку, який ви можете додати в сайдбар або будь-яку іншу область на сайті (наприклад в підвал).

Для цього нам потрібно перейти в розділ «Зовнішній Вид» (Appearance) -\u003e Віджети (Widgets). Там ви побачите встановлений віджет плагіна форми в лівій частині. Просто беремо і простим перетягуванням задаємо порядок відображення в потрібній області в сайдбарі.

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

На цьому огляд нашого плагіна форми зворотного зв'язку WPForms завершено. Але, спеціально для вас я підготував ще огляд одного безкоштовного плагіна, за допомогою якого ми можемо зробити спливаючу форму зворотного зв'язку і все ті ж фішки, що і в попередньому. Називається він Contact Form 7. Він реально дуже потужний і козир його в тому, що він повністю БЕЗКОШТОВНИЙ!

Його можна також зробити адаптивним, тобто форма зворотного зв'язку буде пристосовуватися до розмірів екрану вашого пристрою.

Так, про всяк випадок, щоб ви знали, що вони естьJ

Як зробити контактну форму зворотного зв'язку за допомогою Contact Form 7

Продовжуємо розбиратися в питанні створення форм для прийому заявок з вашого сайту. Попереду у нас ще один плагін контактної форми вордпресс під назвою Contact Form 7. Давайте його встановимо до себе на блог і активуємо, як ми це вміємо робити.

Вона вже встановлена \u200b\u200bна моєму сайті, не на цьому блозі. Процедура стандартна. Тепер нам потрібно зайти в адмінку блогу і створити нову форму, яка буде збирати нам заявки і іншу корисну інформацію. Переходимо в розділ «Contact Form 7» -\u003e Додати нову.

Відмінно! Тепер давайте дамо їй відповідну назву, в моєму випадку цих контактних форм дуже багато. Виберемо одну, наприклад «Форма замовлення просування сайту»

Коротко розповім, що нам тут буде потрібно. В першу чергу, нам потрібно визначитися скільки полів форм ми хочемо зробити. Відразу скажу, що 100500 полів робити не потрібно і це безглуздо, по тій простій причині, що люди закриють ваш сайт і не залишать заявку. Їм потрібно спростити цей етап. Тобто якщо подумати, то нам від людини потрібно:

1. Його ім'я, щоб до нього звернутися (персональне звернення)
2. Адреса пошти (зворотний зв'язок, куди відправляти йому пропозицію)
3. Номер телефону, щоб відразу зателефонувати (якщо це станеться швидко, то він в будь-якому випадку стане вашим клієнтом)
4. Власне кнопка «Надіслати»

Це основні дані, інші ви можете вже з'ясувати в ході листування або телефонної розмови. Логічно? Я думаю, що так. Рухаємося далі.

Створення полів контактної форми в плагіні Contact Form 7

Так, з кількістю полів визначилися, тепер нам потрібно ці поля створити. Нам доступні наступні таби:

• Text (Будь-яке текстове поле, наприклад «Ім'я», «Задати питання», або будь-яке інше назву, які ви будете збирати через це поле)
• Email (тут призначення одне, щоб користувач ввів)
• URL (в це поле буде вводитися адреса сайту, інші значення не прийнятні, буде видаватися помилка)
• Tel (поле з телефонним номером для нашої форми зворотного зв'язку на WordPress, допустимі числові значення, текст дасть помилку)
• Number (Числовий діапазон значень, можна застосувати, наприклад, до ціни: «скільки ви готові заплатити за сайт? Від 23000 до 120000 рублів»)
• Date (Вказуємо дату, з якого по яке число. Приклад: «Бронювання автомобіля з 13/04/2016 по 25/04/2016»)
• Text Area (Текстова область, сюди можна вводити текст в якості коментаря)
• Drop-Down Menu (Список, що випадає). Реалізовано на моєму блозі, можете подивитися. В кінці кожної статті я пропоную користувачам створення або простого сайту, або інтернет магазину. Саме такий функціонал забезпечує дана опція.
• Checkboxes (множинний вибір, наприклад: Сайт + Створення логотипу + просування + контекстна реклама)
• Radio buttons (Вибір якогось одного пункту, наприклад: «Ви замовляєте або контекстну рекламу або таргетовану»)
• Acceptance (приймаєте умови угоди, тобто для користувача інформація, нібито публічної оферти)
• Quiz (Вікторина - серія коротких запитань, теж можна вставити в контактну форму).
• reCaptcha (Підтвердження, що ви не робот і не будете спамити.) Хороша захист від спаму. Примітка: ця опція працює, якщо ви підключили плагін Really Simple Captcha.
• File (Якщо ви хочете дати можливість користувачам завантажити вам файл, наприклад: «Прикріпіть ТЗ на розробок сайту»).
• Submit (Надіслати дані на пошту)

Отже, з полями ми визначилися, значення кожного ви теж знаєте. Давайте приступимо до складання нашої контактної форми на WordPress.

У прикладі нижче я використовував 2 поля: Ім'я, Email. Відповідно вам будуть потрібні ці вкладки:

Натиснувши на текстову вкладку (Text) ми потрапляємо в діалогове вікно:

Тут нам потрібно натиснути на галочку Тип Поля - Обов'язкове. Зроблено для того, що якщо користувач не введе в нього ім'я, то заявку він вам надіслати не зможе, буде помилка відправки, що не всі поля заповнені коректно.

Потім ви побачите шорткод для вставки цього поля і поруч з ним синя кнопка «Вставити тег». Таким чином ви додасте одне нове поле контактної форми.

Щоб ви не заплуталися я виділив його стилем. Код нижче:

А ось скрін:

Аналогічну операцію проробляємо для полі «Email». Кількома на відповідну вкладку і потрапляємо ось в таке діалогове віконце.

Абсолютно нічим не відрізняється від попереднього, просто повторюємо наші з вами дії. У мене поле емейла також має стиль. Наводжу нижче код:

А ось скрін:

І, нарешті, кнопка «Submit» (Надіслати дані). Вона у мене вся в стилях.