Per-Page Customization

Customize individual pages with page-specific settings. Each page type (Landing, Tournaments, Teams, Matches) can have its own unique configuration while inheriting global theme settings.

Overview

Per-page customization allows you to:

• Override global settings for specific pages
• Create unique layouts for different page types
• Control content visibility per page
• Optimize each page for its specific purpose

Accessing Per-Page Settings

1. Navigate to Host Settings
2. Go to "Theme Customization" section
3. Scroll to "Per-Page Settings"
4. Expand the section for the page you want to customize
5. Adjust settings
6. Click "Save" to apply

Landing Page Settings

Customize your host's main landing page:

Hero Style

• Full-Width: Hero banner spans entire page width
• Contained: Hero is contained within content area

When to use:

• Full-width for maximum visual impact
• Contained for a more structured, traditional look

Show Statistics

Toggle whether statistics are displayed:

• Enabled: Shows tournament count, team count, match count
• Disabled: Hides statistics section

Show Featured Match

Toggle whether featured match is displayed:

• Enabled: Shows a highlighted featured match
• Disabled: Hides featured match section

Tournaments Page Settings

Customize how tournaments are displayed:

Card Columns

Number of tournament cards per row:

• 1 Column: Single column, large cards
• 2 Columns: Two columns, medium cards
• 3 Columns: Three columns (default), balanced
• 4 Columns: Four columns, compact view

Show Team Count

Display number of teams registered:

• Enabled: Shows team count on each tournament card
• Disabled: Hides team count

Show Duration

Display tournament duration:

• Enabled: Shows start and end dates
• Disabled: Hides duration information

Show Dates

Display tournament dates:

• Enabled: Shows date information
• Disabled: Hides dates

Teams Page Settings

Customize the teams listing page:

Card Columns

Number of team cards per row:

• 1 Column: Single column layout
• 2 Columns: Two columns
• 3 Columns: Three columns
• 4 Columns: Four columns (good for team logos)

Logo Size

Size of team logos on cards:

• Small: Compact logos, more teams visible
• Medium: Balanced size (default)
• Large: Larger logos, fewer teams per row

Recommendation: Use 4 columns with medium logos for best team showcase.

Matches Page Settings

Customize the matches listing page:

Card Columns

Number of match cards per row:

• 1 Column: Single column, detailed view
• 2 Columns: Two columns, balanced
• 3 Columns: Three columns (default)
• 4 Columns: Four columns, compact

Show Filters

Display filter controls:

• Enabled: Shows filter options (status, date, etc.)
• Disabled: Hides filters

Default Filter State

Initial state of filter panel:

• Expanded: Filters are open by default
• Collapsed: Filters are closed by default

Recommendation: Use expanded if users frequently filter matches.

How Per-Page Settings Work

Inheritance

Per-page settings work alongside global settings:

1. Global settings apply to all pages by default
2. Per-page settings override global settings for that specific page
3. If a per-page setting is not set, the global setting is used

Example

Global Settings:

• Card Columns: 3
• Show Team Count: Enabled

Tournaments Page Settings:

• Card Columns: 4 (overrides global)
• Show Team Count: Not set (uses global: Enabled)

Result:

• Tournaments page: 4 columns, team count shown
• Teams page: 3 columns (global), team count shown (global)

Best Practices

Landing Page

• Use full-width hero for maximum impact
• Show statistics to highlight activity
• Feature important matches when available
• Keep layout clean and focused

Tournaments Page

• Use 3-4 columns for good overview
• Show team count to indicate popularity
• Show dates for scheduling reference
• Balance information density with readability

Teams Page

• Use 4 columns with medium logos for best showcase
• Larger logos if teams are the main focus
• Consider logo size vs. information density

Matches Page

• Use 2-3 columns for match details
• Enable filters for active tournaments
• Expand filters if users frequently filter
• Consider match complexity when choosing columns

Testing Your Settings

After configuring per-page settings:

1. Visit Each Page: Check how settings look in practice
2. Test Responsiveness: Verify layouts work on different screen sizes
3. Check Content: Ensure all information displays correctly
4. User Experience: Consider if settings improve usability

Resetting Per-Page Settings

To reset a page to use global settings:

1. Clear all per-page settings for that page
2. Leave fields empty or unset
3. Save changes
4. Page will use global theme settings

Advanced Configuration

For advanced users, per-page settings are stored in the theme JSON:

{
  "pages": {
    "landing": {
      "hero_style": "full-width",
      "show_stats": true,
      "show_featured_match": true
    },
    "tournaments": {
      "card_columns": 4,
      "show_team_count": true,
      "show_duration": true,
      "show_dates": true
    },
    "teams": {
      "card_columns": 4,
      "logo_size": "medium"
    },
    "matches": {
      "card_columns": 2,
      "show_filters": true,
      "default_filter_state": "expanded"
    }
  }
}

Related Articles

• Theme Customization
• Host Branding
• Public Pages - Landing Page
• Public Pages - Tournaments Page