Multi Language localization re SEO for Greater China (3 types of Chinese)

Question:
Using embedding custom code in Wix, is there a way I can alter the hreflang tags?

Product:
Wix Editor

What are you trying to achieve:
I created a multilingual website for English and Greater China (Hong Kong, Taiwan, China). In the Wix multilingual module, I can only select one Chinese, which I have selected for Hong Kong. I have added also Twi (TW) for Taiwan and Sardinian (SC) for China. From the user perspective the website is usable for Greater China, with 3 types of Chinese.

From an SEO perspective, is my main question.
On webpage’s header, Wix auto generated hreflang as follow:

<link rel="alternate" href="https://www.lazywealthy.com/" hreflang="x-default"/>
<link rel="alternate" href="https://www.lazywealthy.com/sc" hreflang="sc-it"/>
<link rel="alternate" href="https://www.lazywealthy.com/tw" hreflang="tw-gh"/>
<link rel="alternate" href="https://www.lazywealthy.com/zh" hreflang="zh-hk"/>
<link rel="alternate" href="https://www.lazywealthy.com/" hreflang="en-us"/>

Using custom code in Wix, is there a way I can alter the hreflang, so it becomes like this for Taiwan (zh-cn) and (zh-tw)?

<link rel="alternate" href="https://www.lazywealthy.com/sc" hreflang="zh-cn"/>
<link rel="alternate" href="https://www.lazywealthy.com/tw" hreflang="zh-tw"/>

Would be great if the search engines can read the website language correctly.

What have you already tried:
Tried these resources to no avail. I need to override the Wix default hreflang?
https://support.wix.com/en/article/header-code-meta-tag-guidelines
https://support.wix.com/en/article/embedding-custom-code-on-your-site

Wix actually have a very simple solution to customize the hreflang, as follow:

  1. Go to the Multilanguage module from “Manage Languages”.

Screenshot 2024-07-10 200036

  1. Click on the “… icon” and select “Set regional format” for the language you want to custom the hreflang tag.

  1. Select the Region locale you want (afterwards hit publish to be safe).

Screenshot 2024-07-10 200116

  1. Check the hreflang tag on the web page to see if you get the desired result.

If you also want to change the html tag to avoid “Mismatch Hreflang and Lang Attributes”, then add custom code to the header of the page as follow:

To change the <html lang> attribute in Wix using custom code, you can follow these steps:

1. Access Custom Code Settings:

  • Go to your site’s dashboard.
  • Navigate to Settings.
  • Scroll down to the Advanced section and click on Custom Code.

2. Add Custom Code:

  • Click on + Add Custom Code at the top right.
  • Paste the following code snippet into the text box
<script>
  if (document.documentElement.lang === 'sc' || document.documentElement.lang === 'tw') {
    document.documentElement.lang = 'zh';
    console.log('Language attribute changed to zh');
  }
</script>

3. Configure Code Placement:

  • Enter a name for your code (e.g., “Change HTML Lang”).
  • Select All pages or choose specific pages where you want this code to apply.
  • Choose Head under the Place Code in section.
  • Click Apply.

4. Verify Implementation

  • Go to the console on the browser and check the elements for the html lang attribute is changed to your desired lang code

For more accurate locale, you can use the code below

<script>
  if (document.documentElement.lang === 'en') {
    document.documentElement.lang = 'en-us';
  } else if (document.documentElement.lang === 'zh') {
    document.documentElement.lang = 'zh-hk';
  } else if (document.documentElement.lang === 'tw') {
    document.documentElement.lang = 'zh-tw';
  } else if (document.documentElement.lang === 'sc') {
    document.documentElement.lang = 'zh-cn';
  }
</script>