Як додати форму зворотного зв'язку до WordPress. Форма зворотнього зв'язку — найкращі WP плагіни Не працює форма зворотного зв'язку wordpress

Від автора:вітаю вас, шановні читачі. Якщо вам знадобилася форма зворотного зв'язку на WordPress, тоді ця стаття саме для вас. Після прочитання статті ви дізнаєтесь, як зробити форму зворотного зв'язку на WordPress, при цьому зробити легко, швидко та якісно.

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

Як би там не було, плагін Contact Form 7 для WordPress – це один із найпопулярніших плагінів як серед плагінів для створення форми зворотного зв'язку WordPress, так і серед будь-яких інших. І справді, понад мільйон установок — цифра говорить сама за себе. Оцінка плагіна досить висока - 4,5 зірки, що відкидає всі сумніви щодо його використання. До того ж плагін вже русифікований, тому вам не доведеться перекладати поля форми та повідомлення російською мовою.

ВСТАНОВЛЕННЯ ПЛАГІНУ CONTACT FORM 7 ДЛЯ WORDPRESS

Ну що ж, пройдемо стандартний процес установки. До речі, якщо ви ще ніколи не встановлювали плагіни, тоді обов'язково ознайомтеся зі статтею «WordPress. Установка плагінів», де знайдете всі можливі способи встановлення плагінів.

В адмінці сайту переходимо в розділ Плагіни - Додати новий і в рядок пошуку вводимо назву плагіна - "contact form 7". Перший знайдений плагін форми зворотного зв'язку - потрібний варіант.

Тиснемо кнопку Встановити та активуємо плагін. Після встановлення в меню з'явиться новий розділ Contact Form 7 із кількома пунктами.

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

Можемо спробувати заповнити форму та відправити її, лист буде доставлено на адресу email, вказану в налаштуваннях профілю адміністратора. Зверніть увагу, плагін Contact Form 7 не просто пропонує стандартну форму зворотного зв'язку. Ні, плагін дозволяє гнучко її налаштовувати. До того ж форма відправляється без перезавантаження сторінки, що є додатковим плюсом. Ну і, звичайно, валідація полів форми, можливість вказати обов'язкові для заповнення поля — це ще один величезний плюс.

НАЛАШТУВАННЯ ФОРМИ ЗВОРОТНОГО ЗВ'ЯЗКУ ДЛЯ WORDPRESS

Що ж, ми використовували вже готову форму. А як щодо її зміни? Чи можливо це і чи легко це зробити? Відповідь – так – на обидва питання. Наприклад, я хочу забрати з форми поле Тема, як це зробити? Перейдемо до редагування форми у меню плагіна Форми та побачимо наступну картину.

Щоб прибрати тему, достатньо прибрати 2 відповідні рядки, обведені рамкою на скріншоті. Тут цікавий другий рядок: . Як ви вже здогадалися, це ні що інше, як шорткод, який розгортається в полі форми. В даному випадку це поле типу text зі значенням атрибута name — your-subject.

Якщо, наприклад, йдеться про текстову область нижче, її шорткод виглядає так: . Тут textarea це тег textarea форми, а your-message - ім'я даного елемента форми. Все просто.

Тут ви можете поставити цілком логічне питання: а що робити з іншими елементами форми? Як дізнатися, який шорткод відповідає, скажімо за список, що випадає? Тут також нічого складного немає. Над полем шаблону редагованої форми є кнопки, клікнувши якими ми додамо необхідні елементи у форму.

Ну а якщо все ж таки виникнуть складності, тоді вам допоможе документація до плагіна, де можна знайти безліч прикладів.

Отже, давайте як приклад видалимо тему повідомлення та додамо список із варіантами вибору теми повідомлення. Для створення списку, що випадає, клікнемо по кнопці drop-down menu. У модальному вікні, що відкрилося, заповнюємо форму. Ключовим є поле Options, в яке ми вводимо варіанти для списку, що випадає. Кожен варіант з нового рядка. Інші поля форми мають бути інтуїтивно зрозумілими. Наприклад, якщо ми відзначимо чекбокс в полі Field type (Required field), то зробимо створюване поле форми обов'язковим для заповнення. Чекбокс Allow multiple selections дозволяє створити список з можливістю вибору кількох варіантів, а чекбокс Insert a blank item as first option створить першим порожній варіант у списку. Поля Id та Class говорять самі за себе – це поля для додавання атрибутів id та class, що дозволяють надалі оформити поле.

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

