Logo

Recently, while working on a Sitecore XM Cloud project with multiple websites and a complex language setup, as a Solution Architect, I encountered a challenge: how do we efficiently generate a sitemap for multiple websites, each supporting multiple languages, in a headless environment?

Sitecore XM Cloud lacks built-in sitemap generation, unlike its XP counterpart. Since we were using headless architecture with Next.js, we needed a custom solution to dynamically generate XML sitemaps for each website and language variation.

Our approach had to optimize performance by leveraging caching and API calls instead of querying Sitecore directly every time while ensuring search engines like Google could easily crawl and index the content.

Here’s how I tackled the problem, complete with configurations and code snippets.


Step 1: Understanding the Sitemap structure

Each website needed its own sitemap, with URLs structured based on the site’s language variations. A typical sitemap for our setup would look like this:

undefined (76) 

Since we had 38 domains in scope and multiple language variants for each, the sitemap needed to be generated dynamically.


Step 2: Creating the Sitemap Generator API in Next.js

Since our front-end was built with Next.js, we created a serverless API route to dynamically generate the sitemap.

Setting up the Sitemap API route

undefined (77)

Fetching Sitecore routes

Since we were using headless Sitecore, we had an API that returned the list of valid URLs for each website and language. Here’s how we fetched those URLs:

undefined (6)

This API fetches all published pages from Sitecore and constructs URLs for the sitemap.


Step 3: Handling multi-site and multi-language configurations

Each site in our Sitecore instance had its own root node and language versions. To dynamically fetch pages for each site and language, we updated our fetchSitecoreRoutes function to include parameters for site and language.

undefined (6)

Now, when generating sitemaps, we iterate over each site and language:

A computer screen shot of white text__AI-generated content may be incorrect_

This ensures that each website gets a properly structured sitemap for every language.


Step 4: Caching the Sitemap for performance

Since generating the sitemap on every request would be inefficient, we leveraged Next.js Incremental Static Regeneration (ISR) to cache the sitemap for a fixed duration.

We modified the API to use ISR by updating getStaticProps:

undefined (78)

This drastically reduced the load on our API and ensured the sitemap stayed updated daily.


Step 5: Submitting the Sitemap to search engines

Finally, we needed to submit the sitemap to Google Search Console and Bing Webmaster Tools. For automation, we used the following curl command:

A screen shot of a computer code__AI-generated content may be incorrect_ (2)

This ensured that search engines were always aware of the latest sitemap updates.


What’s Next?

Building a custom sitemap generator for Sitecore XM Cloud in a multi-site, multi-language headless environment was an exciting challenge. By leveraging Next.js API routes, dynamic route fetching, caching, and search engine submission, we ensured a scalable and efficient solution.

This approach is extendable – you can add priority logic, exclude certain pages, or even generate image sitemaps using the same principles.

If you have any questions or want to discuss your approach, reach out to me at marketing@altudo.co or you can also contact our team of experts for 1:1 no obligation consultation.

Need Help?

FAQs

A sitemap generator is a tool designed to create an XML sitemap to guide search engines in understanding the structure of a website. The generated sitemap is an XML file that lists all the URLs of the site along with metadata, such as the last modification date and how frequently pages are updated. This helps search engines crawl and index the site's content more effectively.

To manually create an XML sitemap, you first decide which pages to include. Then, using a text editor, you create a new XML file and structure it with the necessary XML tags. Each page's URL is specified in the file, and optional metadata like update frequency and priority can also be added. Once completed, the file is saved with an .xml extension and is ready to be uploaded for search engines.

Creating a visual sitemap begins by using a tool or template, such as Miro's Sitemap Template. Start by listing the primary pages of the website and then add secondary pages where appropriate. Organize these pages within the template and consult with your team to refine the structure. Unnecessary pages can be trimmed to streamline the sitemap. After reviewing with the team, finalize the layout while leaving space for notes or comments for further edits.

Setting up Sitecore XM Cloud involves several steps. Begin by updating the container images and building the containers for the solution. Configure the host settings and start the containers to bring the environment online. Next, launch the Sitecore XM Content Management (CM) instance and install the Sitecore CLI along with the required plugins. Populate Solr managed schemas and rebuild the search indexes to ensure everything is configured correctly.