SearchWP Modal Search Form

Descripción

Utiliza SearchWP Modal Search Form para integrar fácilmente un formulario modal de búsqueda accesible y ligero en tu sitio WordPress. SearchWP Modal Search Form no necesita tener SearchWP, ¡pero lo utilizará si está instalado y activado! 👍

Además de la información disponible en este README, también hay disponible documentación completa.

¿Qué lo diferencia de otras modales?

La filosofía detrás de SearchWP Modal Search Form es facilitar la implementación de formularios de búsqueda modal accesibles y ligeros, pero quizás aún más importante es hacer que sea una gran experiencia para el desarrollador (y el usuario).

El formulario modal de búsqueda de SearchWP se integra directamente con WordPress en la forma en que lo utilizas, y el tema predeterminado del formulario modal se basa en los estilos establecidos por tu tema activo, reduciendo al mínimo la sobrecarga. También incorpora un cargador de plantillas completo, que te permite personalizar completamente SearchWP Modal Search Form con las mínimas molestias.

Echa un vistazo a la plantilla por defecto para ver un ejemplo de lo fácil que es personalizarla 🤓

Añadir formularios modales a tu sitio web

SearchWP Modal Search Form facilita la implementación de formularios modales de búsqueda en cualquier parte de tu sitio WordPress. Los siguientes métodos están integrados y disponibles para ti:

1. Como elemento del menú
2. Utilizando un shortcode
3. Como bloque de Gutenberg
4. Dentro de tu plantilla o plantillas mediante programación

Personalización de plantillas

El formulario de búsqueda modal de SearchWP integra un cargador de plantillas adecuado para mostrar formularios de búsqueda en cualquier número de plantillas, lo que te permite personalizar completamente el aspecto de la modal por plantilla.

La forma más sencilla de crear una plantilla personalizada es la siguiente:

1. Crea una carpeta llamada searchwp-modal-form dentro de tu tema
2. Crea un archivo dentro de esa carpeta llamado template.php (o cualquier nombre que termine en .php)
3. Copia el contenido de la plantilla por defecto en ese archivo
4. Personalizar el valor del nombre del formulario modal de SearchWP en el bloque de comentarios del encabezado
5. Realiza cualquier otra personalización que desees en el marcado/estilo, prestando atención a la documentación.

Hay eventos (jQuery) que se disparan cuando se abren y cierran las modales. jQuery no es una dependencia, pero si jQuery está cargado los eventos se dispararán.

// 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!');
});

Consulta la documentación completa de la plantilla para obtener información más detallada.