diff --git a/app/[lang]/(live)/@languageSwitcher/[contentType]/[uid]/page.module.css b/app/[lang]/(live)/@languageSwitcher/[contentType]/[uid]/page.module.css
new file mode 100644
index 000000000..c0e8a497d
--- /dev/null
+++ b/app/[lang]/(live)/@languageSwitcher/[contentType]/[uid]/page.module.css
@@ -0,0 +1,17 @@
+.desktop {
+  display: none;
+}
+
+.mobile {
+  display: block;
+}
+
+@media (min-width: 950px) {
+  .desktop {
+    display: block;
+  }
+
+  .mobile {
+    display: none;
+  }
+}
diff --git a/app/[lang]/(live)/@languageSwitcher/[contentType]/[uid]/page.tsx b/app/[lang]/(live)/@languageSwitcher/[contentType]/[uid]/page.tsx
new file mode 100644
index 000000000..99083ed4e
--- /dev/null
+++ b/app/[lang]/(live)/@languageSwitcher/[contentType]/[uid]/page.tsx
@@ -0,0 +1,50 @@
+import { notFound } from "next/navigation"
+
+import { Lang } from "@/constants/languages"
+import { serverClient } from "@/lib/trpc/server"
+
+import Desktop from "@/components/Current/Header/LanguageSwitcher/Desktop"
+import Mobile from "@/components/Current/Header/LanguageSwitcher/Mobile"
+
+import styles from "./page.module.css"
+
+import {
+  ContentTypeParams,
+  LangParams,
+  PageArgs,
+  UIDParams,
+} from "@/types/params"
+import { LanguageSwitcherData } from "@/types/requests/languageSwitcher"
+
+export default async function LanguageSwitcher({
+  params,
+}: PageArgs<LangParams & ContentTypeParams & UIDParams, {}>) {
+  let urls: LanguageSwitcherData
+  let lang: Lang
+  switch (params.contentType) {
+    case "loyalty-page":
+      const data =
+        await serverClient().contentstack.loyaltyPage.languageSwitcher()
+      urls = data.urls
+      lang = data.lang
+      break
+    case "content-page":
+      // TODO: Implement this
+      return null
+    default:
+      const type: never = params.contentType
+      console.error(`Unsupported content type given: ${type}`)
+      notFound()
+  }
+
+  return (
+    <>
+      <section className={styles.desktop}>
+        <Desktop currentLanguage={params.lang} urls={urls} />
+      </section>
+      <section className={styles.mobile}>
+        <Mobile currentLanguage={params.lang} urls={urls} />
+      </section>
+    </>
+  )
+}
diff --git a/app/[lang]/(live)/@languageSwitcher/default.tsx b/app/[lang]/(live)/@languageSwitcher/default.tsx
new file mode 100644
index 000000000..ec32fd52f
--- /dev/null
+++ b/app/[lang]/(live)/@languageSwitcher/default.tsx
@@ -0,0 +1,3 @@
+export default async function LanguageSwitcher() {
+  return null
+}
diff --git a/app/[lang]/(live)/@languageSwitcher/my-pages/[...path]/page.module.css b/app/[lang]/(live)/@languageSwitcher/my-pages/[...path]/page.module.css
new file mode 100644
index 000000000..c0e8a497d
--- /dev/null
+++ b/app/[lang]/(live)/@languageSwitcher/my-pages/[...path]/page.module.css
@@ -0,0 +1,17 @@
+.desktop {
+  display: none;
+}
+
+.mobile {
+  display: block;
+}
+
+@media (min-width: 950px) {
+  .desktop {
+    display: block;
+  }
+
+  .mobile {
+    display: none;
+  }
+}
diff --git a/app/[lang]/(live)/@languageSwitcher/my-pages/[...path]/page.tsx b/app/[lang]/(live)/@languageSwitcher/my-pages/[...path]/page.tsx
new file mode 100644
index 000000000..e6ee25f98
--- /dev/null
+++ b/app/[lang]/(live)/@languageSwitcher/my-pages/[...path]/page.tsx
@@ -0,0 +1,21 @@
+import { serverClient } from "@/lib/trpc/server"
+
+import Desktop from "@/components/Current/Header/LanguageSwitcher/Desktop"
+import Mobile from "@/components/Current/Header/LanguageSwitcher/Mobile"
+
+import styles from "./page.module.css"
+
+export default async function LanguageSwitcher() {
+  const data = await serverClient().contentstack.accountPage.languageSwitcher()
+
+  return (
+    <>
+      <section className={styles.desktop}>
+        <Desktop currentLanguage={data.lang} urls={data.urls} />
+      </section>
+      <section className={styles.mobile}>
+        <Mobile currentLanguage={data.lang} urls={data.urls} />
+      </section>
+    </>
+  )
+}
diff --git a/app/[lang]/(live)/layout.tsx b/app/[lang]/(live)/layout.tsx
index 34e4cf3b5..21de6ae49 100644
--- a/app/[lang]/(live)/layout.tsx
+++ b/app/[lang]/(live)/layout.tsx
@@ -6,6 +6,7 @@ import Script from "next/script"
 import TrpcProvider from "@/lib/trpc/Provider"
 
 import AdobeScript from "@/components/Current/AdobeScript"
+import Header from "@/components/Current/Header"
 import VwoScript from "@/components/Current/VwoScript"
 
 import type { Metadata } from "next"
