The Challenge
Tourism websites often suffer from "Plugin Bloat"—they rely on heavy page builders (like Elementor) that slow down the site and look generic. For Discover La Maddalena, the goal was different: create a premium, "Dark Mode" aesthetic that feels like a native app, while keeping the backend incredibly easy for the client to manage without touching a line of code.
The Stack
- Core: Custom WordPress Theme
- Frontend: Tailwind CSS (Utility-first)
- JS: Vanilla JavaScript (No jQuery)
- Performance: Preloaded Critical Assets (LCP)
- Localization: Custom "Glass" Dropdown
The "Glass" Aesthetic
I moved away from standard flat design, implementing a modern Glassmorphism UI. Using Tailwind CSS, I created translucent cards with background blurs (backdrop-blur-md) that float over high-resolution imagery. This creates depth and luxury, allowing the turquoise waters of Sardinia to remain visible even behind text content.
100% Native Customization
Instead of using a page builder, I architected a fully native WordPress Customizer experience.
Zero Code Management
The client can edit every single text string, price, image, and toggle features (like the "Daily Schedule" or "Payment Icons") directly from the WordPress dashboard.
Dynamic Layouts
The "Price List" and "Single Tour" pages are generated programmatically based on the data entered, ensuring the design never breaks, no matter what content is added.
Conversion-First Engineering
WhatsApp Logic
The "Book Now" buttons don't just open WhatsApp; they dynamically generate a pre-filled message based on the specific tour the user is viewing (e.g., "Hello, I am interested in the Sunset Tour...").
Mobile Art Direction
The Hero section detects the user's device and swaps the background asset—serving a wide panoramic shot for desktops and a dedicated vertical portrait for phones, ensuring the subject is never cropped out.
Technical Highlights
Performance
Critical assets (Hero images/video) are preloaded via the <head> to minimize Largest Contentful Paint (LCP).
Custom Localization
I bypassed the standard ugly Google Translate widget, building a custom "Glass" dropdown that programmatically forces Google cookies.
Stack
WordPress (PHP), Tailwind CSS (CDN), Vanilla JavaScript. Zero heavy framework dependencies.