Webuilder

Author: Colorlib

Updated: October 2026 · v3.0.0

Credits: Images from Unsplash

WeBuilder is a website template for construction companies, builders and general contractors, built on Bootstrap 5. The layout is responsive and mobile-ready. It comes with nine pages: two home pages (one with a classic header, one with a transparent header over the hero), four project list layouts (full width, three-column grid, two-column grid and three columns), a single project page, a single service page and a blog post.

The home page has a full-width hero slider, a get-a-quote bar, an about section, services, projects with category filters, a “work with us” banner, the team, animated counters, client testimonials, the latest news, a client logo strip and a contact section with the office address and a map that loads on click. The project and service pages add a photo gallery with thumbnails, the service page a video that opens in a dialog and skill bars, and the blog post a working comment form. WeBuilder gives you a ready-made site to present a construction company’s services and finished projects.

Please note, that this template requires a basic knowledge of HTML. If you need a beginner-friendly solution, we recommend using a drag-and-drop website builder for a construction company.

What’s new in 3.0

• Bootstrap 5.3.8, two major versions on from the Bootstrap 3.3.7 and jQuery 2.2.4 of the earlier release, compiled from Sass together with the theme and the Bootstrap 3 proportions the design was drawn with, and plain JavaScript with no jQuery. One lightweight slider, Swiper 14, replaces the commercial hero slider plugin, Owl Carousel and FlexSlider; small built-in modules replace Isotope, CounterUp with Waypoints and Magnific Popup for the project filters, the counters and the video dialog; and bootstrap-select, animate.css and WOW, which loaded on every page but were never used, are gone. Lucide SVG icons replace Font Awesome 4, Material Design Icons, Glyphicons and the PNG service and contact icons, and a small subset of Font Awesome 7 Brands draws the social logos, with the X logo in place of the old bird. npm run build (Dart Sass and esbuild) compiles one minified stylesheet and one script.
• Lighter pages: the home page went from 5.7 MB and 111 requests to 980 KB and 42 requests, and the second home page from 5.7 MB and 79 requests to 930 KB and 43. Every photo has an AVIF version with the original as the fallback, real dimensions and lazy loading below the first screen, a 1.6 MB hero photo is now a 148 KB JPEG, and each page loads only the scripts it uses (Swiper only on the four pages with sliders). The download went from 15.1 MB to 10.7 MB.
• No third-party requests: Montserrat, Open Sans and PT Sans are self-hosted, the icons are local SVGs, the home page map is an OpenStreetMap map that loads only when a visitor clicks it, the service page video loads from YouTube’s privacy-enhanced player only after a click, and a Google Analytics 4 snippet stays commented out until you add your own ID. Before, every page loaded its fonts from Google Fonts and the Google Maps script, although only the home page had a map.
• Working forms: the blog comment form sends through php/send-email.php and the newsletter form on the second home page through php/subscribe.php, each with a spam trap and an in-page message. Before, the comment form posted to a script that was not included, and the newsletter field had no form at all.
• Accessibility: a skip link, a main landmark and one h1 per page, labelled buttons, links and form fields, dropdown menus, team cards and project overlays that open on keyboard focus, visible focus rings (the old theme removed them) and WCAG AA text contrast, with all text at 5.2:1 or better: a darker yellow for yellow text on light backgrounds, dark text on the yellow date badges, team names and buttons (yellow text and white on yellow were 1.5:1), darker greys and darker overlays on the hero, banner and quote photos.
• Fixed: the hero captions show at once with each slide (they used to animate in late, so the hero first appeared without text), and the project and service galleries show a different photo for each thumbnail (before, ten thumbnails all opened the same photo). The About, Contact and “Get a quote” links, which pointed nowhere, now go to the about and contact sections of the home page, and the logo, service, project and news links, breadcrumbs, tags and footer links open real pages. The header cart icon, which had no shop behind it, is gone, and every page has its own title and description.
• New demo content: copy for a construction company in place of lorem ipsum and off-topic text, fictional team members, clients, testimonials and contact details, fictional wordmarks in the client strip in place of stock badge logos, and corrected typos. Photos that showed brand markings are replaced with Unsplash photos.