@@ -20,7 +21,12 @@ export const metadata: Metadata = {
 export default async function RootLayout({
   children,
   params,
-}: React.PropsWithChildren<LayoutArgs<LangParams>>) {
+  languageSwitcher,
+}: React.PropsWithChildren<
+  LayoutArgs<LangParams> & {
+    languageSwitcher: React.ReactNode
+  }
+>) {
   return (
     <html lang={params.lang}>
       <head>
@@ -43,7 +49,8 @@ export default async function RootLayout({
         <VwoScript />
       </head>
       <body>
-        <TrpcProvider lang={params.lang}>{children}</TrpcProvider>
+        <TrpcProvider lang={params.lang}>
+              <Header lang={params.lang} languageSwitcher={languageSwitcher} />{children}</TrpcProvider>
         <Script id="page-tracking">{`
           typeof _satellite !== "undefined" && _satellite.pageBottom();
         `}</Script>
diff --git a/app/[lang]/(live-current)/@languageSwitcher/current-content-page/page.tsx b/app/[lang]/(live-current)/@languageSwitcher/current-content-page/page.tsx
new file mode 100644
index 000000000..03a82e5f5
--- /dev/null
+++ b/app/[lang]/(live-current)/@languageSwitcher/current-content-page/page.tsx
@@ -0,0 +1 @@
+export { default } from "../page"
diff --git a/app/[lang]/(live-current)/@languageSwitcher/page.module.css b/app/[lang]/(live-current)/@languageSwitcher/page.module.css
new file mode 100644
index 000000000..c0e8a497d
--- /dev/null
+++ b/app/[lang]/(live-current)/@languageSwitcher/page.module.css
@@ -0,0 +1,17 @@
+.desktop {
+  display: none;
+}
+
+.mobile {
+  display: block;
+}
+
+@media (min-width: 950px) {
+  .desktop {
+    display: block;
+  }
+
+  .mobile {
+    display: none;
+  }
+}
diff --git a/app/[lang]/(live-current)/@languageSwitcher/page.tsx b/app/[lang]/(live-current)/@languageSwitcher/page.tsx
new file mode 100644
index 000000000..18783cdd0
--- /dev/null
+++ b/app/[lang]/(live-current)/@languageSwitcher/page.tsx
@@ -0,0 +1,54 @@
+import { batchRequest } from "@/lib/graphql/batchRequest"
+import {
+  GetDaDeEnUrls,
+  GetFiNoSvUrls,
+} from "@/lib/graphql/Query/LanguageSwitcherCurrent.graphql"
+
+import Desktop from "@/components/Current/Header/LanguageSwitcher/Desktop"
+import Mobile from "@/components/Current/Header/LanguageSwitcher/Mobile"
+
+import styles from "./page.module.css"
+
+import { LangParams, PageArgs } from "@/types/params"
+import { LanguageSwitcherData } from "@/types/requests/languageSwitcher"
+
+export default async function LanguageSwitcher({
+  params,
+  searchParams,
+}: PageArgs<
+  LangParams,
+  {
+    uid: string
+    uri: string
+  }
+>) {
+  if (!searchParams.uid) {
+    return null
+  }
+
+  const variables = {
+    uid: searchParams.uid,
+  }
+
+  const { data: urls } = await batchRequest<LanguageSwitcherData>([
+    {
+      document: GetDaDeEnUrls,
+      variables,
+    },
+    {
+      document: GetFiNoSvUrls,
+      variables,
+    },
+  ])
+
+  return (
+    <>
+      <section className={styles.desktop}>
+        <Desktop currentLanguage={params.lang} urls={urls} />
+      </section>
+      <section className={styles.mobile}>
+        <Mobile currentLanguage={params.lang} urls={urls} />
+      </section>
+    </>
+  )
+}
diff --git a/app/[lang]/(live-current)/current-content-page/page.tsx b/app/[lang]/(live-current)/current-content-page/page.tsx
index 0cb828fa8..8b46a3a7a 100644
--- a/app/[lang]/(live-current)/current-content-page/page.tsx
+++ b/app/[lang]/(live-current)/current-content-page/page.tsx
@@ -60,7 +60,6 @@ export default async function CurrentContentPage({
 
     return (
       <>
-        <Header lang={params.lang} />
         <ContentPage data={response.data} />
         <Tracking pageData={trackingData} />
       </>
diff --git a/app/[lang]/(live-current)/layout.tsx b/app/[lang]/(live-current)/layout.tsx
index 810cd1314..f8efd6d25 100644
--- a/app/[lang]/(live-current)/layout.tsx
+++ b/app/[lang]/(live-current)/layout.tsx
@@ -22,7 +22,10 @@ export const metadata: Metadata = {
 export default function RootLayout({
   children,
   params,
-}: React.PropsWithChildren<LayoutArgs<LangParams>>) {
+  languageSwitcher,
+}: React.PropsWithChildren<
+  LayoutArgs<LangParams> & { languageSwitcher: React.ReactNode }
+>) {
   return (
     <html lang={params.lang}>
       <head>
@@ -76,7 +79,7 @@ export default function RootLayout({
       <body className="theme-00Corecolours theme-X0Oldcorecolours">
         <LangPopup lang={params.lang} />
         <SkipToMainContent lang={params.lang} />
-        <Header lang={params.lang} />
+        <Header lang={params.lang} languageSwitcher={languageSwitcher} />
         {children}
         <Footer lang={params.lang} />
         <Script id="page-tracking">{`