Зберігаємо шаблон і пробуємо протестувати нову форму зворотного зв'язку. На сайті форма дійсно змінилася, замість текстового поля теми з'явився список, що випадає, з варіантами вибору теми.

Давайте спробуємо заповнити та надіслати форму. Форма відправляється, але oops… в отриманому листі немає обраного варіанта теми. Як так? Як виправити це непорозуміння? Не хвилюйтеся, це виправляється просто. Йдемо в редагування форми та переключаємося на вкладку Лист.

У цій вкладці налаштовується формат листа, який надходить на email із форми зворотного зв'язку. На скріншоті в першій обведеній області бачимо список шорткодів (імен полів форми), які використовуються в нашій формі зворотного зв'язку. Саме значення цих полів і підставляються шаблон листа. Ми бачимо на другій зазначеній ділянці, що для поля Тема залишилося ім'я з колишнього поля. Також у полі Message Body вказано колишній шорткод. Давайте замінимо їх відповідним тегом зі списку вище — . До речі, тут можемо змінити і email одержувача, він записаний у полі To. Також можемо змінити інші налаштування нижче, всі вони підписані і зрозумілі.

Зберігаємо зміни та намагаємося надіслати повторно листа. Тепер форма зворотного зв'язку працює, як і належить, — на email надходить лист із обраною темою.

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

ЗАХИСТ ФОРМИ ЗВОРОТНОГО ЗВ'ЯЗКУ

А що щодо спаму, можете поставити ви цілком резонне питання? Автор плагіна подбав і про це. У розділі опцій плагіна є пункт Integration.

Тут ми можемо налаштувати сервіс recaptcha від Google. Для цього вам потрібно буде перейти за вказаним посиланням на відповідний сервіс Гугла і далі дотримуватися інструкцій, щоб отримати необхідний ключ та інтегрувати каптчу з вашим сайтом.

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

Після цього у формі зворотного зв'язку з'явиться нове поле з одним із варіантів питань, які ви набрали. Тепер, щоб форма вирушила, необхідно дати правильну відповідь на запитання.

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

На цьому маю все. Пограйтеся з плагіном Contact Form 7 для WordPress, спробуйте створювати різні форми, повірте, є ще маса можливостей для дослідження. Якщо ж у вас виникнуть питання, тоді я, як завжди, чекаю на них у коментарях. Успіхів!

Форма зворотного зв'язку – один із найважливіших елементів на сайті чи блозі на WordPress

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

Що потрібно для створення зворотного зв'язку на WordPress?

Зворотний зв'язок може бути створений у різний спосіб. Найкраще рішення – за допомогою плагіна. Найбільш затребуваними є:

  • Contact Form 7;
  • Usernoise;
  • SimpleModal Contact Form;
  • Custom Contact Forms;
  • Slick Contact Forms.

Чому варто зробити вибір саме на користь плагінів WordPress? Тому що вони мають масу переваг, наприклад, постійно оновлюються, що у свою чергу гарантує надійність. До того ж, підходящий плагін для WordPress є найкращим помічником, який допоможе зручно розробити сайт, а контактна на сайті буде додана без зусиль. І це не кажучи вже про різні корпоративні сайти, що продають, де буває нерідко потрібна досить специфічна контактна форма.

Contact Form 7 – швидкий контактний зв'язок та простота налаштувань

Плагін CF 7 дає можливість легко і просто створювати та налаштовувати зворотний зв'язок. Він дуже легкий, абсолютно не вантажить сайт, а також вважається найпростішим у налаштуванні. Багато хто вибирає саме його, працюючи з ВордПрес. Contact Form повністю русифікований, що дуже зручно, та має інтуїтивно зрозумілі налаштування, розібратися з якими дуже легко. При цьому він повністю безкоштовний і гнучкий. Є як проста установка – для всіх, кому подобається простота, так і багато глибини та складності – для всіх, хто любить заглибитись. Підтримує різні форми у вікні, відправку через AJAX, інтеграцію з Akismet, завантаження файлів, а також оснащений захистом від спаму за допомогою капчі і текстового питання. Багато хто визнав його одним із найкращих плагінів для системи управління контентом. CF 7 дозволяє створювати на сайті на WordPress найрізноманітніші складні форми. У списку відразу відображаються шорткоди, необхідні для вставки на сторінку.

