Add a delivery date picker to your cart

You can include a calendar on your cart page that allows customers to specify a delivery date for their order.

Include jQuery in your theme.liquid

For this customization to work, some themes require that a script tag for jQuery is added to the theme.liquid layout file. If you use a free Shopify Online Store 2.0 theme, then you might need to follow the next step:

1. In theLayoutdirectory, clicktheme.liquid.

2. Findthe closingtag in the code. On a new line above the closingtag, paste the following code:

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

1. ClickSave.

Create a delivery date snippet

To create a snippet for your delivery date picker:

1. In theSnippetsdirectory, clickAdd a new snippet:

2. Create the snippet:

   1. Name your snippetdelivery-date.
   2. ClickCreate snippet. The new snippet file will open in the code editor.

3. In your newdelivery-date.liquidsnippet, paste the following code:

{{ '//code.jquery.com/ui/1.9.2/themes/base/jquery-ui.css' | stylesheet_tag }}<跨class="nt"><脚本src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.9.2/jquery-ui.min.js"defer="defer">style="width:300px; clear:both;">
for="date">Pick a delivery date:<跨class="nt">id="date"type="text"name="attributes[date]"value="{{ cart.attributes.date }}"/><跨style="display:block"class="instructions">We do not deliver during the weekend.<跨class="nt">