TheLogistico

Author: Colorlib

Updated: October 2026 · v3.0.2

Credits: Images from Unsplash

TheLogistico is a shipping company website template for logistics and transportation businesses, built on Bootstrap 5. Whatever freight services you offer, from road and ocean freight to warehousing and air cargo, it gives you a ready-made site to present them online.

Instead of starting from scratch, you can begin with TheLogistico. The template takes care of the technical groundwork and comes with many practical features. It has seven pages: home, about, services, blog, blog post, contact and an elements page.

The home page has a hero with a quick-quote form, service cards, an about section with an accordion, a testimonial slider with a video, the latest news and a client logo carousel. You can also start a blog with a sidebar, and the contact page has a working contact form and a click-to-load map.

What’s new in 3.0

• Bootstrap 5.3.8 (the earlier release used a Bootstrap 5.0 beta and jQuery), compiled from Sass with only the parts the pages use, and plain JavaScript with one function per feature. Swiper 14 replaces Slick on the testimonial slider and the client logo carousel, a keyboard-operable dialog replaces SlickNav for the mobile menu, native select boxes replace Nice Select, and the elements page gallery opens in a PhotoSwipe lightbox. npm run build (Dart Sass and esbuild) compiles one minified stylesheet and one script.
• Lighter pages: the seven pages together went from 10.6 MB and 420 requests to 4.9 MB and 208 requests, and the download from 5.4 MB to 2.9 MB. Every photo has an AVIF version with the JPG or PNG as the fallback, real dimensions and lazy loading below the fold, the hero image is preloaded, and about 3 MB of unused icon font files are gone.
• No third-party requests: Roboto and Roboto Condensed are self-hosted, the Themify and Font Awesome 5 icons are replaced by Lucide SVG icons and a 2 KB social-logo subset, the contact map is OpenStreetMap with no API key, loaded only when a visitor clicks “Show map”, the play button opens a stock clip of a container port only after a click, and the analytics snippet stays commented out until you add your own ID. Before, every page loaded web fonts, an analytics script and a maps script with a sample API key from other sites.
• Working forms: the contact form sends through includes/send-email.php, with validation, a spam trap and an in-page message, without reloading the page. Before, it posted to a mail handler that never shipped. The quick-quote, newsletter and comment forms check their fields and thank the visitor, ready to connect to your own services, and the blog searches go to the blog.
• Accessibility: a skip link, one h1 per page, names on icon-only links and buttons, labelled form fields, visible keyboard focus (the old CSS removed it), card links and the Blog submenu that also open on keyboard focus, and WCAG AA text contrast, with a darker orange for orange text and black text and icons on the orange buttons and strips.
• Fixed: the mobile menu showed an unstyled grey bar under the header (the MENU button now sits in the header as designed), the back-to-top button showed before any scrolling, the elements page’s arrow buttons and the post navigation arrows drew nothing, the elements page’s select boxes showed two arrows and its “Right Aligned” text was left-aligned, the about page asked for a photo that did not exist, several links pointed to a page that does not exist, and the two “complete control” cards were both numbered 01 with the same title.
• Demo content that fits a logistics company: the four service cards describe road freight, ocean freight, warehousing and air cargo (all four were “Commercial Cleaning”), the address, phone and email are fictional, the client logo carousel uses fictional wordmarks for you to replace, and the hero photo and three news and blog photos are replaced with photos without brand markings.