In my last article, I showed you how to fix canonical URLs when running Framer for marketing pages with Next.js for your app. But there's another integration detail that'll bite you if you're not careful: your sitemap.

The Sitemap Dilemma

When you're using Framer for marketing pages (/, /contact-us, /about) and Next.js for your app (/app/*), where does your sitemap live? And more importantly, how do you make sure search engines can find it?

Here's what most developers miss: your sitemap needs to be served from your root domain, but it also needs to include all your marketing pages that are actually hosted on Framer.

The Simple Solution

The fix is surprisingly straightforward. Create a static sitemap.xml file in your Next.js public folder:

<?xml version="1.0" encoding="UTF-8"?>
<urlset xmlns="http://www.sitemaps.org/schemas/sitemap/0.9" xmlns:xhtml="http://www.w3.org/1999/xhtml">
<url>
<loc>https://respondra.com/</loc>
</url>
<url>
<loc>https://respondra.com/about</loc>
</url>
<url>
<loc>https://respondra.com/pricing</loc>
</url>
<url>
<loc>https://respondra.com/contact-us</loc>
</url>
<url>
<loc>https://respondra.com/terms</loc>
</url>
<url>
<loc>https://respondra.com/privacy</loc>
</url>
</urlset>

The Next.js Config Magic

The key is in your next.config.js. You need a specific rewrite rule that catches the sitemap request before your Framer fallback:

async rewrites() {
  return [
    {
      source: '/sitemap.xml',
      destination: '/sitemap.xml',
    },
    {
      source: '/blog/:path*',
      destination: 'https://blog.respondra.com/blog/:path*',
    },
    {
      source: '/:path((?!app)(?!blog)(?!sitemap.xml)(?!_next).*)',
      destination: 'https://www.respondra.com/:path*',
    },
  ];
}

Notice the order matters:

1. First, we explicitly handle /sitemap.xml to serve it from Next.js

2. Then we handle blog routes

3. Finally, we have the catch-all that excludes sitemap.xml and sends everything else to Framer

Why This Works

The magic is in that last rewrite rule: (?!sitemap.xml). This negative lookahead ensures that sitemap requests don't get forwarded to Framer. Instead, they're served directly from your Next.js public folder.

When Google crawls https://respondra.com/sitemap.xml, it gets served from your Next.js app, but all the URLs in the sitemap point to your marketing pages, which are seamlessly handled by your Framer rewrite rules.

Testing Your Sitemap

First, verify the technical setup:

1. Visit https://respondra.com/sitemap.xml in your browser

2. Check that you see your clean XML without any Framer interference

3. Run curl -I https://respondra.com/sitemap.xml to verify it returns proper headers

The Google Search Console Setup

Here's where most developers fumble the handoff. You've got your sitemap working, but now you need to tell Google about it properly.

Step 1: Property Setup Matters

Make sure you have the correct property set up in Google Search Console. You want the property for respondra.com (without www), not www.respondra.com. This should match your canonical URLs from the previous article.

If you currently have the www version as your main property:

1. Add the non-www version as a new property

2. Verify ownership using the HTML tag method or DNS verification

3. Set the non-www version as your preferred domain

Step 2: Submit Your Sitemap

In Google Search Console:

1. Navigate to Sitemaps in the left sidebar

2. Click Add a new sitemap

3. Enter sitemap.xml (just the filename, not the full URL)

4. Click Submit

Google will start processing it immediately. You should see it appear in the sitemaps list with a status of "Success" within a few minutes.

Step 3: Handle the Old Sitemap

If you previously had a sitemap submitted from your Framer setup (like www.respondra.com/sitemap.xml), you need to clean this up:

1. Find the old sitemap in your sitemaps list

2. Click on it and select Delete sitemap

3. This prevents confusion and ensures Google focuses on your new, correct sitemap

Step 4: Monitor the Results

Within 24-48 hours, check the sitemap performance:

1. Click on your new sitemap in the list

2. You should see "Discovered" and "Indexed" counts

3. All 6 URLs should show as discovered (this happens quickly)

4. Indexed count will grow over the following days as Google crawls

Common GSC Issues and Fixes

"Couldn't fetch" error: Your rewrite rules might not be working. Test the sitemap URL directly in an incognito browser.

"Has issues" status: Click into the details. Usually this means duplicate URLs or redirect chains. Make sure your canonical URL fixes from the previous article are working.

Low indexed count: Be patient. Google doesn't index everything immediately, especially if these are new URLs or your domain is relatively new.

Pro Tip: Use the URL Inspection Tool

After submitting your sitemap, test a few URLs:

1. Copy one of your marketing page URLs from the sitemap

2. Use the URL Inspection tool in GSC

3. Paste the URL and hit Enter

4. You should see "URL is on Google" or "URL can be indexed"

If you see issues here, it usually means your canonical URL setup needs work.

The Edge Case Most Miss

Here's what's clever about this setup: your sitemap lives in Next.js, but it references pages that are served by Framer. When Google crawls these URLs from your sitemap, they get seamlessly routed through your rewrite rules to Framer.

This means you get the best of both worlds - centralized sitemap control in your Next.js app, but all your marketing pages still benefit from Framer's speed and design capabilities.

Why This Matters

Without this setup, you'd either have:

• No sitemap (Google finds your pages slowly)

• Framer's default sitemap with wrong canonical URLs

• A sitemap that doesn't include your app routes

With this simple fix, search engines get a clear map of your entire site structure, served from the right domain, pointing to the right URLs.

The Real 5% Edge

Most developers running hybrid setups completely forget about the sitemap until they notice their pages aren't getting indexed properly. By handling this upfront, you ensure search engines can efficiently crawl and index your entire site.

This is exactly the kind of detail that compounds over time. Six months from now, when your marketing pages are ranking well and your app pages are properly indexed, you'll be glad you took the extra 10 minutes to get this right.

Next up: I'll show you how to handle analytics tracking across your hybrid setup. Because yes, there's another integration detail that most people miss.