Busicol is a business consulting website template built on Bootstrap 5, for advisory firms, agencies and other small businesses. The layout is responsive and works in all popular web browsers. It comes with nine pages: home, about, services, portfolio, portfolio details, blog, blog post, contact and elements.
The home page has a full-screen hero slider, service tiles, an about block with a checklist, animated statistics, a recent-works grid, a benefits band, a testimonial slider and a call to action. The inner pages add a portfolio with a project case study, a blog with search, pagination, categories and a newsletter form, a blog post with comments, a contact page with a working contact form and a map that loads on click, and an elements page with typography, buttons, tables, form fields and a gallery.
What’s new in 3.0
Bootstrap 5.3.8 (the earlier release used Bootstrap 4.0.0 and jQuery), compiled from Sass together with the theme, and plain JavaScript with no jQuery. Swiper 14 replaces Owl Carousel on the hero and testimonial sliders, PhotoSwipe replaces Magnific Popup in the gallery, a native dialog opens the quote form, and Lucide SVG icons replace the Flaticon, Themify and Font Awesome 4 icon fonts. npm run build (Dart Sass and esbuild) compiles one minified stylesheet and one script.
Lighter pages: all pages together went from 37.0 MB and 543 requests to 5.3 MB and 227 requests, and the download from 35.0 MB to 3.6 MB. Every photo has an AVIF version with the JPEG as the fallback, real dimensions and lazy loading below the hero, and the hero photos have portrait crops for phones.
No third-party requests: Poppins is self-hosted, the contact map loads only after a click and needs no API key, and the old Google Fonts and Google Maps requests are gone.
Working forms: the contact page, the quote dialog, the comment form and the newsletter forms send through php/send-email.php and php/subscribe.php, with validation, a spam trap and an in-page message. Before, 15 of the 16 forms had no action. Every field has a visible label.
Blog search and pagination work in the browser: a search box that filters posts, a result count, a no-results message and three posts per page.
Accessibility: a skip link and a main landmark on every page, one h1 per page, a real menu button and a mobile menu with keyboard focus, names on icon-only links, visible focus rings, and WCAG AA text contrast, with a darker green behind white button labels and text.
Demo content: new Unsplash photos, a text logo drawn in SVG and Poppins, and rewritten business copy with fictional names in place of the placeholder text.