Come modificare le stringhe del date picker del campo data

Hai bisogno di modificare le stringhe del date picker per i mesi (lunghi e brevi)? Ti mostreremo come cambiare questo testo usando PHP.

Il Date Picker di WPForms è generato utilizzando lo script di data Flatpickr, che crea il date picker usando JavaScript.

Per impostazione predefinita, le stringhe del calendario del Date Picker sono in inglese e il primo giorno della settimana del calendario sarà la domenica.

Se desideri localizzare le stringhe di lingua utilizzate nel Date Picker, abbiamo un tutorial separato con maggiori dettagli.

Modifica delle stringhe del date picker

Regolando il codice sottostante, puoi modificare o tradurre le stringhe utilizzate per i giorni e i mesi nel calendario, oltre a regolare il primo giorno della settimana.

In questo esempio, abbiamo tradotto i giorni e i mesi in francese e abbiamo anche cambiato il primo giorno della settimana in lunedì.

Dovrai copiare il codice sottostante e aggiungerlo al tuo sito. Quindi modifica la lingua per adattarla alle tue esigenze.

Se hai bisogno di aiuto su come e dove aggiungere snippet al tuo sito, dai un'occhiata a questo tutorial.

/**
 * Translate strings for WPForms date picker and modify the first day of the week.
 *
 * @link https://wpforms.com/developers/modify-date-field-date-picker-strings/
 */

function wpforms_flatpickr_l10_strings_customization() {
   ?>

   <script type="text/javascript">

      (function () {
         if ( typeof flatpickr === 'undefined' ) {
            return;
         }

         if ( ! flatpickr.hasOwnProperty( 'l10ns' ) ) {
            return;
         }

         var flatpickrL10n = flatpickr.l10ns.default;

         if ( typeof wpforms_settings !== 'undefined' && wpforms_settings.hasOwnProperty( 'locale' ) ) {
            flatpickrL10n = Object.assign( {}, flatpickrL10n )
            flatpickr.l10ns[wpforms_settings.locale] = flatpickrL10n;
         }

         flatpickrL10n.firstDayOfWeek = 1;

         flatpickrL10n.weekdays       = {
            shorthand: [ 'Dim', 'Lun', 'Mar', 'Mer', 'Jeu', 'Ven', 'Sam' ],
            longhand : [ 'Dimanche', 'Lundi', 'Mardi', 'Mercredi', 'Jeudi', 'Vendredi', 'Samedi' ]
         };

         flatpickrL10n.months         = {
            shorthand: [ 'Janv', 'Févr', 'Mars', 'Avr', 'Mai', 'Juin', 'Juil', 'Août', 'Sept', 'Oct', 'Nov', 'Déc' ],
            longhand : [ 'Janvier', 'Février', 'Mars', 'Avril', 'Mai', 'Juin', 'Juillet', 'Août', 'Septembre', 'Octobre', 'Novembre', 'Décembre' ]
         };

      })();

   </script>
   <?php
}
add_action( 'wpforms_wp_footer_end', 'wpforms_flatpickr_l10_strings_customization' );

Ora, quando visualizzerai il menu a discesa del tuo Date Picker, vedrai le modifiche all'istante.

E questo è tutto! Hai aggiornato con successo la stringa per i mesi del Date Picker. Desideri personalizzare ulteriormente il campo Data / Ora? Dai un'occhiata al nostro articolo su Come personalizzare le opzioni data del campo Data Ora.

Azione di riferimento

wpforms_wp_footer