Sveltekit Change Page Title Dynamically

Svelte page title
Static page
The <svelte:head> is a special element you can use to insert elements inside the <head> element. Add this to any page and set the page name
+page.svelte
<svelte:head> <title>Twitter</title> </svelte:head>
1. Open +layout.svelte & import page
Dynamic Page
+layout.svelte
import { page } from '$app/stores';
Additionally, we can console log these values if required
+layout.svelte
// Activate these 3 only when it requires $: console.log('page info is: '); $: console.log($page.params?.path); $: console.log($page);
2. Now add the svelte head
+page.svelte
<svelte:head> <title>Sabbirz | {$page.params?.path ? `${$page.params?.path} Page` : 'Homepage'}</title> </svelte:head>
Read the code like this - If page.params.path is available then use that as the page name with the addition of page string else name the page as Homepage.