translation Month in Calendar Not Translating When Language Changed

Site URL: https://cahcal-fr.squarespace.com/

I'm having difficulty with translating the month in my calendar on my website. I've changed the language setting in the navigation, which translated majority of the website to French, however, it did not translate the month on my calendar page. Does anyone know how I can fix this? Any help would be greatly appreciated!

Calendar Page: https://cahcal-fr.squarespace.com/calendrier

Pass: cahcal

12 minutes ago, andysuchann said:

Site URL: https://cahcal-fr.squarespace.com/

I'm having difficulty with translating the month in my calendar on my website. I've changed the language setting in the navigation, which translated majority of the website to French, however, it did not translate the month on my calendar page. Does anyone know how I can fix this? Any help would be greatly appreciated!

Calendar Page: https://cahcal-fr.squarespace.com/calendrier

Pass: cahcal

Hi It's possible , will you please let us know on what plan of squares pace you are using personal or business? 

4 minutes ago, humxahafeex said:

Hi It's possible , will you please let us know on what plan of squares pace you are using personal or business? 

It will be a Business Account once I purchase it and push the site live.

11 minutes ago, andysuchann said:

It will be a Business Account once I purchase it and push the site live.

Awesome let me try to do a code for it and post it here in a while. 

4 minutes ago, humxahafeex said:

Awesome let me try to do a code for it and post it here in a while. 

Thanks so much - really appreciate! I'm looking to translate the months to French so they would be:

• janvier - January
• février - February
• mars - March
• avril - April
• mai - May
• juin - June
• juillet - July
• aout - August
• septembre -September
• octobre - October
• novembre - November
• décembre - December

Hi Here's is the Code on how you can achieve this , Just copy and paste the code in Code Injection you , Simply go to Settings> Advanced> Code Injection

In HEADER part add the following code: 

<script src = "https://code.jquery.com/jquery-2.2.4.min.js" ></script>

In FOOTER part add the following code:

<script>
 function translate(){
   $(".yui3-calendar-header-label").text(function(){
            var month = $(this).text();
            month = month.toString();
            for (var i=0;i<12;i++) {
              if (month.includes(arr_month_english[i])){ return $(this).text().replace(arr_month_english[i], arr_month_trans[i]);}
            }
        });  }
 const arr_month_trans = ["Janvier", "Février", "Mars", "Avril", "Mai", "Juin", "Juillet", "Aout", "Septembre", "Octobre", "Novembre", "Décembre"];
 const arr_month_english = ["January", "February", "March", "April", "May", "June", "July", "August", "September", "October", "November", "December"];
  $(document).ready(function() {
    setTimeout(translate, 2000);
     $(document).on('click','.yui3-calendarnav-prevmonth',function(){translate();}); 
    $(document).on('click','.yui3-calendarnav-nextmonth',function(){translate();}); 
  });

</script>

It's DONE, Enjoy , Do Mark it solved if it works for you 🙂

Hey, If my solution helped you don't hesitate to Buy me a coffee : https://www.buymeacoffee.com/hamxahafeex

tHIS

14 hours ago, humxahafeex said:

Hi Here's is the Code on how you can achieve this , Just copy and paste the code in Code Injection you , Simply go to Settings> Advanced> Code Injection

In HEADER part add the following code: 

<script src = "https://code.jquery.com/jquery-2.2.4.min.js" ></script>

In FOOTER part add the following code:

<script>
 function translate(){
   $(".yui3-calendar-header-label").text(function(){
            var month = $(this).text();
            month = month.toString();
            for (var i=0;i<12;i++) {
              if (month.includes(arr_month_english[i])){ return $(this).text().replace(arr_month_english[i], arr_month_trans[i]);}
            }
        });  }
 const arr_month_trans = ["Janvier", "Février", "Mars", "Avril", "Mai", "Juin", "Juillet", "Aout", "Septembre", "Octobre", "Novembre", "Décembre"];
 const arr_month_english = ["January", "February", "March", "April", "May", "June", "July", "August", "September", "October", "November", "December"];
  $(document).ready(function() {
    setTimeout(translate, 2000);
     $(document).on('click','.yui3-calendarnav-prevmonth',function(){translate();}); 
    $(document).on('click','.yui3-calendarnav-nextmonth',function(){translate();}); 
  });

</script>

It's DONE, Enjoy , Do Mark it solved if it works for you 🙂

 

Hey, If my solution helped you don't hesitate to Buy me a coffee : https://www.buymeacoffee.com/hamxahafeex

This worked, you're the best - thanks so much!

9 minutes ago, andysuchann said:

tHIS

This worked, you're the best - thanks so much!

Glad I could helped , Please mark it as solved it helped others as well.

Thanks, i used the same code and changed the months into Italian, worked flawlessly, cheers!

Hi -- 

My website is for a language school and we offer multiple languages and have multiple event calendars. I'm trying to change each calendar to its respective language. Is there any way to translate individual calendars and not site-wide?

On 5/20/2023 at 12:47 PM, Sepia said:

Hi -- 

My website is for a language school and we offer multiple languages and have multiple event calendars. I'm trying to change each calendar to its respective language. Is there any way to translate individual calendars and not site-wide?

You try pasting above code to Page Header, not Sidewide Code Injection

On 5/21/2023 at 7:18 PM, tuanphan said:

You try pasting above code to Page Header, not Sidewide Code Injection

I tried this, it did not seem to work. 😞

On 5/24/2023 at 2:13 AM, Sepia said:

I tried this, it did not seem to work. 😞

Hi Sepia, Please make sure you are pasting the code in the individual page header setting , you can access this setting by hovering on page as you hover gear icon appears , click on that gear icon , pop up will open up , on that pop up click on Advance , then paste the code , it should work , if not let us know we are here to help you out.