Delivery Date Picker - change to European calendar preview

[Ben1000]

Hi there,

I have used the delivery date picker tutorial from Shopify (Add a delivery date picker to your cart · Shopify Help Center) to add to my store.

The problem:

The issue I’m facing is that it shows US format, but my customers are Dutch and from the Netherlands, so this can confuse my customers, Therefore I need some changes:

1. The first day of the week should be Monday
2. Days of the week should be presented in Dutch (Mon → Maa, Tue → Din, etc.)

Below is the code I have used currently. Can someone please tell me what code I can use to achieve this and where in the below code i would add it?

Thanks in advance!

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

  

    

     We do not deliver during the week-end.

  

[francesco_gs]

Hi @Ben1000

according to the datepicker UI interface documentation at this link

https://api.jqueryui.com/datepicker/#option-dayNames

you will need to add to the options these fields:
dayNames, dayNamesMin and firstDay

so it should look like

window.onload = function() {
      if (window.jQuery) {
        let $ = window.jQuery;

        $(function() {
          $("#date").datepicker({
          minDate: +1,
          maxDate: '+2M',
          beforeShowDay: $.datepicker.noWeekends,
            dayNames: [ "Dimanche", "Lundi", "Mardi", "Mercredi", "Jeudi", "Vendredi", "Samedi" ],
              dayNamesMin: [ "Di", "Lu", "Ma", "Me", "Je", "Ve", "Sa" ],
              firstDay: 1

        });
      });
    }
  }

Of course please change the names to the correct language!

[AppJetty]

Hi,

As I can see, There will be a lot of manual effort in coding to put in and there’s always going to be extra work to add on extra features or fix styling issues.

If you’re interested in offloading that work, we built a date picker app called Order Delivery Date Manager, with simplicity and ease-of-use in mind. You can change your Week day names, can define your non-working days, can set first day of the week, can set different shipping methods configuration

1. You can set the first day of the week as shown in image:

2. You can also configure day names as per your need :

So give it a try and opt for our free trial of 10 days. Best of luck with your store!