Skip to main content

Documentation Index

Fetch the complete documentation index at: https://buttercms.com/docs/llms.txt

Use this file to discover all available pages before exploring further.

​
SEO for multilingual sites

With the rapid evolution of the digital world, businesses are increasingly recognizing the significance of reaching a global audience. However, implementing a successful global SEO strategy can be complex and daunting, particularly when navigating the complexity of multiple languages and cultural differences.

​
Why multilingual SEO matters

According to a report by Common Sense Advisory, 75% of consumers prefer to buy products in their native language, and 60% of global consumers rarely or never buy from English-only websites. This proves that investing in content localization—and the SEO to support it—is a beneficial way to grow your business. Benefits of proper multilingual SEO include:
  • Expanded customer base and increased revenue
  • Improved search visibility in local search engines
  • Reduced bounce rates from language mismatches
  • Increased time on page through localized content

​
URL structure strategies

Choose the right URL structure for your multilingual site: 
example.com/en/about
example.com/es/about
example.com/de/about
Pros:
  • Easy to set up and maintain
  • Inherits domain authority
  • Simple analytics tracking
Cons:
  • Less perceived local relevance

​
Option 2: subdomains

en.example.com/about
es.example.com/about
de.example.com/about
Pros:
  • Can be hosted in different locations
  • Separate from main domain issues
Cons:
  • Treated as separate sites by Google
  • Requires building authority for each

​
Option 3: country-code TLDs (ccTLDs)

example.com/about (default)
example.es/about
example.de/about
Pros:
  • Strong geographic signal to search engines
  • High trust from local users
Cons:
  • Most expensive to maintain
  • Requires separate SEO efforts per domain
For most businesses, subdirectories offer the best balance of simplicity and SEO benefit. Use ccTLDs only if you have significant resources for each market.

​
Implementing hreflang tags

Hreflang tags tell search engines which language and regional version of a page to show users based on their location and language preferences.

​
Basic hreflang syntax

<link rel="alternate" hreflang="en" href="https://example.com/en/page" />
<link rel="alternate" hreflang="es" href="https://example.com/es/page" />
<link rel="alternate" hreflang="de" href="https://example.com/de/page" />
<link rel="alternate" hreflang="x-default" href="https://example.com/page" />

​
Language-region codes

For regional targeting, use language-country codes: 
<link rel="alternate" hreflang="en-us" href="https://example.com/en-us/page" />
<link rel="alternate" hreflang="en-gb" href="https://example.com/en-gb/page" />
<link rel="alternate" hreflang="es-es" href="https://example.com/es-es/page" />
<link rel="alternate" hreflang="es-mx" href="https://example.com/es-mx/page" />

​
The x-default tag

Always include an x-default tag for users whose language/region isn’t specifically targeted: 
<link rel="alternate" hreflang="x-default" href="https://example.com/page" />

​
Implementation with ButterCMS

Create an SEO component that generates hreflang tags dynamically: 
// React/Next.js example
function HreflangTags({ currentSlug, locales }) {
  const baseUrl = 'https://example.com';

  return (
    <Head>
      {locales.map(locale => (
        <link
          key={locale}
          rel="alternate"
          hreflang={locale}
          href={`${baseUrl}/${locale}/${currentSlug}`}
        />
      ))}
      <link
        rel="alternate"
        hreflang="x-default"
        href={`${baseUrl}/${currentSlug}`}
      />
    </Head>
  );
}

​
Content considerations

​
Keyword research per locale

Not all keywords translate directly. Luis Rodriguez, Head of SEO at Compare the Market, emphasizes: “Not all countries are the same. And I think that applies also to keywords. It will be perhaps simplistic to say that every keyword has an actual replacement in every language. I don’t think that’s the case.” The intent behind keywords can vary significantly depending on the cultural context, leading to different meanings.

​
Keyword strategy best practices

  1. Research keywords in each target language - Don’t just translate
  2. Understand local search behavior - Different markets use different search patterns
  3. Analyze local competitors - See what terms they rank for
  4. Consider cultural context - Same word may have different connotations
Example:
  • English: “cheap flights” (acceptable)
  • German: “günstige Flüge” (cheap) vs “billige Flüge” (low quality connotation)

​
Meta tags for multilingual content

​
Title tags

  • Keep to 50-60 characters
  • Include target keywords for that locale
  • Don’t just translate—optimize for local search intent
<!-- English -->
<title>Best CRM Software for Small Business | Brand</title>

<!-- Spanish -->
<title>Mejor Software CRM para Pequeñas Empresas | Brand</title>

