Sveltekit add a static sitemap

A sitemap is a tool that helps search engines better understand the content of a website, especially when there is a lot of it.

Before I share how to generate a sveltekit static sitemap, Remember that there are better ways to generate a sitemap. This is a noob way just to get the job done.

This way of generating sitemap requires updating the sitemap file manually after a certain interval.

The Sveltekit website has detailed documentation to generate the sitemap.

1. Create a folder named “sitemap.xml” inside the “routes” folder
2. Now create a “+server.js” file inside the “sitemap.xml” folder.
3. Now copy these codes inside +server.js file

   export async function GET()
   
   { return new Response(
   `<?xml version="1.0" encoding="UTF-8" ?>
   <urlset
       xmlns="https://www.sitemaps.org/schemas/sitemap/0.9"
       xmlns:xhtml="https://www.w3.org/1999/xhtml"
       xmlns:mobile="https://www.google.com/schemas/sitemap-mobile/1.0"
       xmlns:news="https://www.google.com/schemas/sitemap-news/0.9"
       xmlns:image="https://www.google.com/schemas/sitemap-image/1.1"
       xmlns:video="https://www.google.com/schemas/sitemap-video/1.1"
       >
       <!-- <url> elements go here -->
       </urlset>`.trim(),
       {
       headers: {
           'Content-Type': 'application/xml'
       }
       }
   );
   }

4. We have to replace <!-- <url> elements go here --> this section with our manually generated URL
5. Now visit this website XML-Sitemap and paste your website URL on the search box This will generate a static sitemap
6. Copy the highlighted section & paste it inside the +server.js file
7. Now visit your www.yoursite.com/sitemap

Keep in mind this is just a noob way of getting the job done.