Usernoise – спливаюча і красива форма зворотного зв'язку

Usernoise має дуже широкий функціонал, дозволяючи зробити гарну і просту у розумінні спливаючу форму у вікні. Але є певний мінус - повна частина його можливостей представлена ​​платною версією. Однак багатьом достатньо функцій, які представлені у безкоштовному варіанті. За промовчанням Usernoise для WordPress вже налаштований як потрібно, все, що потрібно – просто його ввімкнути. Подальші налаштування, за бажанням власника сайту, здійснюються також неважко. Можна змінювати розташування кнопки, змінити її колір і тло тексту, додати іконку до кнопки, змінити шрифт та змінити стандартні написи. Все це легко налаштовується з адмінки. За його допомогою кнопка стане унікальною. Плагін повністю русифікований, що максимально полегшує роботу з ним. Ідеально підходить для блогів. Usernoise підтримується практично всіма відомими браузерами - Opera, Firefox, Safari, IE7 (від 7 версії). Головною перевагою даного плагіна є його висока продуктивність, він не впливає на швидкість завантаження.

SimpleModal Contact Form – швидка спливаюча форма у модальному вікні

SimpleModal Contact Form (SMCF) є зворотним зв'язком, який інтегрований в модальне спливаюче вікно. Працює на WordPress за допомогою jQuery. Плагін російськомовний завдяки Миколі М'ясникову та іншим «народним умільцям», які беруть участь у його русифікації. Переклад російською мовою виконано максимально грамотно, враховуються всі найменші деталі. Спливаюче вікно, яке виводить SMCF зовні нагадує вікно плагіна Lightbox. Це дуже зручна річ для всіх, хто хоче дати можливість користувачам написати листа, просто у спливаючому вікні будь-де – наприкінці посту, на окремій сторінці або в Сайдбарі. Все працює дуже швидко та зручно. Установка здійснюється традиційним способом. Також зворотна форма перевіряє правильність заповнення полів уведення. У опціях є можливість зробити автоматичне встановлення заголовка сторінки в темі листа, що є досить вагомою гідністю, коли він використовується для замовлення до опису товарів. Тема листа дозволить одразу побачити який товар замовлено.

Custom Contact Forms – зворотні форми будь-якої складності

Плагін Custom Contact Forms (CCF) дуже популярний сьогодні. З його допомогою можна створити форми будь-якої складності на WordPress. Але, слід зазначити, що CCF немає російської локалізації. Хоча це не відіграє особливої ​​ролі, оскільки розібратися в ньому простіше, навіть тим, хто не знає англійську мову. Створені форми вставляються у будь-які сторінки, матеріали та окремі записи. Для створення простої форми не потрібно копатися в налаштуваннях, все, що потрібно - вписати код в будь-яку статтю, а далі все робиться автоматично. Є також спеціальний віджет, який можна вставити в бічну панель, або ж будь-які інші місця на сайті, відведені під віджети. Ніяких спеціальних знань CSS для налаштування при цьому не потрібно, а налаштовується практично будь-який аспект: кольори, розміри, межі, відступи. Управління стилями здійснюється прямо в адмінці WordPress, там, де налаштовуються всі поля введення значень. Працює на сучасних технологіях Ajax та jQuery.

Slick Contact Forms – просте додавання кількох зворотних зв'язків

Плагін для ВордПрес Slick Contact Forms створює віджет, який може бути застосований для додавання декількох форм контакту на сторінці. З ним зворотну можна зробити плаваючою, що випадає і виїжджає. З'являється при кліку за посиланням у вигляді панелі, що розкривається. Вигляд дуже акуратний та красивий. Вставляти її в блог досить просто, особливо якщо використовувати віджет. Віджет вже містить всі необхідні параметри та налаштування – швидкість розгортання та згортання, ширину, загальну назву та назву полів, кількість полів, положення на екрані, зворотну електронну адресу, розташування текстових полів. Є також кілька варіантів оформлення. Можна зробити і з використанням шорткоду, але це складніше. Це один із найбільш дружніх та надійних інструментів WordPress.

Всі плагіни, перераховані вище, заслуговують на увагу і мають свої переваги. Однак вибір залежатиме від особистих переваг. Наприклад, якщо необхідно вбудувати зворотний зв'язок у сторінку, то краще вибирати перші плагіни, зокрема Contact Form 7. Якщо спливаючі вікна більше подобаються – краще зупинити вибір на SMCF і Usernoise.

