WC2026 / Internal / SSOT

WC2026 Theme-Adaptive Test Page

This page contains every canonical building block used for WC 2026 wiki content. Each block has a short legend. Copy the HTML snippet directly out of this page.

Paste this page into a CMS preview on Napoleon Sports BE (light), Napoleon Games BE (dark) and Superbet RO (light) to validate the theme-adaptive behaviour.

1. Frame: wrapper and breadcrumb

1.1 Wrapper (top-level container)

First div in every article. No background, no color. Inter font stack, max-width 800px, padding for mobile.

1.2 Breadcrumb (3 levels, with home icon)

Three levels: home icon, WC 2026 hub, current page (red). Home and hub links inherit colour via color:inherit. Only the current page is red.

2. Headings

2.1 H1 (page title)

One per page, directly after the breadcrumb.

Example article title spanning a couple of lines

2.2 H2-large (editorial / hub)

For longform and hub pages. 26px, red top border with 20px padding. Used in stadiums.html, history.html, kits.html, kick-off-times.html.

H2 large editorial section

2.3 H2-compact (data-heavy / odds)

For data-heavy pages (odds, groups). 22px, font-weight 800, same 20px padding. Used in belgium-odds.html, group-g.html.

H2 compact data section

2.4 H3 (subsection)

Under an H2. No border, just font-size and margin.

H3 subsection heading

2.5 H4 (small sub-sub)

Use sparingly. Only when three hierarchical levels are truly needed.

H4 micro heading

3. Page openers

3.1 Eyebrow + H1 + lead

Standard opening pattern: small uppercase eyebrow, H1, lead paragraph.

Stadium guide

Los Angeles Stadium at WC 2026

The venue in Inglewood, California, hosts eight WC 2026 matches including the United States opening fixture and a quarter-final.

3.2 Opener with badge + stats row

Stadium or country pages: badge above H1, then a stats row directly underneath the lead.

Host City

Los Angeles

Eight WC 2026 matches at the Los Angeles Stadium, including the United States opener against Paraguay on 12 June.

4. Body

4.1 Default paragraph

