Jump to content

Month in Calendar Not Translating When Language Changed

Go to solution Solved by paul2009,

Recommended Posts

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

Link to comment
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? 

Link to comment
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
Link to comment

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

Link to comment

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!

Link to comment
  • Solution
23 hours ago, andysuchann said:

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.

@andysuchann This should not happen and should not require custom code to fix. Squarespace have confirmed that this is caused by an issue with calendar dates on their end. It has been reported to their Engineering team, and they’re currently prioritizing the issue so that it can be fixed. 

 

About me: I'm Paul. A SQSP User for 18 yrs, I joined Circle when it launched in 2016 and have been a Circle Leader since 2017. I value honesty, transparency, diversity and good design ♥.
Work: Founder of SF.DIGITAL, providing expertise and extensions to supercharge your Squarespace website. 
Content: Views and opinions are my own. Links in my posts may refer to my own SF.DIGITAL products or may be affiliate links.
Forum advice is free. You can thank me by clicking one of the feedback emojis below. Coffee fuels my work.

Book paid help with a Squarespace Domain

Link to comment
  • 10 months later...
  • 1 month later...

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?

Link to comment
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

Email me if you have need any help (free, of course.). Answer within 24 hours. 
Or send to forum message

Contact Customer Care - Learn CSS - Buy me a coffee (thank you!)

Link to comment
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.

Link to comment

Create an account or sign in to comment

You need to be a member in order to leave a comment

×
×
  • Create New...

Squarespace Webinars

Free online sessions where you’ll learn the basics and refine your Squarespace skills.

Hire a Designer

Stand out online with the help of an experienced designer or developer.