Для покрівлі даху у Санкт-Петербурзі.

Всім привіт! Сьогодні я вам розповім, як можна поставити форму зворотного зв'язку дляWordPressза допомогою плагінів, а також простого коду різними способами. Отже, почнемо з того, що хоч форма зворотного зв'язку у мене не варто, швидше за все, вона вам знадобиться з таких причин:

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

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

- Захист свого емайл адреси. Якщо ви колись вели свою розсилку, то вам, напевно, надходили листи наступного змісту: «Продам емайл адреси недорого» і т.д. Дані емайли збирають зі всього інтернету спеціальні боти (роботи), на які згодом надсилатиметься спам листа. Якщо не хочете опинитися серед них, то вам потрібно ніде не світити (показувати) свою адресу від пошти. У моєму випадку це вже не має сенсу, тому що моє мило (пошта) гуляє по інтернету більше 3 років і зареєстровано більш ніж на 1000 сайтів.

До речі, давно, щоб хоч якось боротися зі спамом багато власників сайтів, які ще не знали про форму зворотного зв'язку, замість своєї пошти залишали її картинку. У такому разі боти не могли занести емайл до спамерської бази, але це викликало незручність для відвідувачів. Хто захоче по літерах цілу годину вводити чиюсь шухляду, коли на сьогоднішній день є дві класні кнопки «скопіювати» і «вставити».

Плагіни форми зворотного зв'язку для WordPress.

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

1 ) Отже, уявляю вам плагін Usernoise.

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

Встановлення та налаштування плагіна Usernoise.

5 ) Встановлення та налаштування плагіна Contact Form 7.

Як зробити форму зворотного зв'язку для WordPress іншими способами?

Ви можете здивуватися, але я описав тільки найменшу частину, як можна зробити форму зворотного зв'язку для WordPress. Хоч би як я намагався осягнути неосяжне, у мене це не вийшло. Отже, форму зворотного зв'язку можна зробити ще через ряд наступних плагінів: Fast Secure Contact Form, Contact Form by Contact ME, Visual Form Builder, nForms - WordPress Form Builder, Mapped Contact Form, Ninja Forms. Крім цього, ще є різноманітні сервіси, такі як main-ip.ru і smartoforms.ru.

На цьому все, якщо будуть питання, ставте.

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

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

Одним з найбільш широко використовуваних плагінів для створення форм зворотного зв'язку є Contact form 7. Він швидко набрав популярності завдяки своїй простоті в настроюванні вмісту форми. Плюс підтримує фільтрацію спаму та дозволяє встановити CAPTCHA за допомогою додаткового плагіна Really Simple CAPTCHA. Також плагін підтримує технологію Ajax, що в обробці виконання запиту веб-сторінка не перезавантажується.

Після встановлення та активації Contact form 7 на панелі керування з'явиться нова вкладка для керування форм. Щоб знайти з ним спільну мову довго возитися не доведеться, плагін мультимовний і російський є в тому числі. Контактна форма стилізується залежно від встановленої вами теми, але зі знаннями CSS можна відредагувати на власний смак.

Приклад форми.

2. Form Maker

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

Приклад форми.

3. Fast Secure Contact Form

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

Приклад форми.

4. Visual Form Builder

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

Вікно налаштувань.

Приклад форми.

5. Slick contact forms

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

Приклад форми.

Привіт, друзі! У цьому уроці ми поговоримо про створення форми зворотного зв'язку, або як ще кажуть у народі "контактної форми".

Сьогодні ми розберемо з вами як можна створити за кілька хвилин легку, гарнуі функціональнуформу зворотного зв'язку за допомогою мого улюбленого плагіна Contact Form 7 .

Я намагатимусь максимально докладно пояснити всі етапи встановлення контактної форми, і у зв'язку з цим урок вийде досить довгим 🙂

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

На самому початку хочу помітити, що плагін Contact Form 7 русифікований, і жодних проблем із ним у вас не буде. Як доказ моїх слів може виступати той факт, що цей плагін скачали БІЛЬШ 25 МІЛЬЙОНІВ РАЗІВ!!!

І так, давайте приступимо. Для створення форми зворотного зв'язку потрібно зробити наступне:

1. Встановіть та активуйте плагін Contact Form 7 . Як встановлювати плагіни ви можете.

