From 919f2cd1de42acc15ad9c9357753d41f31a8a7a1 Mon Sep 17 00:00:00 2001
From: JamieC24 <jamie@studio24.net>
Date: Fri, 25 Jul 2025 10:53:54 +0100
Subject: [PATCH 1/7] Add check against site language to navItem language to
 determine hreflang

---
 templates/components/styles/global_nav.html.twig | 10 ++++++++--
 1 file changed, 8 insertions(+), 2 deletions(-)

diff --git a/templates/components/styles/global_nav.html.twig b/templates/components/styles/global_nav.html.twig
index e3d771ab..094bd5f0 100644
--- a/templates/components/styles/global_nav.html.twig
+++ b/templates/components/styles/global_nav.html.twig
@@ -11,7 +11,10 @@
         <ul data-component="nav-double-intro">
             {%~ for navItem in navigation %}
                 <li class="top-nav-item has-children">
-                    <a href="{{ navItem.titleLink }}" class="nav-link">{{ navItem.title }}</a>
+                    {% if site.localeData('siteLink') is defined and navItem.language is not same as site.localeData('siteLink') %}
+                        {% set navItemLang = navItem.language %}
+                    {% endif %}
+                    <a href="{{ navItem.titleLink }}" class="nav-link"{% if navItemLang is defined %}hreflang="{{ navItemLang }}"{% endif %}>{{ navItem.title }}</a>
                     <div class="nav__submenu" data-nav="submenu" style="display: none;">
                         <div class="l-center">
                             <div class="nav__submenu__intro">
@@ -28,8 +31,11 @@
                             {% if navItem.children is defined and navItem.children|length > 0 -%}
                                 <ul>
                                     {%~ for child in navItem.children %}
