Configuring your Sitecore Heads in Vercel for Multi-site

Solution Structure

If you haven't already, have a quick read of this post which covers one of the ways we can utilise multi-headed multi-site with Sitecore.

Let's assume we have 3-4 seperate heads and a shared site to manage the shared components/logic and you now want to configure Vercel to manage this nicely for you.

Managing multiple heads means you have multiple env variable files and need to have environment-specific values for a lot of these as you move between environments.

Let's also assume you want to have 3 seperate environments on top of your own local development environment:

Dev/QA Environment
UAT/Pre-Prod Environment
Production Environment

To support this, from a Vercel standpoint we're using GitOps which means that each env is tracking a different Git Branch.

We are going to use a branching strategy and GitOps mapping as follows:

develop branch - standard working branch which new work feature branches are derived from. Dev/QA Vercel environment will track this branch.
uat branch - Vercel UAT environment branch - merges to this branch will trigger releases to all heads tracking it
master branch - Production branch. Merges to this branch will deploy changes to production.

Vercel Shared Environment Variables

If you have lots of heads but you're sharing some capabilities between them, there might be some environment variables you wish to share between all the heads. You can do this via the main team level settings shown below.

App-specific Environment Variables

For each Head, you will then be able to configure Production/Preview and Development environments. The way we generally opt to manage this is to use Production as Production (shock horror) and then depending how many non-prod environments we have set up Preview on branch x

For our example we have Preview on uat for UAT and then Preview on develop for our Dev/QA.

Simply punch in all the environment values against the correct environment/branch combination and that's it.

Add the shared variables you want to use in each head like so: