Home E-commerce Order Tracking Page

Order Tracking Page

Shipment tracking with timeline and details

Tracking Orders Status

Copy this prompt and paste it into ChatGPT or Claude

Create an order tracking page:

1. TRACKING LOOKUP (public page)
For non-logged-in users:
- Order number input
- Email address input
- "Track Order" button

2. TRACKING RESULTS
Order Header:
- Order number
- Order date
- Estimated delivery date
- Carrier name and tracking number

3. TRACKING TIMELINE (vertical)
Status steps:
- Order Placed (date, time) ✓
- Order Confirmed ✓
- Shipped ✓
- In Transit (current)
- Out for Delivery
- Delivered

Each step shows:
- Status name
- Date and time
- Location (if applicable)
- Completed checkmark or pending dot

Current status highlighted:
- Larger icon
- Description of current state
- "Your package is on its way!"

4. DETAILED TRACKING HISTORY
Expandable section:
- Full tracking events list
- Date, time, location, status
- Latest events at top

5. DELIVERY INFORMATION
- Delivery address
- Delivery instructions
- Carrier contact

Actions:
- "Update Delivery Preferences"
- "Leave with neighbor" option
- "Hold at location" option

6. ORDER CONTENTS
Mini order summary:
- Item thumbnails
- Item names
- Quantities

7. MAP TRACKING (optional)
- Map showing package location
- Route visualization
- Estimated delivery window

8. NOTIFICATIONS
- "Get SMS updates" toggle
- "Email notifications" toggle
- Push notification opt-in

9. HELP SECTION
- "Package not arrived?"
- "Wrong item delivered?"
- "Contact Support" button
- FAQ links

10. MULTIPLE SHIPMENTS
If order split:
- Shipment 1 of 2
- Toggle between shipments
- Each with own tracking

Design: Clear timeline, prominent status. Mobile-friendly. Real-time updates if possible.

How to use this prompt

1 Click the "Copy Prompt" button above to copy the full prompt to your clipboard
2 Open ChatGPT, Claude, or your preferred AI assistant
3 Paste the prompt and customize any placeholder text (like product names or brand colors)
4 Let the AI generate your website code or design specifications

Back to E-commerce Prompts Browse All Categories

More E-commerce Prompts

Product Listing Page

E-commerce category page with filters and product grid

Catalog Filters

Product Detail Page

Complete product page with gallery, options, and reviews

PDP Product

Shopping Cart Page

Cart page with product list and order summary

Cart Checkout

About this E-commerce Prompt

This Order Tracking Page prompt is designed to help you quickly create professional e-commerce websites using AI tools like ChatGPT, Claude, v0 by Vercel, Cursor, and Bolt.new.

Whether you're a developer, designer, or entrepreneur, this free AI prompt gives you a head start on building order tracking page. Simply copy the prompt, paste it into your favorite AI coding assistant, and customize it to match your brand.

Compatible AI Tools

ChatGPT (GPT-4) - Great for detailed code generation and explanations
Claude 3 - Excellent for complex, nuanced website designs
v0 by Vercel - Perfect for React and Next.js components
Cursor - Ideal for AI-powered coding in your IDE
Bolt.new - Quick prototyping and full-stack apps
Lovable - User-friendly AI website builder