Site Settings

Configure global settings for your Comps.gg platform.

Route

/admin/settings

Overview

The Settings page allows you to configure essential site-wide settings including branding, contact information, and third-party integrations.

Tabs

The Settings page is organized into tabs:

• General - Basic site information, contact details, and legal pages
• Homepage - Featured competitions and hero layout configuration
• Appearance - PWA settings, theme colors, typography, and visual customization
• Referrals - Referral program settings
• Checkout - Minimum card payment and wallet credit settings
• RNG - Random Number Generator provider settings
• Advanced - Analytics integrations (Umami)

General Tab

Basic Information

• Site Name - Your platform's display name
• Site Tagline - Brief description or slogan
• Logo - Upload your site logo (recommended: transparent PNG, 240x60px)
• Favicon URL - Your site favicon URL

Contact Information

Configure contact details for platform communications:

• Contact Email - Displayed on website and receives admin notifications
• Support Phone - Customer support phone number

Winner Instructions

Configure custom instructions that appear in prize notification emails sent to winners:

• Claim Instructions - Custom text displayed in winner notification emails
• Use to communicate:
  • ID verification requirements
  • Wait period information (e.g., "Please allow 14 days for processing")
  • Bank details collection for cash prizes
  • Prize claim procedures

If left blank, a default message is used in notification emails.

Legal Pages

Link to your legal documentation:

• Terms & Conditions - Select a CMS page or enter an external URL
• Privacy Policy - Select a CMS page or enter an external URL

Free Entry Route

Configure alternative entry method for competitions:

• Free Entry Page - Select a CMS page or enter an external URL for postal entry instructions

Social Media

Configure social media links displayed on your site:

• Facebook URL - Your Facebook page URL
• Twitter URL - Your Twitter/X profile URL
• Instagram URL - Your Instagram profile URL

Homepage Tab

Featured Competitions

Select up to 5 competitions to feature in the homepage hero section:

• Position 1 - Displays as the large card on the left
• Positions 2-5 - Display as smaller cards on the right

Managing Featured Competitions

1. Search for competitions to add
2. Click to add them to the featured list
3. Use arrow buttons to reorder
4. Click X to remove from featured

Note: Only active competitions will be shown, even if their IDs are in the featured list.

Hero Layout

Choose the layout style for your homepage hero section:

Layout	Description
Bento Grid	Asymmetric grid with 1 large + 4 smaller cards. Modern and visually dynamic.
Carousel	Auto-rotating full-width slider. Best for focused attention and dramatic images.
Classic Grid	Equal-sized card grid (3 columns). Clean and balanced presentation.
Spotlight	Large hero + row of smaller cards. Magazine-style editorial layout.
Minimal	Full viewport dramatic single card. Luxury and high-end feel.

Appearance Tab

PWA Configuration

Configure your Progressive Web App (PWA) settings:

• PWA Icon (512x512) - App icon displayed on home screens
• Required for push notifications and app installation

Theme Customization

Customize the color scheme of your site:

• Background Color - Main page background (default: #0f172a)
• Button Color - Primary button color (default: #3b82f6)
• Card Color - Card background color (default: #1e293b)
• Accent Color - Highlights, badges, and gradients (default: #8B5CF6)

A live preview shows how your theme colors will look across the site.

Typography

Customize the font used across your site:

• Site Font - Choose from a curated selection of Google Fonts
• Preview shows how text will appear with your selected font

Visual Customization

Fine-tune the visual style of buttons, cards, and layout elements:

• Border Radius - Control the roundness of UI elements
• Card Style - Configure card appearance options

Referrals Tab

Configure the referral program that rewards users for bringing new customers.

Referral Settings

• Enable Referrals - Toggle the referral program on/off
• Qualifying Amount - Minimum purchase amount for a referral to qualify (e.g., £10.00)
• Reward Amount - Wallet credit given to referrer when referral qualifies (e.g., £5.00)
• Max Referrals Per User - Limit on how many referrals a single user can make

Fraud Warning

• Fraud Warning Message - Optional warning text displayed on referral pages
• Use to warn users about prohibited behaviors (e.g., self-referrals, fake accounts)
• Leave blank to show no warning

How Referrals Work

1. Existing users share their referral code or link
2. New users register using the referral code
3. When the new user makes a qualifying purchase, the referrer earns reward credit
4. Reward is added to referrer's wallet balance

Settings Behavior

• Settings are locked (read-only) when referral system is disabled
• Enable the system to modify settings
• Changes take effect immediately for new referrals

See Referrals Management for managing referrals and viewing statistics.

Checkout Tab

Minimum Card Payment

Protect against unprofitable small transactions:

• Minimum Card Payment Amount - Set the minimum amount for card payments (max £1,000)
• Orders fully covered by wallet credit bypass this check

Why set a minimum? Payment gateways charge a flat fee plus percentage per transaction. Very small card payments may cost more in fees than the order value itself.

Wallet Credit

Configure how wallet credit is applied during checkout:

• Auto-Apply Wallet Credit - Automatically use wallet credit at checkout when available (always enabled)

This reduces abandoned checkouts where customers realize they're not using their credit.

RNG Tab

Random Number Generator

The RNG provider determines how winning tickets are selected during competition draws.

Current Providers

Provider	Description
Comps.gg RNG	Built-in cryptographic random number generator (CSPRNG). Zero external dependencies, no API limits or costs, instant draw execution, full audit trail with seed verification.
Random.org	Third-party atmospheric noise RNG service. Industry-recognized provider with third-party verifiable draws. Requires API subscription.

Changing Providers

The RNG provider is configured at the infrastructure level and cannot be changed through the admin panel. Contact support to discuss switching providers.

Advanced Tab

Analytics Integration

Umami Analytics

Configure Umami analytics integration:

• Umami Website ID - Your Umami website identifier
• Umami Share Token - Generate a share URL in Umami and paste the token

Once configured, analytics will be available at /admin/website-analytics.

Usage

Updating Settings

1. Navigate to /admin/settings
2. Modify the desired settings
3. Click "Save Changes"
4. Changes take effect immediately

Logo and Favicon

To update branding:

1. Prepare your images (PNG or SVG recommended)
2. Click the upload button in the respective section
3. Select your image file
4. Preview the uploaded image
5. Save changes

Recommended Sizes:

• Logo: 240x60px (transparent PNG)
• Favicon: 32x32px or 64x64px

Configuring Umami Analytics

1. Create an Umami analytics account
2. Set up your website in Umami
3. Generate a share token
4. Copy the share token and website ID
5. Paste into the Advanced tab
6. Save settings
7. Access analytics at /admin/website-analytics

Cache Invalidation

When you update site settings, the frontend cache is automatically invalidated to ensure changes appear immediately for users.

How It Works

1. Settings are saved in the database
2. Backend sends cache invalidation request to frontend
3. Frontend clears its site settings cache
4. Next user request fetches fresh settings

Technical Details

• Frontend caches site settings for 5 minutes
• Cache invalidation is triggered automatically on save
• Requires CACHE_INVALIDATION_SECRET to be configured in both backend and frontend .env
• Fallback: Cache expires naturally after 5 minutes if invalidation fails

Configuration

Ensure these environment variables are set:

Backend .env:

CACHE_INVALIDATION_SECRET=your-secret-key-here

Frontend .env:

CACHE_INVALIDATION_SECRET=your-secret-key-here  # Must match backend

For more details, see Cache Invalidation Documentation.

Tips

• Keep contact emails current and monitored
• Test logo and favicon on different devices
• Verify Umami integration after configuration
• Review settings periodically for accuracy
• Changes take effect immediately due to automatic cache invalidation