Avava Station - HTML Radio Template

Avava Station HTML Radio Website Template

Avava Station is a modern HTML radio website template for internet radio stations, online FM stations, music channels, podcast networks and DJ collectives. It comes in dark and light versions and has a real radio player built in: a round live player and a full FM tuner card. Visitors move from page to page without a reload, so the music never stops.

Most radio templates show a picture of a player. Avava Station ships a working one. Press play and the stream starts; open the schedule, the archive or the contact page and it keeps playing. That uninterrupted listening is what separates a real radio website from a brochure, and it is built into every page of this template.

Seamless Page Transitions: The Music Never Stops

A built-in page transition engine loads the next page in the background and swaps the content, so the audio is never interrupted. The address bar, the back button and bookmarks work as usual, and the chosen theme follows the visitor across the site. If a browser can't do this, the site falls back to normal page loads, so nothing breaks.

Two Radio Players: A Live Player and an FM Tuner

• Round live player. Plays your main station from the header of every page. It shows what is on now and what comes next, and has volume control and a connecting indicator.
• FM tuner card. A frequency dial from 88 to 108 with a draggable needle and band scanning with a real tuning sound. It also has an eight-band equaliser, VU meters and station artwork.
• One sound at a time. Starting one player stops the other, so two streams never overlap.
• Any stream. Works with Icecast, Shoutcast, MP3 and AAC streams. You set your stream address in one simple JSON file.
• Live "now playing". A small optional PHP script reads the current artist and title from your stream. No API keys or third-party services are needed.

A Dynamic Website Driven by Data

Avava Station is more than static pages. The schedule, archive, podcasts, channels and players read their content from simple JSON data files, so the site behaves like a live station:

• "On air now" highlights and countdowns to the next show;
• a live week grid you can filter by genre and live shows;
• search and filters in the streaming archive;
• podcast queues, saved episodes and "continue where you left off";
• programme reminders, plus calendar files (.ics) visitors can add to Google Calendar, Apple Calendar or Outlook.

Every ▶ button on the site really plays: podcast episodes, archive recordings, DJ mixes and show recordings.

16 Ready-Made HTML Pages

1. Home. The hero with the live player, the FM tuner, channels, the schedule, the host wall, tonight's track list, the podcast archive and a song request desk.
2. About. The station story, the studio, the team, partners and a "work with us" application form.
3. Stations. Six channels with a daily grid, a channel panel and stream formats.
4. Streaming archive. Search, the latest recording with its player, a year map, all recordings and downloads.
5. Podcasts. A series rack, a filterable catalogue, the episode player, chapters, transcripts, guests and feeds.
6. Shows. The week grid, on air now, the programme shelves and a "become a host" form.
7. DJs. Resident DJs, the live booth, mixes, guest DJs, a genre cloud and a "send a mix" form.
8. Schedule. A programme finder, the week on air, today hour by hour, specials, schedule changes and subscriptions.
9. Donate. Where the money goes, an interactive amount selector, supporter perks and other ways to help.
10. Blog. A journal with categories, an archive and sidebars.
11. Blog post. An article page with a timeline, statistics and comments.
12. Contact. Contact options, an interactive map, a contact form and an on-air request form.
13. Privacy policy. Includes a working data-request form.
14. Terms and conditions.
15. Map page. Shown inside the contact page.
16. Blank starter page. Use it to build your own pages quickly.

Dark and Light Versions

The template opens in an elegant dark theme made for night listening. One click switches it to a clean light version. Every colour is a CSS variable, so rebranding means changing a few values, and a single warm accent colour ties the design together.

Fully Responsive and Mobile-Friendly

Avava Station adapts to every screen, from large 2560px desktops to tablets and small 320px phones, with no sideways scrolling and readable text everywhere. The players, week grids and archive stay easy to use on touch screens.

Clean, Valid, Fast Code

• Semantic HTML5, CSS3 and plain JavaScript, with no jQuery and no Bootstrap. The only library is Leaflet for the map, included locally.
• 0 errors in the W3C HTML validator and the W3C CSS validator.
• No errors in the browser console.
• Well-commented CSS and JavaScript with a table of contents.
• Accessible markup: labelled buttons, keyboard-friendly menus, visible focus, and respect for the reduced-motion setting.
• SEO-friendly structure with a title and meta description on every page.
• Fast loading with WebP images and no heavy frameworks.

Easy to Customise

You don't need to be a developer. Change texts directly in HTML, set your stream in a JSON file and swap images by keeping the same file names. The detailed documentation walks you step by step through installation, the menu, colours, fonts, images, connecting your stream, forms, the map and adding your own scripts.

Who Is It For?

Avava Station suits internet radio stations, FM and community radio, music streaming projects, podcast studios, DJ collectives, night-time music channels, event radios and music blogs.

What You Get

• 16 HTML pages in dark and light versions;
• a working live radio player and FM tuner;
• seamless page transitions with non-stop music;
• a dynamic schedule, archive and podcast system;
• demo audio and an optional PHP "now playing" script;
• detailed documentation and free updates.

Avava Station: an HTML radio website template where the music never stops.