Skip to Content
Core ConceptsVariant System

Variants

Variants let you serve different content to different audiences. Show mobile users a simplified layout, VIP customers exclusive offers, or regional users localized content - all from the same page.

What is a Variant?

A variant is an alternative version of your content that displays when certain conditions are met. Each piece of content can have multiple variants:

Homepage ├── Default variant (shown to everyone else) ├── Mobile variant (simplified for small screens) ├── VIP variant (exclusive offers) └── Holiday variant (seasonal content)

How Variants Work

  1. Create variants for a page or entity
  2. Set targeting rules for each variant
  3. When a visitor arrives, Foir checks the rules
  4. The matching variant is displayed (or default if none match)

Creating Variants

In the Editor

  1. Open any page or content item
  2. Click the Variants dropdown (top of editor)
  3. Click Add Variant
  4. Configure:
    • Name: “Mobile Version”
    • Key: mobile (used internally)
    • Targeting: Set rules for when to show
    • Priority: Higher = checked first
  5. Edit the variant’s content
  6. Publish when ready

From the Variant Catalog

For rules you use frequently:

  1. Go to Settings > Variant Catalog
  2. Create reusable targeting rules (e.g., “VIP Customers”, “Mobile Users”)
  3. When creating a variant, select from catalog instead of creating custom rules

Targeting Rules

Targeting rules determine which variant to show. Build rules using conditions:

Available Conditions

Device & Platform

  • Device is mobile, tablet, or desktop
  • Platform is web, iOS, or Android

Authentication

  • User is logged in or anonymous

Custom Contexts (you configure these)

  • Market (UK, US, etc.)
  • Language/locale
  • Customer segments (VIP, first-time, etc.)

Combining Rules

Use AND/OR logic:

Show to VIP mobile users:

  • Segment is VIP AND Device is mobile

Show to UK or US visitors:

  • Market is UK OR Market is US

Variant Priority

When multiple variants could match, priority determines the winner:

VariantPriorityRule
Holiday VIP30Is holiday AND is VIP
VIP20Is VIP
Mobile10Device is mobile
Default0(always matches)

Higher priority variants are checked first. The first match wins.

Publishing Variants

Each variant publishes independently:

  • Edit the VIP variant without affecting the default
  • Publish mobile changes while VIP stays in draft
  • Schedule different variants for different times

Version History

Each variant maintains its own version history:

  1. Make changes (auto-saved as draft)
  2. Preview before publishing
  3. Publish when ready
  4. Roll back if needed

Common Use Cases

Mobile Optimization

Create a mobile variant with:

  • Shorter headlines
  • Fewer images
  • Simplified navigation
  • Larger tap targets

Regional Content

Create market variants with:

  • Local currency and pricing
  • Region-specific offers
  • Localized images
  • Local contact information

Customer Segments

Create segment variants with:

  • VIP-exclusive content
  • First-time visitor onboarding
  • Returning customer promotions
  • Loyalty tier benefits

A/B Testing

Create test variants with:

  • Different headlines
  • Alternative CTAs
  • Layout variations
  • Image options

Best Practices

  1. Always have a default - One variant should match when nothing else does
  2. Keep rules simple - Complex rules are hard to debug
  3. Use the catalog - Reuse common rules across your site
  4. Test thoroughly - Preview with different contexts before publishing
  5. Document your variants - Use clear names and descriptions
  6. Consider mobile first - Many visitors are on mobile devices

Next Steps

  • Targeting - Deep dive into targeting rules
  • Routing - How variants work with URLs
  • Entities - Content structure overview
Last updated on