You will need to customize your Shopify Theme for this.
In your shop admin, go to Themes → Template Editor:
On the Template Editor page, under Snippets on the left, create a new snippet called delivery-date:
Then, paste the content of this gist inside your new snippet.
PRO TIP: Click on the raw button at the top right of the gist, then use CTRL-A on your PC or ⌘-A on your Mac to select the entire content of the browser page, and copy it to your clipboard using CTRL-C or ⌘-C. Then, place your cursor inside your delivery-date.liquid snippet and use CTRL-V on your PC or ⌘-V on your Mac to paste the content of your clipboard there. Then save.
Time to include your delivery-date snippet on your /cart page.
Still on the Template Editor page, locate the file cart.liquid under Templates on the left. Click on cart.liquid to open that file in the online code editor.
Locate the closing tag of your cart form:
</form>
Right above </form>, add the following:
{% include 'delivery-date' %}
Like so:
Save. You are done.
You now have a new delivery date input field on your cart page:
When you mouse-click inside the text field, a calendar-like date-picker will pop up below:
Pick a date and it will be saved to your text field like so:
Do you want to avoid the need to click on the cart update button? Add this auto-save script at the bottom of your cart.liquid template.
The captured delivery date will show up in your order notes like so:
