Grégoire Noyelle

Créateur de thèmes WordPress :: Formateur :: Web Designer

  • Votre Projet
  • Formations
  • Tutoriels
  • Newsletter
  • Liens
  • Contact
Retour vers la page Tutoriels avec la liste de tous les tutos.
Pour rester informé, abonnez-vous à la newsletter

ACF :: Créer une date Intertionalisable

Mis à jour le 18 novembre 2015 :: 15 commentaires

Autres tutoriels sur le sujet

  • WordPress :: Créer un widget Text Rotator avec ACF Pro et ACF Widgets
  • WordPress :: Créer un widget Slick Slider avec ACF Pro et ACF Widgets
  • WordPress :: Créer un widget avec ACF Pro et ACF Widgets
  • WordPress :: Utiliser le champ Image d’ACF dans vos thèmes
  • WordPress :: Comment forcer l’activation d’Advanced Custom Fields (ACF)
  • ACF Pro :: Ajouter des pages d’options WordPress
  • WordPress :: Réduire les dépendances d’Avanced Custom Fields
  • WordPress :: Utiliser les cases à cocher d’Avanced Custom Fields (ACF)
  • WordPress :: Créer des articles relatifs avec Advanced Custom Fields (ACF)
  • WordPress :: Utilisation basique d’Advanced Custom Fields (ACF)

Nous verrons dans ce tutoriel comment créer un champ de date dans ACF qui est internationalisable en fonction de la langue choisie dans le back-office. Ce tuto est inspiré de la documentation en ligne d’ACF.

Création du champ de date dans ACF

Je vais d’abord créé un champs date avec les réglages par défaut.

Capture: Installation du Champs date dans ACF

Afficher la date dans la boucle

D’abord, tous les formats de date disponibles dans WordPress sont dans le codex.

Enregistrement des données

Les données sont enregistrées sous la forme PHP car par défaut, ACF utilise un format jQuery.

<?php
$date_d = get_field('gn_date_debut');

// Extraire Y,M,D
$y = substr($date_d, 0, 4);
$m = substr($date_d, 4, 2);
$d = substr($date_d, 6, 2);

// Créer le format UNIX
$time_d = strtotime("{$d}-{$m}-{$y}");
?>
  • j’obtiens le résultat du champs avec la variable $date_d
  • j’extrais chaque partie de la date avec les trois variables qui suivent au format PHP
  • avec la variable $time_d, je créée la version Unix de la date avec toutes variables précédentes

Afficher les données

<p class="date_month">Du</p> 
<p class="date_day">
<?php echo date('d', $time_d); ?>
</p>            
<p class="date_month">
<?php echo date_i18n('M', $time_d); ?>
</p>
  • la première date n’a pas de format particulier car c’est un nombre
  • la deuxième date utilise la fonction date_i18n. Elle permet d’afficher la date au bon format si elle a utilisée le format Unix (voir plus haut avec la variable $time_d)

Résulat en ligne

Dans mon exemple en ligne, j’ai une date de début et une date de fin mais le principe reste le même dans les deux cas.

Capture: ACF résultat en ligne du champs date

Enjoy!!

FacebookLikeTweetLinkedInEmailPrint

Catégorie(s) : Tutoriels, WordPress tutos Étiqueté : intermédiaire, Plugin ACF, Tuto WordPress

A propos de l'auteur

Grégoire Noyelle, Créateur de Thèmes WordPress, Formateur spécialiste sur WordPress, WooCommerce, HTML et CSS (Grid Layout) dans son centre de Formation dédié au CMS WordPress. Suivez moi sur Twitter ou LinkedIn.
[En savoir plus]

