С помощью плагина SearchWP Modal Search Form вы можете с легкостью интегрировать удобную упрощенную модальную форму поиска в ваш сайт WordPress! Плагину SearchWP Modal Search Form не требуется SearchWP, но он будет его использовать, если SearchWP уже установлен и активирован! 👍
Помимо информации, представленной в разделе README, вы также можете ознакомиться и с полной документацией.
Чем он отличается от других модальных форм?
Философия SearchWP Modal Search Form заключается в том, чтобы упростить реализацию доступных и легких модальных форм поиска, но, пожалуй, самое важное — это сделать их удобными для разработчиков (и пользователей).
SearchWP Modal Search Form напрямую интегрируется с WordPress в том виде, в котором вы его используете, а стандартная тема модальной формы использует стили, установленные вашей активной темой, что максимально снижает нагрузку на сервер. Также есть встроенный загрузчик шаблонов, позволяющий без труда настроить плагин SearchWP Modal Search Form.
На примере стандартного шаблона можете убедиться, насколько легко все настраивается🤓
Добавление модальных форм на сайт
С плагином SearchWP Modal Search Form модальные формы поиска можно без проблем размещать в любом месте сайта WordPress. Вам доступны следующие способы размещения:
- В виде пункта меню
- С помощью шорткода
- В виде блока Gutenberg
- Программным путем в пределах вашего шаблона или шаблонов
Настройка шаблона
В плагин SearchWP Modal Search Form встроен удобный загрузчик шаблонов, благодаря которому формы поиска могут отображаться в любом количестве шаблонов, а вы можете полностью настраивать вид модального окна для каждого шаблона.
Самый простой способ создания произвольного шаблона:
- Создайте в своей теме папку с именем
searchwp-modal-form - В этой папке создайте файл с именем
template.php(или любым именем, заканчивающимся на.php) - Скопируйте содержимое шаблона по умолчанию в этот файл
- Настройте значение
SearchWP Modal Form Nameв блоке комментариев заголовка - Внесите прочие изменения в разметку/стиль, учитывая данные из документации
Существуют события (jQuery), которые срабатывают при открытии и закрытии модальных окон. jQuery — это не зависимость, но если jQuery загружен, события будут срабатывать.
// Add a callback when a modal is opened:
jQuery('body').on('searchwpModalOnShow', function(e) {
// Focus an input in the template.
e.el.find('input').focus();
});
// Add a callback when a modal is closed:
jQuery('body').on('searchwpModalOnClose', function(e) {
alert('Modal closed!');
});
Для получения более подробной информации ознакомьтесь с полной документацией по шаблону.