2. Після активації перейдіть до Contact Form 7 -> Форми.

3. У вікні, що відкрилося копіюємо рядокіз кодом вставки.

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

Ось такий результатдодавання контактної форми за отримаємо:

Готово!Ви встановили робочу формузворотний зв'язок на свій сайт!

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

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

Для цього нам потрібно, щоб у формі були такі поля для заповнення:

  • Ім'я (Обов'язкове поле для заповнення)
  • Прізвище
  • Телефон (Обов'язкове поле для заповнення)
  • Поле з вибором зручного часу для дзвінка

Після того, як ми визначилися з полями, переходимо до створення форми:

1. Переходимо в Contact Form 7 -> Додати нову.

2. У вікні, натискаємо кнопку «Додати нову». Якщо потрібно, виберіть мову в списку нижче. за мовчання буде російською.

3. Після натискання кнопки ви перейдете на сторінку, де знаходиться редактор форми.

На самому верху сторінку поле, в яке пишемо назва нової форми. У Шаблону формими бачимо стандартні поля форми, які створюються за промовчанням.

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

4. Після того, як ми поверхово ознайомилися із структурою редактора, переходимо до створення нашої нової форми. Для цього нам потрібно ВИДАЛИТИз шаблону форми всі рядки крім кнопки "Відправити",а в шаблоні листа видалитивсе повністю . Після видалення у вас має вийти так:

5. Тепер нам потрібно створити нові поля: Ім'я(обов'язкове), Прізвище, Телефон(обов'язкове), Зручний час дзвінка.

Починаємо зі створення поля для введення імені, яке має бути обов'язковим для заповнення. Для цього натискаємо кнопку "Сгенерувати тег"і вибираємо Текстове поле.

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

6. Після того, як ми додали поле для введення імені, натискаємо "Сгенерувати тег" -> Текстове полета за аналогією створюємо поле Прізвищеі Телефонкопіювання та вставлення коду в шаблон форми і лист шаблон. Відмінність лише у тому, що для поля Прізвищеставити галочку для обов'язкового заповнення не потрібно .

Після додавання полів Ім'я, Прізвище та Телефон редактор форми виглядатиме так:

7. Тепер створюємо поле Зручний час дзвінка.Для цього натискаємо "Сгенерувати тег"і вибираємо "Випадаюче меню".

В полі Вибірпишемо у рядок за одним варіантом, у нашому випадку цей час з 8-00 до 18-00 з проміжками о другій годині. Після заповнення копіюємо відповідні рядки коду шаблон форми і шаблон листа.

У результаті у вас має вийти ось так:

9. Скопіюйте код форми та вставте його на сторінку, на якій вам потрібна форма. Якщо ви все зробили правильно, у вас має вийде така форма замовлення зворотного дзвінка:

Після того, як користувач зробить замовлення зворотного дзвінка з вашого сайту, на вашу пошту прийде листз таким наповненням:

ГОТОВО!Ось ми створили з вами форму замовлення зворотного дзвінка з нуля.

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

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

Сподіваюся, цей урок був вам корисним, і ви розібралися з плагіном Contact Form 7.

Якщо у вас виникатимуть по ходу створення форми запитання або щось не виходитиме. пишіть та ставте запитання у коментарях.

І пам'ятайте, що форма зворотного зв'язку на сайті – обов'язковий атрибут на сторінці контактів.

Привіт, друзі! У цьому уроці ми поговоримо про створення форми зворотного зв'язку, або як ще кажуть у народі "контактної форми". Сьогодні ми розберемо з вами як можна створити за кілька хвилин легку, красиву та функціональну форму зворотного зв'язку за допомогою мого улюбленого плагіна Contact Form 7. Я постараюся максимально докладно пояснити всі етапи встановлення контактної форми, і у зв'язку з цим урок вийде досить довгим:) Створення контактної форми WordPress На самому початку хочу помітити, що плагін Contact Form 7 русифікований, і ніяких проблем з ним у вас не буде. Як доказ моїх слів може виступати той факт, що цей плагін…

Огляд

Проголосуйте за урок

100

Оцінка

Підсумок:Шановні читачі! Не полінуйтеся проголосувати та залишити коментар. Таким чином я зможу зрозуміти корисність уроків та статей, і покращити їхню якість у майбутньому. Заздалегідь дякую!



Подібні публікації