TwoHearts

Author: Colorlib

Updated: October 2026 · v3.0.0

Credits: Images from Unsplash

TwoHearts is a one-page wedding website template for couples. The layout is responsive and works in all modern browsers. It has one home page with a full-screen hero, a countdown to the wedding day, a bride and groom section, a love story timeline, a greetings slider, a bridal party slider, a venue block with a map, an RSVP form and a photo gallery with a lightbox.

The menu scrolls to each section and highlights the one you are reading, and the header turns into a compact bar when you scroll. Change the names, dates, photos and venue in the HTML and you have a wedding site ready to publish.

What’s new in 3.0

• Bootstrap 5.3.8 (the earlier release used Bootstrap 4.5.0 and jQuery), compiled from Sass, and plain JavaScript with no jQuery. Swiper 14 replaces Owl Carousel in both sliders, PhotoSwipe replaces Magnific Popup in the gallery, Jarallax replaces Stellar on the hero, and small built-in modules handle the reveals, the countdown and smooth scrolling. npm run build (Dart Sass and esbuild) compiles one minified stylesheet and one script.
• Lighter page: the home page went from 6.4 MB and 69 requests to 1.8 MB and 56 requests. Every photo has an AVIF version with the JPEG as the fallback, and the hero background is cut to 1920 px.
• No third-party requests: Source Sans and Rochester are self-hosted, the Flaticon font is replaced by Lucide SVG icons with a small social-logo subset, and the map loads from OpenStreetMap only after a click. A Google Analytics 4 snippet stays commented out until you add your own ID. Before, the page loaded Google Fonts, Google Maps and a stylesheet from a CDN.
• Working RSVP form: it sends through php/send-email.php, with named fields, validation, a spam trap and an in-page message. Before, the form had no action and four fields without names.
• Accessibility: a skip link and a main landmark, one h1, a keyboard-operable menu and gallery, names on icon-only links, visible focus rings, reduced-motion support and WCAG AA text contrast, with a deeper rose pink for buttons, the countdown and the footer.
• Fixed: the Home menu link pointed at a section that did not exist, the countdown ran to a date in 2021 (it now reads a data-countdown date), the page scrolled sideways on tablets, and the footer links went nowhere.
• Demo content: fictional names, venue and contact details, and every photo replaced with a credited Unsplash photo.