Comment ajouter Date Anniversaire du Client sur Shopify

Nous allons voir dans ce tutoriel comment rajouter un champ date d’anniversaire lors de la création du compte client. C’est très pratique pour connecter un système de mailing et proposer à vos clients des offres pour leur anniversaire 😉

Installation du code

Rendez-vous dans boutique en ligne – Actions – Modifier le code et ouvrez le dossier Modèles (Templates). A l’intérieur de celui-ci vous trouverez un fichier customers/register.liquid ! Ouvrez-le et logiquement vous devriez trouver un formulaire, balise form avec des labels et des inputs.

A l’endroit souhaité copier collez le code suivant afin de rajouter la date d’anniversaire :

Version champ optionnel :

<div class="birthday-wrapper" class="clearfix large_form">
	<label for="birthday" class="label">Date d'anniversaire</label>
	<input type="date" value="" name="customer[note][birthday]" id="birthday" class="text" size="30" {% if form.errors contains "birthday" %} class="error"{% endif %}>
</div>

<style>
	.birthday-wrapper {
	display:flex;
	border: 1px solid var(--colorBorder);
	background-color: rgba(var(--color-text-body),.1);
	width: 100%;
	max-width: 100%;       
	margin: 0 0 15px;
	padding:0 0 0 1rem;
	text-align:left;
	align-items:center;
	justify-content:space-between;
	font-size:13px;       
	}
	.birthday-wrapper * {
	color:#666 !important;
	border:none;
	margin:0;
	}
	.birthday-wrapper label {
	font-size:inherit;
	}
</style>

Version champ obligatoire :

<div class="birthday-wrapper" class="clearfix large_form">
	<label for="birthday" class="label">Date d'anniversaire</label>
	<input required type="date" value="" name="customer[note][birthday]" id="birthday" class="text" size="30" {% if form.errors contains "birthday" %} class="error"{% endif %}>
</div>

<style>
	.birthday-wrapper {
	display:flex;
	border: 1px solid var(--colorBorder);
	background-color: rgba(var(--color-text-body),.1);
	width: 100%;
	max-width: 100%;       
	margin: 0 0 15px;
	padding:0 0 0 1rem;
	text-align:left;
	align-items:center;
	justify-content:space-between;
	font-size:13px;       
	}
	.birthday-wrapper * {
	color:#666 !important;
	border:none;
	margin:0;
	}
	.birthday-wrapper label {
	font-size:inherit;
	}
</style>

Il ne vous reste plus qu’a tester tout cela en vous créant un compte client de test !

Merci de me laisser une petite note 😉
[Note moyenne de: 5 sur 3 votes]

Besoin d'aide ?

Vous avez un problème pour faire fonctionner ce tutoriel ou vous avez un besoin spécifique ?
Nous pouvons le faire pour vous ! pour ce faire merci de prendre contact avec notre équipe.

En savoir plus

🤗 Vous souhaitez me remercier pour mes Tutos ?

Cliquez sur le bouton ci-dessous pour m'encourager à continuer 😉

Payer un Café à Dgeo Dev

Besoin de déléguer votre SAV ?

Si vous avez besoin d'une personne pour gérer votre SAV j'ai la perle rare 😉 contactez moi en MP ou cliquez sur le bouton ci-dessous:

Je veux déléguer mon SAV

🤗 Vous souhaitez me remercier pour mes Tutos ?

Cliquez sur le bouton ci-dessous pour m'encourager à continuer 😉

Payer un Café à Dgeo Dev

Cet article a 7 commentaires

  1. Malaika

    14 Jan 2022 Répondre

    Coucou, super tutoriel, MERCI!!
    Comment faire la même chose mais sur la page panier, lorsque le client entre ses informations ?
    merci

    1. Dgeo Dev

      15 Jan 2022 Répondre

      Hello, hum c’est assez délicat… Il faudrait un développement sur mesure.

  2. charlotte boute

    22 Sep 2022 Répondre

    Bonjour,
    Un tout grand merci pour le tuto, j’ai ajouté cela. Par contre je me demande comment retrouver cette information une fois que le client l’a encodé: en allant sur le client je n’aperçoit pas la date qu’il a encodé et je ne sais donc pas me servir de cette information si précieuse.
    merci d’avance

  3. souleimane

    12 Fév 2023 Répondre

    Bonjours j’essaye de trouver une solution à mon problème depuis plusieurs jours sans succès je voulais savoir comment changer sa date de naissance sur shopify car quand je me suis inscrit j’ai fais une erreur et maintenant pour valider shopify paiment j’ai besoin de changer ma date de naissance comment faire?
    Merci d’avance

    1. Dgeo Dev

      8 Mar 2023 Répondre

      Hello, il faudrait voir avec le support de shopify si c’est possible 🙂

  4. Hérault

    21 Juil 2023 Répondre

    Bonjour, merci pour le tutoriel mais moi j’ai customers/register.json cela fonctionne quand même ?

    1. Dgeo Dev

      27 Août 2023 Répondre

      Hello, non il faut impérativement un .liquid car les .json sont uniquement pour la config

Laisser un commentaire

Fermer le menu
×
×

Panier