Ajouter un sélecteur de date de livraison à la page du panier

Vous pouvez inclure un calendrier sur la page du panier d'achat pour permettre aux clients de spécifier la date de livraison de leur commande.

Inclure jQuery dans theme.liquid

Pour que cette personnalisation fonctionne correctement, certains modèles nécessitent l'ajout de balises de script jQuery dans le fichier de mise en page theme.liquid. Si vous utilisez le modèle gratuit Shopify Online Store 2.0, vous devrez peut-être suivre les étapes ci-dessous :

1. existent Mise en page cliquez sur theme.liquid.
2. Trouver la fin du code </head> Marqueur. À l'extrémité de la </head> Dans la nouvelle ligne au-dessus du marqueur, collez le code suivant :

{{ '//ajax.googleapis.com/ajax/libs/jquery/2.2.3/jquery.min.js' | étiquette_script }}

3. cliquez surenregistrer (un fichier, etc.) (informatique).

Créer un extrait de code de date de livraison

Pour créer un extrait de code pour le sélecteur de date de distribution, procédez comme suit :

1. Dans le backend de Shopify, allez dansboutique en ligne > modèle.
2. Recherchez le modèle que vous souhaitez modifier et cliquez sur … pour ouvrir le menu des opérations, puis cliquez sur le boutonModifier le code.
3. existent Bribes cliquez surAjouter un nouvel extrait de code.
4. Créer des extraits de code :
   1. Nommez l'extrait de code date de livraison.
   2. frappe (sur le clavier)Création d'extraits de code. Le nouveau fichier d'extrait de code s'ouvre dans l'éditeur de code.
5. nouveau date de livraison.liquide Dans l'extrait de code, collez le code suivant :

{{ '//code.jquery.com/ui/1.9.2/themes/base/jquery-ui.css' | stylesheet_tag }}



  

    Choisissez une date de livraison:
    
     Nous ne livrons pas le week-end.
   
 



<script
  window.onload = fonction() {
      si (window.jQuery) {
        laisser $ = window.jQuery ;

        $(fonction() {
          $("#date").datepicker({
          minDate. +1,
          maxDate : '+2M',
          beforeShowDay : $.datepicker.noWeekends
        }) ;
      }) ;
    }
  }

6. cliquez surenregistrer (un fichier, etc.) (informatique).

Inclure l'extrait de code dans la page du panier d'achat

Pour inclure l'extrait de code de la date de livraison dans la page du panier d'achat, procédez comme suit :

1. existent Sections cliquez sur éléments de la carte principale.liquide.
2. Trouver la fin du code </form> Marqueur. À l'extrémité de la </form> Dans la nouvelle ligne au-dessus du marqueur, collez le code suivant :

{% render "delivery-date" (date de livraison) %}

3. cliquez surenregistrer (un fichier, etc.) (informatique).

La page de votre panier d'achat comporte désormais un champ de saisie de la date de livraison. Lorsque vous cliquez sur le champ de texte, un calendrier apparaît :

lien original https://help.shopify.com/zh-CN/manual/online-store/themes/customizing-themes/add-date-picker