Phase 1: Core Documentation
- Created docs/ folder with 8 markdown documentation files
- Getting Started, Installation, Troubleshooting, FAQ
- Configuration docs (Appearance, SPA Mode)
- Feature docs (Shop, Checkout)
- PHP registry with filter hook for addon extensibility
Phase 2: Documentation Viewer
- DocsController.php with REST API endpoints
- GET /woonoow/v1/docs - List all docs (with addon hook)
- GET /woonoow/v1/docs/{slug} - Get document content
- Admin SPA /help route with sidebar navigation
- Markdown rendering with react-markdown
- Added Help & Docs to More page for mobile access
Filter Hook: woonoow_docs_registry
Addons can register their own documentation sections.
1.8 KiB
1.8 KiB
Shop Page
The shop page displays your product catalog with browsing and filtering options.
Overview
The WooNooW shop page provides:
- Product Grid - Visual display of products
- Search - Find products by name
- Filters - Category and sorting options
- Pagination - Navigate through products
Features
Product Cards
Each product displays:
- Product image
- Product name
- Price (with sale price if applicable)
- Add to Cart button
- Wishlist button (if enabled)
Search
Type in the search box to filter products by name. Search is instant and updates the grid as you type.
Category Filter
Filter products by category using the dropdown. Shows:
- All Categories
- Individual categories with product count
Sorting
Sort products by:
- Default sorting
- Popularity
- Average rating
- Latest
- Price: Low to High
- Price: High to Low
Customization
Grid Layout
Configure the product grid in WooNooW → Appearance:
| Device | Options |
|---|---|
| Mobile | 1-2 columns |
| Tablet | 2-4 columns |
| Desktop | 2-6 columns |
Product Card Style
Product cards can display:
- Image - Product featured image
- Title - Product name
- Price - Current price and sale price
- Rating - Star rating (if reviews enabled)
- Add to Cart - Quick add button
Navigation
Clicking a Product
Clicking a product card navigates to the full product page where customers can:
- View all images
- Select variations
- Read description
- Add to cart
Back to Shop
From any product page, use the breadcrumb or browser back button to return to the shop.
Performance
Lazy Loading
Product images load as they come into view, improving initial page load time.
Infinite Scroll vs Pagination
Currently uses pagination. Infinite scroll may be added in future versions.