DronePhotography

Author: Colorlib

Updated: October 2026 · v3.0.1

Credits: Images from Unsplash

DronePhotography is a website template for drone photography and aerial video studios, 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, projects, blog, blog post, contact and elements.

The home page has a large hero photo, an about section with an experience badge, a services carousel, a video with the “How we work” steps, a recent projects carousel, a testimonial carousel and a “Get a Quote” form, and the header sticks to the top of the screen as you scroll. The inner pages add service cards, a blog with a sidebar, a blog post with an author box, comments and a comment form, a contact page with a working contact form and a map that loads on click, and an elements page with typography, buttons, tables, progress bars, form fields and an image gallery with a lightbox. DronePhotography gives you a ready-made site to present your studio, its services and its aerial work.

What’s new in 3.0

• Bootstrap 5.3.8 (the earlier release used Bootstrap 4.1.3 and jQuery 1.12.4), compiled from Sass with only the parts the pages use and the original Bootstrap 4 proportions, and plain JavaScript with no jQuery: jQuery, Modernizr and the jQuery plugins are gone. Swiper 14 replaces Slick on the service, project and testimonial carousels (the two identical hero slides are now one static hero), PhotoSwipe 5 replaces Magnific Popup on the elements gallery, a keyboard-operable side panel replaces the SlickNav mobile menu, and the selects are the browser’s own. Owl Carousel, WOW, CounterUp, Waypoints, a date picker and other plugins that loaded with nothing to run on are removed. npm run build (Dart Sass and esbuild) compiles one minified stylesheet and one script.
• Lighter pages: the home page went from 11.6 MB and 69 requests to 781 KB and 30 requests, and the download from 24.5 MB to 2.8 MB. Every photo has an AVIF version with the JPEG or PNG as the fallback, with real dimensions and lazy loading below the first screen, the PNG photos (up to 2.7 MB each) are now JPEGs, each page preloads its hero photo, 20 unused images are removed, and the full-screen preloader is gone.
• No third-party requests: Montserrat and Oswald are self-hosted, the Flaticon, Themify and Font Awesome 5 icon fonts are replaced by Lucide SVG icons and a 1.3 KB social-logo subset (the Twitter bird is now the X logo), the contact map is OpenStreetMap (no API key needed), loaded only when a visitor clicks “Show map”, the video is a stock aerial clip that 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 web fonts from Google Fonts, and the contact page loaded the Google Maps script with an API key and showed a map error.
• Working forms: the contact form and the “Get a Quote” forms on the home, about, services and projects pages send through php/send-email.php, with validation, a spam trap and an in-page message. Before, the “Get a Quote” forms sent nothing and had two fields with the same name, and the contact script mailed every message to an outside address and put visitor input in the mail headers. The newsletter, comment and demo forms check their fields and say thank you.
• Accessibility: a skip link, a main landmark and one h1 per page, names and labels on every control, visible keyboard focus (the old CSS removed it), a Blog submenu that also opens from the keyboard, a mobile menu that closes with Esc and returns focus to its button, reduced-motion support, and WCAG AA text contrast, with dark text on the orange buttons, badges and sticky header (white was 2.6 to 3.0:1), a darker orange for orange text, darker greys, easier-to-see testimonial arrows and a darker shade over the hero photos behind white text.
• Fixed: a full-screen preloader hid every page until it had loaded, the sticky header’s slide-in animation had lost its keyframes, the home page requested a missing hero image and the blog a missing stylesheet, four pages threw a script error, the elements page scrolled sideways at tablet width, the footer and button links led nowhere (they now go to their pages), and the elements page’s arrow buttons and pin icon now show (they never drew).
• Demo content: a fictional address, phone numbers and email, drone-studio copy in place of off-topic filler in the testimonials, the blog post and the elements page, five drone headlines instead of one news headline repeated on every blog post, new project titles and fictional names, and six photos that showed brand logos on drones, a shirt, a phone and a jacket are replaced with Unsplash photos without brand markings.