Как сделать форму заказа обратного звонка?

Question

[mUchenik]

Друзья, всем привет!
Посоветуйте урок или плагин для создания кнопки заказа обратного звонка, под такие хотелки:
1) хочу что бы при нажатии на кнопку, всплывало окно для ввода телефона и имени Pop Up.
2) Окно должно быть адаптированым на разные устройства.
3) после нажатия на кнопку ОТПРАВИТЬ, окно само должно исчезать
4) в приходящем письме, я должен видеть title и ссылку страницы с которой была оформлена заявка
5) желательно, что бы кнопку с этим функционалом, я мог разместить в виде кода или шорткода, в любой части своего сайта.

Answer 1

[Роман Мисюра]

Алгоритм в даном случае очень простой:
1. Любой плагин\самоделка\бутстрап (если используеться то в нем есть поп-апы) - для всплывающего окна. Туда же ставите инпуты для имени и телефона (для телефона можно использовать плагин на подобии jQuery Input Mask) - само собой необходимо сделать валидацию (регулярками можно попробовать в стиле html5 в теге прописать или на серверной стороне, либо на клиентской.
2. Адаптация наше все - либо самому писать через media query либо искать готовое решение.
3. Ловим ивент когда нажата кнопка "Отправить" и закрываем окно через js (в бутстраповских окнах есть ивенты закрытия окна). Например:

$('#myModal').on('hidden.bs.modal', function () {
  // do something…
})

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

Answer 2

[Игорь Воротнёв]

Contact Form 7 + какой-нибудь popup

https://wordpress.org/plugins/popup-for-contact-form-7/
fivera.net/contact-form-7-in-popup-window-wordpres...
www.wpbeginner.com/wp-tutorials/how-to-add-a-conta...