Commentaires

  1. Julien Maury a écrit

    21 février 2014 à 14 h 37 min

    Salut, Grégoire, merci pour cet article. Effectivement la gestion des dates est un point-clé et ACF est une bonne solution pour automatiser tout cela en évitant les soucis éventuel de timestamp.

    Attention la fonction PHP est substr() et pas subtr() (erreur de frappe) , elle ne stocke pas mais coupe la chaîne où cela nous arrange.

    Répondre
    • Grégoire Noyelle a écrit

      21 février 2014 à 14 h 54 min

      Salut Julien
      Merci pour tes remarques. J’ai corrigé mes coquilles 🙂

      Répondre
  2. Rahe a écrit

    21 février 2014 à 17 h 32 min

    Hello,
    Le fait d’enregistrer ta date au format yymmdd permet de faire directement un strtotime sur le retour de ta valeur et avoir un timestamp 😉

    $time_d = strtotime(get_field('gn_date_debut'));

    Répondre
    • Grégoire Noyelle a écrit

      21 février 2014 à 21 h 44 min

      Merci Nicolas 🙂 C’est corriger.

      Répondre
  3. Jonathan Buttigieg a écrit

    21 février 2014 à 20 h 39 min

    Salut Grégoire,

    Je ne comprends pas pourquoi tu fais ta moulinette pour obtenir le timestamp de la date. Il te suffit de mettre « Yes » a « Save as timestamp? » dans les options du champ pour que tu es directement $time_d = get_field(‘gn_date_debut’);

    Répondre
    • Grégoire Noyelle a écrit

      21 février 2014 à 21 h 47 min

      Salut Jonathan. Merci. C’est bien d’être entouré d’experts (+Nicolas). J’ai modifié.

      Répondre
    • Alexandre Sadowski a écrit

      21 février 2014 à 22 h 41 min

      Jonathan,
      Il me semble que l’option d’enregistrement « Save as timestamp? » se trouve dans l’add-on : http://www.advancedcustomfields.com/add-ons/date-time-picker/ et non dans le champ « date » se trouvant dans le coeur d’ACF

      Répondre
      • Grégoire Noyelle a écrit

        21 février 2014 à 22 h 45 min

        Merci Alexandre. Oui effectivement, en natif je n’ai rien trouvé.

        Répondre
        • Jonathan Buttigieg a écrit

          22 février 2014 à 12 h 16 min

          Oui en effet, ce n’est pas disponible en natif, c’est via le plugin indiqué par Alexandre 🙁

          Répondre
  4. Alexandre Sadowski a écrit

    21 février 2014 à 22 h 38 min

    Hello Grégoire,

    D’autres petites astuces également à connaitre avec les dates d’ACF. Le fait d’enregistrer un format « yymmdd » pourra te permettre de faire des meta_query pour faire des comparaisons entre deux dates et bien meilleur que si le format était sauvegardé en timestamp.

    Autre astuce si jamais tu enregistres ta date au format timestamp « @ », jQuery t’enregistrera le timestamp en ms hors le timestamp UNIX est en secondes, il faudra donc à chaque fois faire  » * 1000  » pour avoir le bon résultat attendu.

    Répondre
    • Grégoire Noyelle a écrit

      21 février 2014 à 22 h 50 min

      Merci encore Alexandre. J’ai ajouté ton commentaire dans l’article.

      Répondre
    • Jonathan Buttigieg a écrit

      22 février 2014 à 12 h 15 min

      Est-ce que tu pourrais expliquer pourquoi (ou via un exemple) le format yymmdd est bien meilleur que le timestamp ? Tu parles de perf ou meilleur en terme de manipulation ?

      Pour le timestamp jQuery, c’est bizarre que tu es ce comportement, parce que perso il me l’enregistre bien directement en secondes. J’ai peut-être loupé quelque chose à un moment.

      Répondre
      • Alexandre Sadowski a écrit

        25 février 2014 à 23 h 12 min

        Effectivement je me suis mal exprimé. Je parlais en terme de manipulation et non en terme de performance.

        Pour le timestamp jQuery, le problème est sur le « date » natif d’ACF et non sur l’add-on cité plus haut.

        Répondre
  5. Olivier a écrit

    26 septembre 2018 à 12 h 00 min

    Bonjour, dans le cadre de séances de cinéma, je souhaiterais rajouter un custom field dans mes champs date pour signaler que certaines séances (mais pas toutes donc) sont accessibles au malvoyants/malentendants par l’affichage d’un picto à côté de la date. Une idée ? Merci

    Répondre

Rétroliens

  1. WordPress :: utiliser les dates d'Advanced ... ... dit :
    24 février 2014 à 12 h 13 min

    […] Nous verrons comment utiliser le champ de date Advanced Custom Field ACF dans WordPress. Le format supportera l'internationalisation.  […]

    Répondre

Laisser un commentaire Annuler la réponse

Votre adresse de messagerie ne sera pas publiée. Les champs obligatoires sont indiqués avec *

Ce site utilise Akismet pour réduire les indésirables. En savoir plus sur comment les données de vos commentaires sont utilisées.

Article / Page: ACF :: Créer une date Intertionalisable. Retour vers l'accueil

Tutoriels par Thèmes

  • Tous les Tutoriels
  • WordPress
  • Web Design
  • Photoshop
  • Mailchimp

Séries complètes de Tutoriels

  • Les bases de Grid Layout

Recherche dans les Tutoriels

S’inscrire à la Newsletter

Pour s’inscrire, suivre ce lien qui vous redirige vers le formulaire d’inscription (compatible RGPD). Vous pouvez vous désincrire à tout moment.

Partenaires

Divi WordPress Theme

WordPress Theme Editor

capture: Personnaliser son thème WordPress avec Genesis

WordPress est une matière première
Nous pouvons …

... créer

Commençons votre Projet

