Meal2

Author: Colorlib

Updated: October 2026 · v3.0.0

Credits: Images from Unsplash

Meal2 is a restaurant HTML website template built on Bootstrap 5. It has eight pages: home, menu, about, events, gallery, book a table, contact and an elements page. The home page opens with a full-screen photo hero and a call to action, followed by a tabbed menu with prices, popular desserts, testimonials, a photo gallery preview, an event slider and a booking call to action.

The menu page repeats the tabbed menu with the desserts, the about page shows why guests return and the kitchen team, and the events page presents private dining and guest chef nights. The gallery opens each of its twelve photos in a lightbox, and the booking and contact pages have working forms with opening hours and contact details. The layout is responsive, and colours, fonts and photos can be changed from the Sass source.

What’s new in 3.0

• Bootstrap 5.3.8 (the earlier release used Bootstrap 4.5.2 and jQuery), compiled from Sass together with the theme and the Bootstrap 4 proportions the design was drawn with, and plain JavaScript with no jQuery. Swiper 14 replaces Owl Carousel, PhotoSwipe replaces Fancybox, a native date field replaces the datepicker plugin, and unused plugins such as Waypoints and animateNumber are gone. npm run build (Dart Sass and esbuild) compiles the minified stylesheets and one script.
• Lighter pages: the home page went from 2.9 MB and 50 requests to 1.4 MB and 49 requests, and the contact page from 1.3 MB and 24 requests to 0.5 MB and 18 requests. Every photo has an AVIF version with the JPEG as the fallback, real dimensions and lazy loading below the first screen, and the full-page preloader is gone.
• No third-party requests: Nunito and Playfair Display are self-hosted instead of loaded from Google Fonts, the icomoon and Flaticon icon fonts are replaced by Lucide SVG icons and a small social-logo subset, and the pages load nothing from other hosts.
• Working forms: the booking, contact and elements forms send through php/send-email.php, with visible labels, validation, a spam trap and an in-page message. Before, the forms had no action and some fields had no names, so nothing could be sent.
• Accessibility: a skip link and a main landmark on every page, one h1 per page, a real menu button with a keyboard-friendly menu dialog, submenus that also open from the keyboard, names on icon links, alt text on every photo, visible focus rings and WCAG AA text contrast, with a darker orange for prices, links and headings on the cream sections.
• Fixed: every thumbnail on the gallery page opened the same photo (each of the twelve now opens its own), the menu had placeholder dropdown items and the footer carried link columns from another theme.
• Demo content: restaurant copy and fictional contact details replace the placeholder text, and the menu dishes, prices and tabs match the new Unsplash photos, which are credited in the README.