A regular paragraph with bold, italic and an in-text link to stadiums. In-text links are always red (#E30613) and underlined. External links get the extra target="_blank" rel="noopener" attribute: Wikipedia entry.

4.2 Caption / smaller text

Because the site forces font-size:16px !important on <p>, we use a span for smaller text.

Caption example: this is a smaller paragraph with opacity that renders slightly lighter.

4.3 Lead / intro paragraph

Slightly more prominent than body. No font-size on p, so we use weight and spacing.

Lead paragraph in a slightly bolder format. Keep it to one or two sentences, directly under H1 or a section heading.

4.4 Unordered list

• First bullet, with an in-text link to Belgium.
• Second bullet with a bold part and regular text.
• Third and final bullet, shorter sentence.

4.5 Ordered list

1. First numbered step.
2. Second numbered step, with more detail about what should happen.
3. Third step.

4.6 USP bullets with checkmark

For key takeaways directly under the intro of a hub or pillar page. Uses the ✅ entity so no extra SVG is needed.

4.7 Blockquote / pull quote

"This venue will host the Opening and Closing Ceremonies of the LA 2028 Olympics, making it one of the few in the world to play a central role in both events within a two-year span."

4.8 Image with caption

Image wrapped in a figure-like div with caption. Use loading="lazy" for below-the-fold images.

4.9 Inline code and keyboard hint

Use inline code for tokens, attribute names and short identifiers. For UI keys: press Enter to confirm.

4.10 Pro tip / expert note

5. Containers and callouts

5.1 TOC (editorial, default)

Default table of contents for longform and hub pages. Grey box, radius 8px. TOC links are red but not underlined, with list markers hidden.

5.2 TOC (compact variant with border)

Slightly more prominent TOC for data-heavy pages (odds, groups). With border, radius 12px and uppercase label.

5.3 Key facts box (mini-table)

Vertical label/value table with grey background. Used for stadium specs, team profiles, country quick facts.

5.4 Info callout (neutral)

Grey callout for neutral info. No brand colour, works on every theme.

5.5 Brand callout (red accent)

For "did you know" or important compliance reminders. Red-tinted background, red border-left.

5.6 Warning callout (amber)

For caveats or "subject to change" notes. Amber border-left, transparent grey background.

5.7 Stat highlights (3-up)

For a prominent number in the body. Use div instead of p so font-size is not overruled.

5.8 Comparison cards (2-up)

Two side-by-side cards to compare options, teams or venues. Equal width on desktop, stacked on mobile.

6. Data: tables, pills and badges

6.1 Standard table (with overflow wrapper)

Wrap every table in an overflow wrapper so narrow screens can scroll instead of squashing columns.

6.2 Standings table (with status pills)

For group standings. Pills for W/D/L with status colours and white text.

6.3 Status pills (standalone)

Inline pills with status colour and white text. Work on every theme because they have their own background.

W Win D Draw L Loss Info Live

6.4 Section-tag above heading (uppercase chip)

For "Category" or "Stage" labels above a section.

Knockout stage

Round of 32 matches at the Los Angeles Stadium

6.5 Match preview tile

Compact tile for an upcoming fixture: date, group, teams, venue, time. Suitable for grids of upcoming matches.

6.6 Comparison table (versus rows)

Side-by-side spec comparison.

7. FAQ

FAQ pattern: H3 for the question, paragraph(s) for the answer. No accordion, no JS, the site CMS strips scripts.

How many stadiums host WC 2026?

Sixteen, across three countries: eleven in the United States, three in Mexico and two in Canada. Together they stage 104 matches. See the stadium overview for the full list.

Where is the final played?

At the New York New Jersey Stadium on 19 July 2026. It is an open-air venue with a tournament capacity of around 82,500.

8. CTAs and button variants

8.1 Hero CTA (red block with yellow top-border accent)

Large registration or odds CTA after the intro paragraph. Self-contained: every child colour is explicit white because the red background forces contrast.

8.2 Compact bridge CTA (red border-left)

Mid-page bridge to the sportsbook. More subtle than the hero, better for inline use.

8.3 Button variants (inline)

Three button styles to use next to each other.

Primary (red bg) Secondary (red outline) Tertiary (neutral)

8.4 In-text link vs button (difference)

Important distinction: an in-text link sits in running prose and is always red and underlined. A button-link is a visual button with a background and no underline.

8.5 BetBuilder CTA

Cross-sell to the BetBuilder feature. Two-line headline plus a single primary button.

8.6 Promo / boost CTA (yellow accent)

For odds boosts and short-window promotions. Yellow border-left accent ties to brand secondary colour.

8.7 App download (compact)

Short, two-button row pointing to iOS and Android stores.

8.8 Soft inline bridge (one-liner)

The lightest CTA: a single line of prose with an in-text link to the sportsbook. Use mid-article without breaking the reading flow.

Live odds for every WC 2026 fixture update in real time on the WC 2026 betting page.

9. Related content, internal links footer, meta and divider

9.1 Related content (compact list)

At the bottom of an article: grouped internal links. All links red and underlined.

Explore the host cities

• New York, Los Angeles, Dallas and Atlanta
• Toronto and Vancouver (Canada)
• Mexico City, Guadalajara and Monterrey (Mexico)

9.2 Trust footer (compact, neutral)

Short trust strip with three USPs in a row. No brand colour, works on any theme.

9.3 Author byline / last updated meta

Editorial meta directly under H1 or at the bottom of the article. Small font through a span, light opacity.

9.4 Section divider (subtle)

Use between major content blocks when an H2 with red top border is overkill.

---

9.5 Brand accent divider (red)

Use sparingly between two big sections that both deserve emphasis.

---

10. Responsible gaming footer

One-line responsible gaming notice. Italic, lower opacity, small font through a span. Required at the bottom of every BE page.

Bet within your limits. Tools for setting deposit limits, time-outs and self-exclusion are available under responsible gaming. Help is available via Belgian responsible gaming resources.

Play responsibly. Napoleon Sports is licensed by the Belgian Gaming Commission. 21+. For support, visit stopoptijd.be.