Website Customisation

EnaCast allows you to customise the visual appearance of your station’s website to match your brand identity. You can change colours, enable dark mode, add custom CSS and configure the cover image.

Theme Configuration

Your website’s visual configuration is managed from the design section of the admin panel. Each station can have several saved theme configurations, although only one can be active at a time.

Primary Colour

The primary colour defines the tone of buttons, links, navigation bars and other interactive elements on the website. It is configured using a hexadecimal colour code (e.g., #247f00).

You can also define a primary colour for dark mode, which will be used when dark mode is enabled.

Tip

Choose a colour that contrasts well with the background (white in light mode, dark in dark mode) to ensure good readability.

Dark Mode

Dark mode changes the website background to dark tones and adapts texts and elements to improve reading in low-light environments.

You can enable or disable dark mode from the theme configuration. When enabled, the entire website is displayed with the dark colour scheme, including the header, player and content modules.

Cover Image

The cover image appears as the background of your website’s header. You can control how the image is positioned with the alignment options:

Horizontal position:

Option	Result
Centre	Image is centred horizontally
Left	Image is aligned to the left edge
Right	Image is aligned to the right edge
Auto	The system chooses the best position

Vertical position:

Option	Result
Centre	Image is centred vertically
Top	Image is aligned to the top edge
Bottom	Image is aligned to the bottom edge
Auto	The system chooses the best position

Note

If you do not upload a cover image in the theme configuration, the station’s general cover image will be used (configured in the station settings).

Custom CSS

For more advanced customisations, you can add custom CSS code that will be applied on top of the base theme style. This allows you to:

• Change typefaces
• Adjust margins and spacing
• Hide or modify specific elements
• Add custom styles for particular sections

Responsible use of custom CSS

Custom CSS is applied directly to the website. An error in the code can affect the display of the entire page. It is recommended to:

• Test changes in preview mode before activating them
• Make small changes and check the result as you go
• Avoid code that could compromise website security (the system automatically filters potentially dangerous code)

Custom CSS can be defined at two levels:

1. Theme level: applied only when that theme is active
2. Station level: applied always, regardless of the active theme

If CSS is defined at both levels, they are combined: theme CSS is applied first, then station CSS.

Preview

Before activating a theme, you can see how your website will look with the preview option. The preview lets you navigate the website with the new configuration without visitors seeing the changes.

1. Configure the theme with your desired colours, mode and image
2. Save the changes
3. Click the preview link
4. Browse the website to check everything looks correct
5. If you are satisfied, activate the theme to make it visible to everyone

Header and Footer Design

Your station’s website uses a header template and a footer template that determine the visual structure of these areas. These templates are managed by the EnaCast team and are selected during your station’s initial setup.

Tips

• Maintain consistency: use the same primary colour across your website, social media and print materials
• Test on mobile: always check that the website displays correctly on mobile devices after making style changes
• Less is more: a clean, simple design usually works better than one overloaded with customisations

---

If you have any questions, contact technical support at support@enacast.com