<!-- German -->
<title>Beste CRM-Software für kleine Unternehmen | Brand</title>

​
Meta descriptions

  • 150-160 characters
  • Include call-to-action appropriate for the culture
  • Localize, don’t just translate

​
Open Graph tags

Set locale-specific OG tags for social sharing: 
<meta property="og:locale" content="en_US" />
<meta property="og:locale:alternate" content="es_ES" />
<meta property="og:locale:alternate" content="de_DE" />

​
ButterCMS SEO Component Pattern

Create a reusable SEO component in your ButterCMS Page Types:

​
Component schema

SEO Component:
├── meta_title (Short Text)
├── meta_description (Long Text)
├── og_image (Media)
├── og_title (Short Text)
├── og_description (Long Text)
├── canonical_url (Short Text) [optional]
├── no_index (Checkbox)
└── structured_data (Long Text/JSON)

​
Fetching and rendering

// Fetch page with SEO component
const page = await butter.page.retrieve('landing_page', 'home', {
  locale: userLocale
});

const seo = page.data.data.fields.seo_component;

// Render in head
<Head>
  <title>{seo.meta_title}</title>
  <meta name="description" content={seo.meta_description} />

  {/* Open Graph */}
  <meta property="og:title" content={seo.og_title || seo.meta_title} />
  <meta property="og:description" content={seo.og_description || seo.meta_description} />
  <meta property="og:image" content={seo.og_image} />
  <meta property="og:locale" content={userLocale.replace('-', '_')} />

  {/* Hreflang */}
  {availableLocales.map(locale => (
    <link
      key={locale}
      rel="alternate"
      hreflang={locale}
      href={`${baseUrl}/${locale}/${slug}`}
    />
  ))}

  {/* Canonical */}
  {seo.canonical_url && <link rel="canonical" href={seo.canonical_url} />}

  {/* Robots */}
  {seo.no_index && <meta name="robots" content="noindex, nofollow" />}
</Head>

​
Technical SEO checklist

​
Crawling & indexing

  • Hreflang tags on all localized pages
  • XML sitemaps for each locale (or combined with hreflang)
  • Canonical tags pointing to correct locale version
  • No duplicate content across locales without proper tags
  • Robots.txt allows crawling of all locale paths

​
Site structure

  • Consistent URL structure across locales
  • Language/region selector accessible from all pages
  • Internal links use proper locale paths
  • 404 pages exist for each locale

​
Performance

  • CDN configured for global delivery
  • Images optimized for each region (if different)
  • Core Web Vitals meet standards for all locales

​
Content

  • Unique, localized title tags per page per locale
  • Unique, localized meta descriptions
  • Proper heading structure (H1, H2, etc.)
  • Alt text translated/localized for images

​
Common mistakes to avoid

​
Poor translation quality

Companies may rely only on automatic translation tools or inexperienced translators, resulting in poor quality translations that can damage the company’s reputation. Solution: Hire professional translators with subject matter expertise and review translations thoroughly for important content.

​
Ignoring local search behavior

Different markets search differently—both in terms of keywords and search engines used. Solution: Conduct thorough market research and engage with local experts.

​
Additional common mistakes

  1. Forgetting hreflang on all pages - Every page needs tags, not just the homepage
  2. Incorrect hreflang syntax - Use ISO 639-1 for language, ISO 3166-1 Alpha 2 for country
  3. Missing x-default - Always include a fallback
  4. Auto-redirecting based on IP - Let users choose; use hreflang for search engines
  5. Translating URLs literally - Sometimes translated URLs don’t make sense
  6. Duplicate content without tags - Always use canonical or hreflang

​
Monitoring and analytics

​
Google Search Console

  • Set up separate properties for each locale/country
  • Monitor search performance by country
  • Check for hreflang errors in International Targeting report
  • Review indexed pages per locale

​
Google Analytics

  • Create views/segments per locale
  • Track bounce rate by locale
  • Monitor conversion rates per market
  • Set up goals specific to each region

​
Key metrics to track

MetricWhy It Matters
Organic traffic by localeGrowth indicator
Bounce rate by localeContent relevance
Conversion rate by localeMarket fit
Page speed by regionUX performance
Ranking positionsVisibility

​
Resources

Building relationships with local SEO communities and leveraging their collective knowledge is invaluable. As Luis Rodriguez advises: “Reaching out and creating a network into the places that we want to be actively working is just something really healthy, not only for the projects or for the companies themselves, but also personally and professionally.”