Toute création est la résultante d’une combinaison unique d’idées, d’outils adaptés à vos besoins. Nous pouvons réaliser un site WordPress, mettre en place une nouvelle formation, créer une interface.

[Quel est votre besoin]

... transmettre

Créons une formation

Formateur à l’école des Gobelins et à Apaxxdesigns, j’interviens également au sein des entreprises ou chez des particuliers sur plusieurs disciplines. Enfin, je mets à disposition de nombreuses ressources sur ce site.

[Voir les modules et ressources]

... échanger

Distinguons votre demande

Mon parcours multidisciplinaire me permet de m’adapter à des projets complexes. Nous pouvons prendre contact ou dans un premier temps mieux cerner votre projet.

[En savoir plus]

Derniers Tutoriels

Devenir créateur de thèmes WordPress en 2019

Dans cet article, je parlerai du métier de concepteur de thème, et je tenterai de dresser un tableau … [Lire la suite...]

Créer des blocs pour l’éditeur moderne avec ACF 5.8

Dans ce tutoriel, nous verrons comment créer une extension WordPress pour ajouter vos blocs dans … [Lire la suite...]

Créer des couleurs sur mesure avec l’éditeur moderne

Dans ce tutoriel nous verrons comment ajouter des couleurs sur mesure dans l’éditeur moderne de … [Lire la suite...]

L’éditeur moderne de WordPress avec Grid Layout CSS

Dans ce tutoriel, nous verrons comment utiliser l'éditeur moderne de WordPress pour créer des pages … [Lire la suite...]

Utiliser le login de WooCommerce dans votre thème

Dans ce tutoriel nous verrons comment utiliser la fonction de login de WooCommerce dans les modèles … [Lire la suite...]

Tester les emails WooCommerce avec Local de Flywheel

Dans ce tutoriel sur WordPress, nous verrons comment envoyer les emails WooCommerce avec … [Lire la suite...]

Ajouter un nouveau menu responsive dans Genesis

Dans ce tutoriel, nous verrons comment ajouter un nouveau menu responsive dans votre thème Genesis. … [Lire la suite...]

Voir tous les tutoriels

Tutoriels populaires

WordPress :: Migrer son site du local vers le serveur en ligne

Dans ce tutoriel, nous verrons comment passer d’une version locale de site vers une version en … [Lire la suite...]

WordPress :: Créer un réseau de sites

Le réseau de site permet d'utiliser un seul site WordPress avec sa base de données pour générer … [Lire la suite...]

WordPress :: Gestion complète des Menus

Dans ce tutoriel nous verrons en détail comment créer et gérer les menus WordPress. Aussi nous les … [Lire la suite...]

WordPress :: Intégrer une galerie Photo

Dans ce tutoriel nous verrons comment fonctionne la galerie d’images WordPress. Toutes les étapes … [Lire la suite...]

WordPress :: Migrer son site avec le script d’Interconnectit

Dans ce tutoriel nous verrons comment migrer un site d'un emplacement A à un emplacement B. Pour les … [Lire la suite...]

Genesis :: introduction au framework de thème WordPress

Voici le premier volet d'une longue série sur le Framework de thème Genesis. Nous verrons des … [Lire la suite...]

WordPress :: Utilisation basique d’Advanced Custom Fields (ACF)

ACF : Advanced Custom Fields est un plug-in très puissant et très bien documenté. Il est créé par le … [Lire la suite...]

Voir tous les tutoriels

Social

  • GitHub
  • LinkedIn
  • Flux RSS
  • Twitter

Formations actives

  • Toutes les formations
  • WordPress Niveau 1
  • WordPress Niveau 2
  • WordPress Niveau 3
  • WordPress Niveau 4
  • CSS3 Avancés
  • CSS3 Grid Layout
  • WooCommerce Niveau 1
  • WooCommerce Niveau 2

Centre de Formation WordPress

  • Votre Formateur WordPress
  • FAQ sur le centre de formation
  • Salle de formation
  • Témoignages sur le centre de formation
  • CGV du centre de formation
  • Charte de qualité du centre de formation
  • Réglement intérieur du Centre de formation

Liens Rapides

  • S’inscrire à la newsletter
  • CV
  • Grégoire Noyelle
  • Partenaires
  • Membres Modules
  • Mentions légales
  • Politique de confidentialité
  • Me contacter

Copyright © 2019 :: Création: Grégoire Noyelle :: Base: WordPress , Genesis Framework :: Se connecter

Share this ArticleLike this article? Email it to a friend!

Email sent!
Nous utilisons des cookies pour vous garantir la meilleure expérience sur notre site web. Si vous continuez à utiliser ce site, nous supposerons que vous en êtes satisfait.OkPolitique de confidentialité