Consul

Author: Colorlib

Updated: October 2026 · v3.0.0

Credits: Images from Unsplash

Consul is a website template for consulting firms and advisory practices, built on Bootstrap 5. The layout is responsive and mobile-ready and works in all popular web browsers. It comes with eight pages: home, about, services, cases, blog, blog details, contact and an elements page with every component.

The home page has a hero with a bold headline, a “who we are” section, a services band with three cards, a “why choose us” list, a “Top Stories” slider of client cases, a testimonial and the latest blog posts. The inner pages add a case-study grid, a blog with a sidebar, a post page with comments, and a contact page with a working form and a click-to-load map. Consul gives you a ready-made site to present your firm, its services and its results.

What’s new in 3.0

• Bootstrap 5.3.8 (the earlier release used Bootstrap 5.0 beta 1 and jQuery 1.12.4), compiled from Sass with only the parts the pages use, and plain JavaScript with no jQuery. Swiper 14 replaces Slick on the Top Stories slider, PhotoSwipe replaces Magnific Popup in the gallery, a keyboard-operable dialog replaces the SlickNav mobile menu, and native selects replace Nice Select. npm run build (Dart Sass and esbuild) compiles one minified stylesheet and one script.
• Lighter pages: all pages together went from 12.8 MB and 445 requests to 4.8 MB and 229 requests, and the download from 4.3 MB to 3.4 MB. Every photo has an AVIF version with the JPEG as the fallback, cut to the size it is shown, with real dimensions and lazy loading below the fold.
• No third-party requests: Hind and Shippori Mincho are self-hosted, the Font Awesome and Themify icon fonts are replaced by Lucide SVG icons and an 8-logo social subset (the Twitter bird is now the X logo), the contact map loads from OpenStreetMap only after a click, and a Google Analytics 4 snippet stays commented out until you add your own ID. Before, every page loaded Google Fonts and the Google Maps script.
• Working forms: the contact form, the blog comment form and the newsletter send through small PHP handlers (php/send-email.php and php/subscribe.php) with validation, a spam trap and an in-page message. Before, the newsletter posted to a third-party list and the other forms depended on jQuery plugins.
• Accessibility: a skip link and a main landmark on every page, one h1 per page, a real menu button, a mobile menu that keeps keyboard focus inside and closes with Esc, submenus that open from the keyboard, names on icon-only links, descriptive alt text, visible focus rings and WCAG AA text contrast, with dark text on the yellow buttons and darker greys for meta text.
• Fixed: white-on-yellow and yellow-on-white buttons on the blog and elements pages, duplicate ids and markup typos on the elements page, and sample copy that did not belong in a consulting demo.
• Demo content: fictional names, address, phone and email, new Unsplash photos on every page, and the outdated documentation folder replaced by a Doc page built from the README.