Attenzione!

Questo articolo contiene codice PHP ed è destinato agli sviluppatori. Offriamo questo codice come cortesia, ma non forniamo supporto per personalizzazioni del codice o sviluppo di terze parti.

Per ulteriore assistenza, consulta il tutorial di WPBeginner su come aggiungere codice personalizzato.

Chiudi

Come creare intervalli di tempo aggiuntivi per il selettore di orario

Desideri personalizzare gli intervalli di tempo disponibili nel selettore Orario del campo Data/Ora? Per impostazione predefinita, il selettore di orario offre intervalli impostati su 15 minuti, 30 minuti e 1 ora.

intervalli di tempo predefiniti disponibili selettore di orario

Tuttavia, se hai bisogno di incrementi di tempo più specifici, puoi facilmente creare intervalli aggiuntivi per soddisfare al meglio le tue esigenze. In questo tutorial ti mostreremo come!

Aggiungere intervalli di tempo aggiuntivi

Inizieremo aggiungendo lo snippet di codice che creerà intervalli di tempo aggiuntivi nel nostro generatore di moduli. Per fare ciò, dovrai copiare e incollare questo snippet di codice sul tuo sito.

Se hai bisogno di aiuto per aggiungere snippet di codice al tuo sito, consulta questo tutorial.

/**
 * Add additional time intervals for the Time field Interval dropdown
 *
 * @link   https://wpforms.com/developers/how-to-create-additional-intervals-for-the-date-time-field-time-picker/
 */

function wpf_dev_datetime_time_intervals( $intervals ) {
      
     // Add time interval of 5 minutes
     $intervals[ '5' ] = esc_html__( '5 minutes', 'wpforms' );
     ksort( $intervals );
  
     return $intervals;
}

add_filter( 'wpforms_datetime_time_intervals' , 'wpf_dev_datetime_time_intervals', 10, 1 );

La variabile $intervals[ '5' ] conterrà i minuti. Se volessi creare un blocco di 4 ore, ad esempio, cambieresti il 5 in 240.

Creazione del tuo modulo

Successivamente, dovrai creare un nuovo modulo e aggiungere un campo Data / Ora a questo modulo. Ai fini di questo tutorial, separeremo la data in un campo e l'ora in un campo separato.

Se hai bisogno di aiuto nella creazione del tuo modulo, consulta questa documentazione.

Poiché abbiamo aggiunto prima il nostro snippet, una volta aggiunto il campo Orario al nostro modulo e aperto le Opzioni avanzate, vedremo nel menu a discesa per Intervalli il nuovo intervallo che abbiamo appena aggiunto.

Seleziona la nuova opzione e salva il modulo.

intervalli aggiuntivi per il selettore di orario sono ora disponibili una volta aggiunto lo snippet

Ora, quando i tuoi visitatori compileranno il modulo, vedranno che il selettore di orario mostra blocchi ogni 5 minuti.

ora puoi vedere il nuovo campo selettore di orario mostra correttamente gli intervalli di tempo aggiuntivi nel menu a discesa

Desideri creare anche formati aggiuntivi per il campo Orario? Dai un'occhiata al nostro articolo su Come creare formati aggiuntivi per il selettore di orario del campo Data/Ora.

Filtro di Riferimento

Riferimento filtro: wpforms_datetime_time_intervals

FAQ

D: Posso aggiungere più di un intervallo di tempo alla volta?

R: Assolutamente! Puoi crearne quanti ne desideri utilizzando questo formato per il tuo snippet.

/**
 * Add additional time intervals for the Time field Interval dropdown
 *
 * @link   https://wpforms.com/developers/how-to-create-additional-intervals-for-the-date-time-field-time-picker/
 */
 
function wpf_dev_datetime_time_intervals( $intervals ) {
       
     // Add time interval of 5 minutes
     $intervals[ '5' ] = esc_html__( '5 minutes', 'wpforms' );
	
	 // Add time interval of 2 hours
	 $intervals[ '120' ] = esc_html__( '2 hours', 'wpforms' );
	
     ksort( $intervals );
   
     return $intervals;
}
 
add_filter( 'wpforms_datetime_time_intervals' , 'wpf_dev_datetime_time_intervals', 10, 1 );