Quote & Booking-Ready Website -Full Case Breakdown
Overview
Golden Rose Nail Studio was conceived as a prototype for a beauty business that needed a modern and easy-to-manage web presence — without the complexity of a full e-commerce platform.
The goal was to let customers explore treatments and beauty products, request personalized quotes, and optionally book appointments, all through a clean, mobile-first interface.
Objectives
Create a smooth, user-friendly experience for browsing nail and spa treatments.
Build a quote request workflow to replace an overcomplicated shop checkout.
Integrate a booking system (Amelia) for treatment scheduling.
Keep everything lightweight, fast, and easy to manage by the owner.
Approach
The project was built on GeneratePress for its clean structure, performance, and full design control.
Custom post types for “Treatments” and “Products” were created using ACF (Advanced Custom Fields) — allowing the site owner to easily manage and update offerings from the WordPress dashboard without touching code.
Each treatment was represented with visuals, a short description, and dynamic fields for price, duration, and booking options.
For product browsing, a custom quote-building flow was developed — allowing visitors to select items and quantities, view a live summary, and submit a personalized request.
The Quote Flow
Instead of forcing users into a checkout, the site guides them through a calm, app-like interface:
Visitors add desired products to a “Quote List”.
The system dynamically builds a preview of selected items, quantities, and totals — all stored in the browser session.
The visitor fills in a short form with their name and email, then sends the quote request.
On submission, a draft “Quote” post is automatically created in WordPress, with all product details, prices, and customer info stored as metadata.
A well-formatted HTML email is sent both to the salon and to the client for confirmation.
No external plugin was required — the logic was built in native PHP and JavaScript, fully integrated with Contact Form 7.
Booking Integration
An Amelia booking module was embedded using a shortcode for treatment reservations.
This allowed clients to book appointments directly from the “Treatments” page with real-time calendar availability.
Design
Typography and colors were inspired by premium nail spa branding, using Aztec Gold tones with generous spacing for a feeling of calm and trust.
Each UI component — quote cards, totals, form inputs — was styled for visual consistency, including the embedded booking interface.
Technical Highlights
Theme: GeneratePress (custom child theme)
Content structure: ACF custom post types for Treatments & Products
Forms: Contact Form 7 with PHP & JS logic for dynamic quote generation
Front-end: Vanilla JS, sessionStorage for live product updates
Email: Automatically generated HTML email templates with totals and images
Performance: <1s load time on standard hosting, no external frameworks
Challenges & Solutions
| Challenge | Solution |
|---|---|
| Integrating dynamic quote logic inside CF7 without third-party plugins | Built a custom CF7 form tag and handler in PHP, with dynamic front-end rendering |
| Managing client-side totals and quantities | Used sessionStorage to persist user selections across page reloads |
| Maintaining simplicity for the site owner | Leveraged ACF fields for all product/treatment management |
Tags
GeneratePress · WordPress Custom Development · ACF · Contact Form 7 · Custom Quote Flow · UX Design · PHP & JS Integration
Live Demo & Technical Notes
Live working website → https://goldenrosenails.com
**This project was created as a realistic concept to demonstrate a practical website solution for small beauty businesses.