Handyman

Author: Colorlib

Updated: October 2026 · v3.0.0

Credits: Images from Unsplash

Handyman is a website template for handymen, renovation teams and small construction businesses, built on Bootstrap 5. The layout is responsive and mobile-ready. There are seven pages: home, about, services, projects, blog, a single blog post and contact.

The home page opens with a full-screen hero photo, followed by a quotation form, six service cards, tabbed Technology, Quality and Staff panels, testimonials, a project grid and the latest blog posts. The about page has the company story, a team section, a short history and testimonials, and the services page lists the six services. The projects page has project cards with duration, location, area, crew and year, and a five-step “How it works”. You will also find a blog grid with pagination, a blog post with comments, a comment form and a sidebar, and a contact page with a working contact form and contact details. Handyman gives you a ready-made site to present your services, your team and your finished work.

What’s new in 3.0

• Bootstrap 5.3.8 (the earlier release used Bootstrap 4.3.1 and jQuery), compiled from Sass with the template’s colours and the Bootstrap 4 proportions the design was drawn with, and plain JavaScript with no jQuery. The mobile menu is a side panel, and the home page tabs run on Bootstrap’s own script. Owl Carousel, Fancybox, AOS, Waypoints, a date picker and other plugins that loaded on every page with nothing to run on are gone. npm run build (Dart Sass and esbuild) compiles one minified stylesheet and one script.
• Lighter pages: the home page went from 2.5 MB and 40 requests to 527 KB and 13 requests, the contact page from 1.4 MB and 26 requests to 393 KB and 7 requests, and the blog post from 1.4 MB and 30 requests to 429 KB and 12 requests, and the download from 3.5 MB to 2.3 MB. Every photo has an AVIF version with the JPEG as the fallback, real dimensions and lazy loading below the first screen, and each page preloads its hero photo.
• No third-party requests: Work Sans is self-hosted, and the IcoMoon and Flaticon icon fonts and the coloured service illustrations are replaced by Lucide SVG icons, so the six services now have orange line icons. A Google Analytics 4 snippet stays commented out until you add your own ID. Before, every page loaded its web fonts from Google Fonts.
• Working forms: the quotation form on the home page, the contact form and the blog comment form send through php/send-email.php, with validation, a spam trap and an in-page message. Before, they had no field names, so nothing could be sent.
• Accessibility: a skip link and a main landmark on every page, headings in order with no skipped levels, a real menu button, a mobile menu that moves focus to its first link, keeps keyboard focus inside, closes with Esc and returns focus to the button, desktop submenus that open from the keyboard, project overlays that also show on keyboard focus, descriptive alt text, underlined links in post details and footer text, and WCAG AA text contrast, with dark text on the orange buttons, a darker orange for orange text, darker greys and a darker shade at the top of the hero photos behind the menu.
• Fixed: the menu’s Projects link went to a page that did not exist, while a page from an unrelated demo shipped in its place (the new projects page replaces it), the blog post page had another template’s logo, menu and font (it now has the Handyman header and footer), the “How it works” band scrolled sideways on phones, the blog sidebar’s search icon was blank, and the contact form’s second field was labelled “First name” twice.
• Demo content: fictional team names, testimonials and contact details, service descriptions, and new blog titles and categories.