Usa SearchWP Modal Search Form per integrare facilmente un modulo di ricerca modal accessibile e leggero nel tuo sito WordPress! SearchWP Modal Search Form non richiede SearchWP ma lo userà se è già installato e attivato! 👍
Oltre alle informazioni fornite in questo README, puoi consultare anche la documentazione completa.
Cosa lo rende diverso dagli altri modal?
La filosofia alla base di SearchWP Modal Search Form è quella di semplificare l’implementazione di moduli di ricerca modal accessibili e leggeri, ma forse ancora più importante è quella di rendere l’esperienza di chi sviluppa (e dell’utente) eccellente.
SearchWP Modal Search Form si integra direttamente con WordPress in base a come lo usi, mentre il tema predefinito del modulo modale si basa sugli stili creati dal tuo tema attivo, e questo riduce al minimo il consumo di risorse del server. C’è anche un caricatore di template completo, che ti permette di personalizzare completamente il tuo SearchWP Modal Search Form con il minimo sforzo.
Dai un’occhiata al template predefinito per avere un esempio di quanto sia facile da personalizzare 🤓
Aggiunta di moduli modal al tuo sito
SearchWP Modal Search Form permette di implementare facilmente moduli di ricerca modal in qualsiasi punto del tuo sito WordPress. Puoi usare i seguenti metodi integrati:
- Come voce di menu
- Usando uno shortcode
- Come blocco Gutenberg
- All’interno dei tuoi template in modo programmatico
Personalizzazione del template
SearchWP Modal Search Form integra un caricatore di template per visualizzare i moduli di ricerca in qualsiasi template, consentendoti di personalizzare completamente l’aspetto del modal per ogni template.
Il modo più semplice per creare un template personalizzato è il seguente:
- Crea una cartella denominata
searchwp-modal-formall’interno del tuo tema - Crea un file all’interno di questa cartella chiamato
template.php(o qualsiasi altro nome che finisca con.php) - Copia il contenuto del template predefinito in quel file
- Personalizza il valore di
SearchWP Modal Form Namenel blocco dei commenti dell’header - Aggiungi tutte le personalizzazioni che desideri al markup/stile, facendo attenzione alla documentazione
Ci sono eventi (jQuery) che si attivano quando i modal vengono aperti e chiusi. jQuery non è una dipendenza, ma se jQuery è caricato gli eventi si attivano.
// 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!');
});
Per informazioni più dettagliate, consulta la documentazione completa del template.