怎样在日期选择符日历中禁止使用特殊日期

创建派送日期代码精彩片段

若想为派送日期选择符创建代码精彩片段，请实行下列实际操作：

PC：

在Shopify后台管理中，转到在线商店模板。

寻找要编辑的模板，随后点击实际操作编辑代码。

在Snippets文件目录中，点击加上新代码精彩片段。

创建代码片段：

将代码精彩片段取名为delivery-date。

点击创建代码精彩片段。新的代码片段文档将在代码编辑器中开启。

ios系统：

在Shopify后台管理中，转到在线商店模板。

寻找要编辑的模板，随后点击实际操作编辑代码。

在Snippets文件目录中，点击加上新代码精彩片段。

创建代码片段：

将代码精彩片段取名为delivery-date。

点击创建代码精彩片段。新的代码片段文档将在代码编辑器中开启。

安卓手机系统：

在Shopify后台管理中，转到在线商店模板。

寻找要编辑的模板，随后点击实际操作编辑代码。

在Snippets文件目录中，点击加上新代码精彩片段。

创建代码片段：

将代码精彩片段取名为delivery-date。

点击创建代码精彩片段。新的代码片段文档将在代码编辑器中开启。

在新的delivery-date.liquid代码精彩片段中，黏贴下列代码：

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

divstyle=width:300px;clear:both;plabelfor=datePickadeliverydate:/labelinputid=datetype=textname=attributes[date]value={{cart.attributes.date}}/spanstyle=display:blockWedonotdeliverduringtheweek-end./span/p/divscriptwindow.onload=function(){if(window.jQuery){let$=window.jQuery;$(function(){$(#date).datepicker({minDate: 1,maxDate: 2M,beforeShowDay:$.datepicker.noWeekends});});}}/script

1.点击**储存**。##在加入购物车网页页面中包括代码精彩片段若想在加入购物车网页页面中包括派送日期代码精彩片段，请实行下列实际操作：1.在**Sections**文件目录中，点击`cart-template.liquid`。假如您的模板中并没有此文档，则点击**Templates**文件目录中的`cart.liquid`。2.[搜索](/manual/shopify-admin/productivity-tools/keyboard-shortcuts#find)代码中的完毕`/form`标识。在完毕`/form`标识上边的新行中，黏贴下列代码：```liquid{%renderdelivery-date%}

点击储存。

您的加入购物车网页页面中如今将有一个派送日期键入字段名。当您点击文字字段名时，将发生日历：

此自定设定中采用的日期选择符是jQueryUI库文件的小组件。此网络文章详细介绍怎样在日期选择符日历中禁止使用特殊日期。

Shopify商家官方网站全文详细信息：

Createadeliverydatesnippet

Tocreateasnippetforyourdeliverydatepicker:

PC：

FromyourShopifyadmin,gotoOnlineStoreThemes.

Findthethemeyouwanttoedit,andthenclickActionsEditcode.

IntheSnippetsdirectory,clickAddanewsnippet:

Createthesnippet:

Nameyoursnippetdelivery-date.

ClickCreatesnippet.Thenewsnippetfilewillopeninthecodeeditor.

iPhone：

FromyourShopifyadmin,gotoOnlineStoreThemes.

Findthethemeyouwanttoedit,andthenclickActionsEditcode.

IntheSnippetsdirectory,clickAddanewsnippet:

Createthesnippet:

Nameyoursnippetdelivery-date.

ClickCreatesnippet.Thenewsnippetfilewillopeninthecodeeditor.

Android：

FromyourShopifyadmin,gotoOnlineStoreThemes.

Findthethemeyouwanttoedit,andthenclickActionsEditcode.

IntheSnippetsdirectory,clickAddanewsnippet:

Createthesnippet:

Nameyoursnippetdelivery-date.

ClickCreatesnippet.Thenewsnippetfilewillopeninthecodeeditor.

Inyournewdelivery-date.liquidsnippet,pastethefollowingcode:

{{//code.jquery.com/ui/1.9.2/themes/base/jquery-ui.css|stylesheet_tag}}scriptsrc=https://ajax.googleapis.com/ajax/libs/jqueryui/1.9.2/jquery-ui.min.jsdefer=defer/scriptdivstyle=width:300px;clear:both;plabelfor=datePickadeliverydate:/labelinputid=datetype=textname=attributes[date]value={{cart.attributes.date}}/spanstyle=display:blockclass=instructionsWedonotdeliverduringtheweek-end./span/p/divscriptwindow.onload=function(){if(window.jQuery){let$=window.jQuery;$(function(){$(#date).datepicker({minDate: 1,maxDate: 2M,beforeShowDay:$.datepicker.noWeekends});});}}/script

ClickSave.

Includethesnippetinyourcartpage

Toincludethedeliverydatesnippetinyourcartpage:

IntheSectionsdirectory,clickcart-template.liquid.Ifyourthemedoesnthavethisfile,thenclickcart.liquidintheTemplatesdirectory.

Findtheclosing/formtaginthecode.Onanewlineabovetheclosing/formtag,pastethefollowingcode:

{%renderdelivery-date%}

ClickSave.

Younowhaveadeliverydateinputfieldonyourcartpage.Whenyouclickinsidethetextfield,acalendarwillappear:

ThedatepickerusedinthiscustomizationisawidgetfromthejQueryUIlibrary.Thisblogpostexplainshowtodisablespecificdatesinthedatepickercalendar.

文章由来：Shopify商家官网