Option to generate alternate links in <head> #547
beeb
started this conversation in
DX improvements
Replies: 2 comments 1 reply
-
|
Hi @beeb, |
Beta Was this translation helpful? Give feedback.
1 reply
-
|
Thanks for this! I managed to do something like you suggested. I'll make a PR to the sveltekit demo repo tomorrow including this and an example how to change the <title> element.
<script lang="ts">
import { locales } from '$i18n/i18n-util'
import { page } from '$app/stores'
import { replaceLocaleInUrl } from '$lib/utils'
</script>
{#each locales as l}
<link rel="alternate" hreflang={l} href={`${replaceLocaleInUrl($page.url, l)}`} />
{/each}
<script lang="ts">
import HeadHrefLangs from '$lib/components/HeadHrefLangs.svelte'
</script>
<svelte:head>
<HeadHrefLangs />
</svelte:head>
export const replaceLocaleInUrl = (url: URL, locale: string): string => {
const [, , ...rest] = url.pathname.split('/')
return `/${[locale, ...rest].join('/')}${url.search}`
} |
Beta Was this translation helpful? Give feedback.
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
-
Is there a way that we could generate alternative links for the same page in other languages inside the
<head>tag?Reference: https://developers.google.com/search/docs/specialty/international/localized-versions#html
<link rel="alternate" hreflang="lang_code" href="url_of_page" />I've seen i18n libraries for Astro provide a component for this, but I don't know how it would look with
typesafe-i18n. Specifically, I would be interested in a solution for SvelteKit.Thanks!
Beta Was this translation helpful? Give feedback.
All reactions