Calendar Month & Day custom text with CSS

Hi @tuanphan

Any idea about how to update the text of the Month and Days with CSS in a specific page using Calendar? Please see attached image as it comes from a Deustch website wich I need to duplicate to English.

https://www.zeitgarten.ch/aktuell

https://www.zeitgarten.ch/news

Wait for your news, thanks!

23 minutes ago, jjohansson said:

Hi @tuanphan

Any idea about how to update the text of the Month and Days with CSS in a specific page using Calendar? Please see attached image as it comes from a Deustch website wich I need to duplicate to English.

https://www.zeitgarten.ch/aktuell

https://www.zeitgarten.ch/news

Wait for your news, thanks!

 

 

Do you mean keeping the text in /aktuell page and changing these texts into English words in /news page?

21 hours ago, Beyondspace said:

Do you mean keeping the text in /aktuell page and changing these texts into English words in /news page?

Yes I need to do exactly that. Update the text in a duplicated Blog page where im translating all the content but that's the part I can´t. 

https://www.zeitgarten.ch/news this is the Page (duplicated of Aktuell) wich I want to apply that English texts.

Any help will be much appreciated @Beyondspace

4 hours ago, jjohansson said:

Yes I need to do exactly that. Update the text in a duplicated Blog page where im translating all the content but that's the part I can´t. 

https://www.zeitgarten.ch/news this is the Page (duplicated of Aktuell) wich I want to apply that English texts.

Any help will be much appreciated @Beyondspace

You can try the following code in code injection footer

<script src="https://code.jquery.com/jquery-3.6.0.min.js"></script> 
<script>
  $(document).ready(function(){
    let deusMonth = ['Januar','Februar', 'März','April','Mai','Juni','Juli','August','September','Oktober','November','Dezember']
    let enMonth = ['January','February', 'March','April','May','June','July','August','September','October','November','December']

    let enWeekDay = ['Sun','Mon', 'Tue','Wed','Thu','Fri','Sat']
    const $target = $("#block-79214c905daaf1ff0e18 .calendar-block h1 > div");
    const month = $target.text().split(" ")[0];
    const mIndex = deusMonth.findIndex(m=> {
      return month.trim() == m.trim()
    });

    if(mIndex != -1) {
      $target.text($target.text().replace(month, enMonth[mIndex]));
    }

    const $weekDay = $('#block-79214c905daaf1ff0e18 .yui3-calendar-weekday');
    $weekDay.each((i,day) => {
      $(day).text(enWeekDay[i])
    })
  })
</script>

It works when we load the page, but when you move to the next or previous month, it still shows the month with Deustch.

It requires more complicate code to cover these actions. If you are interested, PM me so we can discuss more detail

On 6/26/2024 at 6:32 PM, Beyondspace said:

It works when we load the page, but when you move to the next or previous month, it still shows the month with Deustch.

It requires more complicate code to cover these actions. If you are interested, PM me so we can discuss more detail

Thank you very much @Beyondspace do you think that customization would take lot of time to find out how it works? Maybe adding this code to all the posts in the Blog Deustch somehow could help?

@tuanphan any suggestions by your side? I´ve sent you a private message regarding the same post and a old post of other user.

That worked perfectly Tuan, thanks a lot!

I only need now the fix for the Months... any idea?

On 7/8/2024 at 2:15 AM, jjohansson said:

That worked perfectly Tuan, thanks a lot!

I only need now the fix for the Months... any idea?

With month, you can use code in this thread

https://forum.squarespace.com/topic/162756-changing-languagetext-on-store-calendar-blog-search-box-etc/

14 hours ago, tuanphan said:

With month, you can use code in this thread

https://forum.squarespace.com/topic/162756-changing-languagetext-on-store-calendar-blog-search-box-etc/

@TuanI have two Blog pages do you think I could leave one with the default DEUSTCH languague and just apply this code to the ENGLISH page?

 

I have applied but didn't work... any idea?

On 7/15/2024 at 2:24 AM, jjohansson said:

I have applied but didn't work... any idea?

Can you provide exact code you added?

On 7/14/2024 at 1:42 AM, jjohansson said:

@TuanI have two Blog pages do you think I could leave one with the default DEUSTCH languague and just apply this code to the ENGLISH page?

 

You can add code to Page Header Injection instead of Sitewide Code Injection