Directing

Author: Colorlib

Updated: October 2026 · v3.0.1

Credits: Images from Unsplash

Directing is a directory and listing website template, built on Bootstrap 5. It suits a local guide to restaurants, shops, hotels, beauty salons, events and rentals, or a niche directory of your own. The layout is responsive and mobile-ready. There are seven pages: home, listing, listing details, about, blog, blog details and contact.

The home page opens with a search by keyword, category and location, followed by popular categories, the most-searched listings in six category tabs, how it works, featured locations, a testimonials slider and the latest blog posts. The listing page pairs a filter sidebar (category, location, radius, price and tags) with listing cards and a map, and the listing details page has a photo gallery, amenities, rating bars, reviews, a review form, a contact card and opening hours. You will also find an about page with a video and team, a blog with video posts, a blog post with comments, and a contact page with a working contact form and a map that loads on click.

What’s new in 3.0

• Bootstrap 5.3.8 (the earlier release used Bootstrap 4.4.1 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 on the testimonial and gallery sliders, a video dialog replaces Magnific Popup, native selects and range inputs replace Nice Select and the jQuery UI sliders, and a small mobile menu replaces SlickNav. npm run build (Dart Sass and esbuild) compiles one minified stylesheet and one script.
• Lighter pages: all eight pages together went from 17.0 MB and 415 requests to 3.5 MB and 160 requests, and the home page from 3.8 MB and 70 requests to 1.1 MB and 47 requests. Every photo has an AVIF version with the original as the fallback, real dimensions and lazy loading below the first screen, and the full-page preloader is gone.
• No third-party requests: the icon fonts are replaced by Lucide SVG icons and a small social-logo subset, the unused web font link is gone, and the contact, listing and listing details maps are OpenStreetMap maps that load only when a visitor asks for them.
• Working forms: the contact, newsletter, blog comment and listing review forms post to small PHP scripts with validation, sending and success messages and a spam trap, and the home, listing and blog searches show the matching listings or posts.
• Accessibility: a skip link, one main heading per page, labelled form fields and icon links, a keyboard-friendly menu, submenu and gallery, a visible focus ring, and text contrast raised to WCAG AA with a deeper red for text and buttons.
• Sharper photos and fixes: the hero, listing and testimonial backgrounds have enough resolution for phones and large screens, the header logo now loads on case-sensitive web servers, the amenity icons match their labels, and the demo content uses fictional addresses, phone numbers and names.