Eventcon is a dark website template for concerts, music events and conferences, built on Bootstrap 5. The layout is responsive and mobile-ready. There are nine pages: home, about, performers, programme, venue, blog, blog post, tickets and contact, and elements.
The demo describes one fictional concert, with the same date, venue, acts, running order and ticket prices on every page. The home page has a full-screen hero, the four performers, an about section, the running order with set times, a venue map and a row of sponsor logos. The inner pages add a performers page, a programme page, a venue page, a blog with five posts, search and categories, a post page with comments and a comment form, and a tickets and contact page where visitors request tickets or ask a question. Eventcon gives you a ready-made site for a concert, a festival night or a conference.
What’s new in 3.0
Bootstrap 5.3.8 (the earlier release used Bootstrap 4.0.0 and jQuery), compiled from Sass with only the parts the pages use and the original 1140 px grid, and plain JavaScript with no jQuery. A side-panel mobile menu replaces the old drop-down menu, PhotoSwipe 5.4.4 replaces Magnific Popup in the gallery, small built-in modules replace WOW, the sticky header, tilt and back-to-top scripts, the selects are native, and the autoplaying sponsor carousel is now a static row of logos. Icons are Lucide SVGs, and the social logos are a small Font Awesome subset (the Twitter bird is now the X logo). npm run build (Dart Sass and esbuild) compiles the minified stylesheets and scripts.
Lighter pages: the home page went from 13.8 MB and 73 requests to 817 KB and 35 requests, the blog from 4.9 MB to 583 KB and the contact page from 3.6 MB to 371 KB, and the download from 31.6 MB to 3.2 MB. The 28 MB of PNG photos became about 1.8 MB: every photo has an AVIF version with a fallback, real dimensions and lazy loading below the fold, and the unused images and scripts left over from other templates are gone.
No third-party requests: Anton, Monoton and Mulish are self-hosted, the venue map is an OpenStreetMap map that loads only when a visitor clicks “Show map”, and a Google Analytics 4 snippet stays commented out until you add your own ID. Before, every page loaded its web fonts from Google Fonts, and six pages loaded the Google Maps script.
Working ticket request and contact forms: “Buy Tickets” in the header, the about section and the footer opens the tickets form with the ticket type already selected, and that form, the blog comment form and the sidebar newsletter forms send through php/send-email.php (PHP on your host), with visible labels, a spam trap and an in-page message. The form sends a ticket request to the box office and takes no payment. Before, the Buy Tickets buttons led nowhere, the comment and newsletter forms posted nowhere, and the contact form’s mail script sent every message to an address hard-coded in the script.
Accessibility: a skip link and a main landmark on every page, one h1 per page with headings in order, a mobile menu and photo gallery that work from the keyboard, names on icon-only links, labelled form fields, visible focus rings, a 44 px back-to-top button, reduced-motion support (no entrance animations or tilt) and WCAG AA text contrast, with readable white button labels on a deeper red, a darker red for red text on the white pages, and darker body and meta text.
Fixed: the Venue link in the menu opened a “not found” page on the live preview and on any host with case-sensitive file names; every mouse move raised a script error; the elements page scrolled sideways at tablet width; the back-to-top button appeared only after 4,500 px of scrolling, so most pages never showed it; and links that pointed nowhere now lead to real pages.
Demo content for one fictional event: the date, venue, contact details, four acts with matching photos, running order and ticket prices ($49, $69 and $129) agree on every page, where the old programme listed the same act and time four times and the dates said 2020. The blog has five posts with their own photos, categories, tags, comments and share links. New stage photos for the acts, the about section and two blog posts come from Unsplash, the sponsor logos are fictional wordmarks, and commenters get initials instead of portraits.