Date Reservation widget: Allow translation of months and days to "French"

  • zipout
    Asked on February 19, 2016 at 4:34 AM

    Any chance to have the "date reservation" widget in french?

  • Charlie
    Replied on February 19, 2016 at 9:37 AM

    I presume you want to change the months and days to French? Currently, the Date Reservation widget is broken, I have already informed out back end team about it. 

    I believe there's no option to manually change them, but it should be possible if you are using custom CSS code, however, it is more of an aesthetic view, those "French" translations showing in the form will not show in the submission.

    You could try making your form multilingual and see if that should affect the widget. Here's a guide on how to do that: http://www.jotform.com/help/298-How-to-make-your-forms-multilingual

    When the widget is fixed, I'll try to test the suggestions I have mentioned. Apologies for the inconvenience.

  • zipout
    Replied on February 19, 2016 at 12:01 PM

    Thank you for your answer. I tried already making my form multilingual without any effect. I tried the APP "Bookings" too, but this one doesn't work.

    The Date Reservation is exactly what I need, I'd just like to change months and days (Lu, Ma, Me...)

    Keep me advised. Thank you.

  • Charlie
    Replied on February 19, 2016 at 1:33 PM

    I tried to use CSS code, I can only translate the days but not the months. You can check this CSS code:

    #reservationContainer > div > table > thead > tr > th > span {

    display: none !important;

    }

    /* Monday */

    #reservationContainer > div > table > thead > tr > th:nth-child(1)::after {

    display: inline-block !important;

    content: "Lu" !important;

    }

    /* Tuesday */

    #reservationContainer > div > table > thead > tr > th:nth-child(2)::after {

    display: inline-block !important;

    content: "Lu" !important;

    }

    /* Wednesday */

    #reservationContainer > div > table > thead > tr > th:nth-child(3)::after {

    display: inline-block !important;

    content: "Lu" !important;

    }

    /* Thursday */

    #reservationContainer > div > table > thead > tr > th:nth-child(4)::after {

    display: inline-block !important;

    content: "Lu" !important;

    }

    /* Friday */

    #reservationContainer > div > table > thead > tr > th:nth-child(5)::after {

    display: inline-block !important;

    content: "Lu" !important;

    }

    /* Saturday */

    #reservationContainer > div > table > thead > tr > th:nth-child(6)::after {

    display: inline-block !important;

    content: "Lu" !important;

    }

    /* Sunday */

    #reservationContainer > div > table > thead > tr > th:nth-child(7)::after {

    display: inline-block !important;

    content: "Lu" !important;

    }

    Paste it under the CSS tab in your widget settings:

    Date Reservation widget: Allow translation of months and days to French Image 1 Screenshot 20

     

    Just change the "content" value in the CSS code with the translation you want. Please note that that is only aesthetic, it only changes the appearance on the live form but not an actual value. Here's a test form that I have: https://form.jotform.com/60495043455961 

    I have forwarded this as a feature request to our widget team to see if an option to translate or change the months and days can be added. However, please note that we are unable to guarantee that this will be implemented anytime soon, but rest assure that the developers are already aware of this.