+                                        {% if site.localeData('siteLink') is defined and child.language is not same as site.localeData('siteLink') %}
+                                            {% set childLang = child.language %}
+                                        {% endif %}
                                         <li{{ child.startNewColumn is defined and child.startNewColumn ? ' class="break-after"' : '' }}>{# -#}
-                                            <a href="{{ child.url }}">{{ child.title }}</a>{# -#}
+                                            <a href="{{ child.url }}"{% if childLang is defined %}hreflang="{{ childLang }}"{% endif %}>{{ child.title }}</a>{# -#}
                                         </li>
                                     {%~ endfor %}
                                 </ul>

From b84234fcbf49f2fda1f35ad001589cd3c1a8efd6 Mon Sep 17 00:00:00 2001
From: JamieC24 <jamie@studio24.net>
Date: Fri, 25 Jul 2025 11:06:44 +0100
Subject: [PATCH 2/7] Remove funky if-checks to see if data comes through

---
 templates/components/styles/global_nav.html.twig | 10 ++--------
 1 file changed, 2 insertions(+), 8 deletions(-)

diff --git a/templates/components/styles/global_nav.html.twig b/templates/components/styles/global_nav.html.twig
index 094bd5f0..690858fd 100644
--- a/templates/components/styles/global_nav.html.twig
+++ b/templates/components/styles/global_nav.html.twig
@@ -11,10 +11,7 @@
         <ul data-component="nav-double-intro">
             {%~ for navItem in navigation %}
                 <li class="top-nav-item has-children">
-                    {% if site.localeData('siteLink') is defined and navItem.language is not same as site.localeData('siteLink') %}
-                        {% set navItemLang = navItem.language %}
-                    {% endif %}
-                    <a href="{{ navItem.titleLink }}" class="nav-link"{% if navItemLang is defined %}hreflang="{{ navItemLang }}"{% endif %}>{{ navItem.title }}</a>
+                    <a href="{{ navItem.titleLink }}" class="nav-link" hreflang="{{ navItem.language }}">{{ navItem.title }}</a>
                     <div class="nav__submenu" data-nav="submenu" style="display: none;">
                         <div class="l-center">
                             <div class="nav__submenu__intro">
@@ -31,11 +28,8 @@
                             {% if navItem.children is defined and navItem.children|length > 0 -%}
                                 <ul>
                                     {%~ for child in navItem.children %}
-                                        {% if site.localeData('siteLink') is defined and child.language is not same as site.localeData('siteLink') %}
-                                            {% set childLang = child.language %}
-                                        {% endif %}
                                         <li{{ child.startNewColumn is defined and child.startNewColumn ? ' class="break-after"' : '' }}>{# -#}
-                                            <a href="{{ child.url }}"{% if childLang is defined %}hreflang="{{ childLang }}"{% endif %}>{{ child.title }}</a>{# -#}
+                                            <a href="{{ child.url }}" hreflang="{{ child.language }}">{{ child.title }}</a>{# -#}
                                         </li>
                                     {%~ endfor %}
                                 </ul>

From 0863c004138978f99e064d36adfbc45e0cf19a8b Mon Sep 17 00:00:00 2001
From: JamieC24 <jamie@studio24.net>
Date: Fri, 25 Jul 2025 11:09:04 +0100
Subject: [PATCH 3/7] Just add an echo to see if language is coming through or
 whether it's a gql thing

---
 templates/components/styles/global_nav.html.twig | 5 +++--
 1 file changed, 3 insertions(+), 2 deletions(-)

diff --git a/templates/components/styles/global_nav.html.twig b/templates/components/styles/global_nav.html.twig
index 690858fd..0d52eeed 100644
--- a/templates/components/styles/global_nav.html.twig
+++ b/templates/components/styles/global_nav.html.twig
@@ -11,7 +11,8 @@
         <ul data-component="nav-double-intro">
             {%~ for navItem in navigation %}
                 <li class="top-nav-item has-children">
-                    <a href="{{ navItem.titleLink }}" class="nav-link" hreflang="{{ navItem.language }}">{{ navItem.title }}</a>
+                    {% if navItem.language is defined %}{{ navItem.language }}{% endif %}
+                    <a href="{{ navItem.titleLink }}" class="nav-link">{{ navItem.title }}</a>
                     <div class="nav__submenu" data-nav="submenu" style="display: none;">
                         <div class="l-center">
                             <div class="nav__submenu__intro">
@@ -29,7 +30,7 @@
                                 <ul>
                                     {%~ for child in navItem.children %}
                                         <li{{ child.startNewColumn is defined and child.startNewColumn ? ' class="break-after"' : '' }}>{# -#}
-                                            <a href="{{ child.url }}" hreflang="{{ child.language }}">{{ child.title }}</a>{# -#}
+                                            <a href="{{ child.url }}">{{ child.title }}</a>{# -#}
                                         </li>
                                     {%~ endfor %}
                                 </ul>

From 5fb0a705e058d822b37c9c2810f88eb9b0dcb0e9 Mon Sep 17 00:00:00 2001
From: JamieC24 <jamie@studio24.net>
Date: Fri, 25 Jul 2025 12:25:44 +0100
Subject: [PATCH 4/7] Add support for targetLinkLanguage field

---
 templates/components/styles/global_nav.html.twig | 9 ++++++---
 1 file changed, 6 insertions(+), 3 deletions(-)

diff --git a/templates/components/styles/global_nav.html.twig b/templates/components/styles/global_nav.html.twig
index 0d52eeed..267ba39b 100644
--- a/templates/components/styles/global_nav.html.twig
+++ b/templates/components/styles/global_nav.html.twig
@@ -1,6 +1,7 @@
 <nav id="global-nav" aria-label="Main">
     <div class="global-nav__inner l-center">
-        <a class="logo-link" href="{% block homepage_link %}/{% endblock %}" hreflang="{% block homepage_hreflang %}en{% endblock %}">
+        {% set siteLang %} {% block homepage_hreflang %}en{% endblock %} {% endset %}
+        <a class="logo-link" href="{% block homepage_link %}/{% endblock %}" hreflang="{{ siteLang }}">
             <span class="logo">
                 <img src="{{ absolute_url(asset('w3c/w3c-no-bars.svg', 'logos')) }}" alt="{{ 'header.logo_alt'|trans({}, 'w3c_website_templates_bundle') }}" role="img"/>
             </span>
@@ -11,8 +12,9 @@
         <ul data-component="nav-double-intro">
             {%~ for navItem in navigation %}
                 <li class="top-nav-item has-children">
+                    {% set langDiff = siteLang is same as navItem.targetLinkLanguage ? false : true %}
                     {% if navItem.language is defined %}{{ navItem.language }}{% endif %}
-                    <a href="{{ navItem.titleLink }}" class="nav-link">{{ navItem.title }}</a>
+                    <a href="{{ navItem.titleLink }}" class="nav-link"{% if langDiff %}hreflang="{{ navItem.targetLinkLanguage }}"{% endif %}>{{ navItem.title }}</a>
                     <div class="nav__submenu" data-nav="submenu" style="display: none;">
                         <div class="l-center">
                             <div class="nav__submenu__intro">
@@ -29,8 +31,9 @@
                             {% if navItem.children is defined and navItem.children|length > 0 -%}
                                 <ul>
                                     {%~ for child in navItem.children %}
+                                        {% set childLangDiff = siteLang is same as child.targetLinkLanguage ? false : true %}
                                         <li{{ child.startNewColumn is defined and child.startNewColumn ? ' class="break-after"' : '' }}>{# -#}
-                                            <a href="{{ child.url }}">{{ child.title }}</a>{# -#}
+                                            <a href="{{ child.url }}{% if childLangDiff %}hreflang="{{ child.targetLinkLanguage }}"{% endif %}">{{ child.title }}</a>{# -#}
                                         </li>
                                     {%~ endfor %}
                                 </ul>

From bc677ff79bf47f647bdf3c8b8e2b7c065da729cf Mon Sep 17 00:00:00 2001
From: JamieC24 <jamie@studio24.net>
Date: Tue, 5 Aug 2025 11:38:01 +0100
Subject: [PATCH 5/7] Add support for labels when pages are in a different
 language

---
 .../components/styles/global_nav.html.twig    | 48 ++++++++++++++++---
 1 file changed, 42 insertions(+), 6 deletions(-)

diff --git a/templates/components/styles/global_nav.html.twig b/templates/components/styles/global_nav.html.twig
index 267ba39b..b8db8a00 100644
--- a/templates/components/styles/global_nav.html.twig
+++ b/templates/components/styles/global_nav.html.twig
@@ -1,6 +1,7 @@
 <nav id="global-nav" aria-label="Main">
     <div class="global-nav__inner l-center">
-        {% set siteLang %} {% block homepage_hreflang %}en{% endblock %} {% endset %}
+        {% set siteLang %}{% block homepage_hreflang %}en{% endblock %}{% endset %}
+        {% set siteLang = siteLang|trans %}
         <a class="logo-link" href="{% block homepage_link %}/{% endblock %}" hreflang="{{ siteLang }}">
             <span class="logo">
                 <img src="{{ absolute_url(asset('w3c/w3c-no-bars.svg', 'logos')) }}" alt="{{ 'header.logo_alt'|trans({}, 'w3c_website_templates_bundle') }}" role="img"/>
@@ -12,9 +13,26 @@
         <ul data-component="nav-double-intro">
             {%~ for navItem in navigation %}
                 <li class="top-nav-item has-children">
-                    {% set langDiff = siteLang is same as navItem.targetLinkLanguage ? false : true %}
-                    {% if navItem.language is defined %}{{ navItem.language }}{% endif %}
-                    <a href="{{ navItem.titleLink }}" class="nav-link"{% if langDiff %}hreflang="{{ navItem.targetLinkLanguage }}"{% endif %}>{{ navItem.title }}</a>
+                    {# {% if navItem.language is defined %}{{ navItem.language }}{% endif %} #}
+                        {% if navItem.targetLinkLanguage is not empty %}
+                            {% set targetLangLabel = '' %}
+                            {% set langDiff = false %}
+                            {% if navItem.targetLinkLanguage is not same as siteLang %}
+                                {% set langDiff = true %}
+
+                                {% if navItem.targetLinkLanguage == 'zh-Hans' %}
+                                    {% set targetLangLabel = "Chinese" %}
+                                {% else %}
+                                    {% set targetLangLabel = "English" %}
+                                {% endif %}
+                            {% endif %}
+                        {% endif %}
+                    <a href="{{ navItem.titleLink }}" class="nav-link"{% if langDiff is defined and langDiff %}hreflang="{{ navItem.targetLinkLanguage }}"{% endif %}>
+                        {{ navItem.title }}
+                        {% if navItem.targetLinkLanguage is not empty %}
+                            {{ (langDiff is defined and langDiff) ? '(' ~ targetLangLabel ~ ')' : '' }}
+                        {% endif %}
+                    </a>
                     <div class="nav__submenu" data-nav="submenu" style="display: none;">
                         <div class="l-center">
                             <div class="nav__submenu__intro">
@@ -31,9 +49,27 @@
                             {% if navItem.children is defined and navItem.children|length > 0 -%}
                                 <ul>
                                     {%~ for child in navItem.children %}
-                                        {% set childLangDiff = siteLang is same as child.targetLinkLanguage ? false : true %}
                                         <li{{ child.startNewColumn is defined and child.startNewColumn ? ' class="break-after"' : '' }}>{# -#}
-                                            <a href="{{ child.url }}{% if childLangDiff %}hreflang="{{ child.targetLinkLanguage }}"{% endif %}">{{ child.title }}</a>{# -#}
+
+                                            {% if child.targetLinkLanguage is not empty %}
+                                                {% set childLangDiff = siteLang is same as child.targetLinkLanguage ? false : true %}
+                                                {% set targetLangLabel = '' %}
+
+                                                {% if childLangDiff == true %}
+                                                    {% if child.targetLinkLanguage == 'zh-Hans' %}
+                                                        {% set targetLangLabel = "Chinese" %}
+                                                    {% else %}
+                                                        {% set targetLangLabel = "English" %}
+                                                    {% endif %}
+                                                {% endif %}
+                                            {% endif %}
+
+                                            <a href="{{ child.url }}{% if childLangDiff is defined and childLangDiff == true %}hreflang="{{ child.targetLinkLanguage }}"{% endif %}">
+                                                {{ child.title }}
+                                                {% if child.targetLinkLanguage is not empty %}
+                                                    {{ (childLangDiff is defined and childLangDiff) ? '(' ~ targetLangLabel ~ ')' : '' }}
+                                                {% endif %}
+                                            </a>{# -#}
                                         </li>
                                     {%~ endfor %}
                                 </ul>

From 1f95108400a33d852dde8a377fb542e6bee1bc71 Mon Sep 17 00:00:00 2001
From: JamieC24 <jamie@studio24.net>
Date: Thu, 14 Aug 2025 09:23:22 +0100
Subject: [PATCH 6/7] Fix highlighted issues on markup and remove homepage_href
 block

---
 templates/components/styles/global_nav.html.twig | 11 +++++------
 1 file changed, 5 insertions(+), 6 deletions(-)

diff --git a/templates/components/styles/global_nav.html.twig b/templates/components/styles/global_nav.html.twig
index b8db8a00..5d1b0322 100644
--- a/templates/components/styles/global_nav.html.twig
+++ b/templates/components/styles/global_nav.html.twig
@@ -1,7 +1,7 @@
 <nav id="global-nav" aria-label="Main">
     <div class="global-nav__inner l-center">
-        {% set siteLang %}{% block homepage_hreflang %}en{% endblock %}{% endset %}
-        {% set siteLang = siteLang|trans %}
+        {# {% set siteLang %}{% block homepage_hreflang %}en{% endblock %}{% endset %} #}
+        {% set siteLang = site.locale|default('en')|trans %}
         <a class="logo-link" href="{% block homepage_link %}/{% endblock %}" hreflang="{{ siteLang }}">
             <span class="logo">
                 <img src="{{ absolute_url(asset('w3c/w3c-no-bars.svg', 'logos')) }}" alt="{{ 'header.logo_alt'|trans({}, 'w3c_website_templates_bundle') }}" role="img"/>
@@ -13,7 +13,6 @@
         <ul data-component="nav-double-intro">
             {%~ for navItem in navigation %}
                 <li class="top-nav-item has-children">
-                    {# {% if navItem.language is defined %}{{ navItem.language }}{% endif %} #}
                         {% if navItem.targetLinkLanguage is not empty %}
                             {% set targetLangLabel = '' %}
                             {% set langDiff = false %}
@@ -27,7 +26,7 @@
                                 {% endif %}
                             {% endif %}
                         {% endif %}
-                    <a href="{{ navItem.titleLink }}" class="nav-link"{% if langDiff is defined and langDiff %}hreflang="{{ navItem.targetLinkLanguage }}"{% endif %}>
+                    <a href="{{ navItem.titleLink }}" class="nav-link"{% if langDiff is defined and langDiff %} hreflang="{{ navItem.targetLinkLanguage }}"{% endif %}>
                         {{ navItem.title }}
                         {% if navItem.targetLinkLanguage is not empty %}
                             {{ (langDiff is defined and langDiff) ? '(' ~ targetLangLabel ~ ')' : '' }}
@@ -52,7 +51,7 @@
                                         <li{{ child.startNewColumn is defined and child.startNewColumn ? ' class="break-after"' : '' }}>{# -#}
 
                                             {% if child.targetLinkLanguage is not empty %}
-                                                {% set childLangDiff = siteLang is same as child.targetLinkLanguage ? false : true %}
+                                                {% set childLangDiff = siteLang != child.targetLinkLanguage %}
                                                 {% set targetLangLabel = '' %}
 
                                                 {% if childLangDiff == true %}
@@ -64,7 +63,7 @@
                                                 {% endif %}
                                             {% endif %}
 
-                                            <a href="{{ child.url }}{% if childLangDiff is defined and childLangDiff == true %}hreflang="{{ child.targetLinkLanguage }}"{% endif %}">
+                                            <a href="{{ child.url }}"{% if childLangDiff is defined and childLangDiff == true %} hreflang="{{ child.targetLinkLanguage }}{% endif %}">
                                                 {{ child.title }}
                                                 {% if child.targetLinkLanguage is not empty %}
                                                     {{ (childLangDiff is defined and childLangDiff) ? '(' ~ targetLangLabel ~ ')' : '' }}

From 934b99e82ff637e2e6a6dec8a7f7b7c85d26910b Mon Sep 17 00:00:00 2001
From: JamieC24 <jamie@studio24.net>
Date: Mon, 8 Sep 2025 12:59:20 +0100
Subject: [PATCH 7/7] Genericise targetLinkLanguage setting

---
 templates/components/styles/global_nav.html.twig | 10 ++++++----
 1 file changed, 6 insertions(+), 4 deletions(-)

diff --git a/templates/components/styles/global_nav.html.twig b/templates/components/styles/global_nav.html.twig
index 5d1b0322..eb69aa2e 100644
--- a/templates/components/styles/global_nav.html.twig
+++ b/templates/components/styles/global_nav.html.twig
@@ -19,11 +19,12 @@
                             {% if navItem.targetLinkLanguage is not same as siteLang %}
                                 {% set langDiff = true %}
 
-                                {% if navItem.targetLinkLanguage == 'zh-Hans' %}
+                                {# {% if navItem.targetLinkLanguage == 'zh-Hans' %}
                                     {% set targetLangLabel = "Chinese" %}
                                 {% else %}
                                     {% set targetLangLabel = "English" %}
-                                {% endif %}
+                                {% endif %} #}
+                            {% set targetLangLabel = navItem.targetLinkLanguage|replace('-', '_')|language_name(siteLang) %}
                             {% endif %}
                         {% endif %}
                     <a href="{{ navItem.titleLink }}" class="nav-link"{% if langDiff is defined and langDiff %} hreflang="{{ navItem.targetLinkLanguage }}"{% endif %}>
@@ -55,11 +56,12 @@
                                                 {% set targetLangLabel = '' %}
 
                                                 {% if childLangDiff == true %}
-                                                    {% if child.targetLinkLanguage == 'zh-Hans' %}
+                                                    {# {% if child.targetLinkLanguage == 'zh-Hans' %}
                                                         {% set targetLangLabel = "Chinese" %}
                                                     {% else %}
                                                         {% set targetLangLabel = "English" %}
-                                                    {% endif %}
+                                                    {% endif %} #}
+                                                    {% set targetLangLabel = child.targetLinkLanguage|replace('-', '_')|language_name(siteLang) %}
                                                 {% endif %}
                                             {% endif %}