diff --git a/components/docs-menu.tsx b/components/docs-menu.tsx index 4df580c..f333966 100644 --- a/components/docs-menu.tsx +++ b/components/docs-menu.tsx @@ -10,53 +10,27 @@ interface DocsMenuProps { className?: string; } -// Get the current context from the path -function getCurrentContext(path: string): string | undefined { - if (!path.startsWith('/docs')) return undefined; - - // Extract the first segment after /docs/ - const match = path.match(/^\/docs\/([^\/]+)/); - return match ? match[1] : undefined; -} - -// Get the route that matches the current context -function getContextRoute(contextPath: string): EachRoute | undefined { - return ROUTES.find(route => { - const normalizedHref = route.href.replace(/^\/+|\/+$/g, ''); - return normalizedHref === contextPath; - }); -} - export default function DocsMenu({ isSheet = false, className = "" }: DocsMenuProps) { const pathname = usePathname(); - // Skip rendering if not on a docs page if (!pathname.startsWith("/docs")) return null; - // Get the current context - const currentContext = getCurrentContext(pathname); - - // Get the route for the current context - const contextRoute = currentContext ? getContextRoute(currentContext) : undefined; - - // If no context route is found, don't render anything - if (!contextRoute) return null; - return ( ); diff --git a/components/sublink.tsx b/components/sublink.tsx index ffb9195..6d0fb1c 100644 --- a/components/sublink.tsx +++ b/components/sublink.tsx @@ -27,7 +27,7 @@ export default function SubLink({ parentHref = "", }: SubLinkProps) { const path = usePathname(); - const [isOpen, setIsOpen] = useState(level === 0); + const [isOpen, setIsOpen] = useState(false); // Full path including parent's href const fullHref = `${parentHref}${href}`; @@ -86,7 +86,11 @@ export default function SubLink({
@@ -104,13 +108,13 @@ export default function SubLink({
0 && "pl-4 border-l border-border ml-1.5" )} > diff --git a/contents/docs/api-reference/delete/index.mdx b/contents/docs/api-reference/delete/index.mdx deleted file mode 100644 index 9dcf641..0000000 --- a/contents/docs/api-reference/delete/index.mdx +++ /dev/null @@ -1,63 +0,0 @@ ---- -title : Delete -description : example api DELETE -date : 10-12-2024 ---- - -## Heading 2 - -this is regular text written in markdown format with `inline code`, **bold**, and *italic* - -### Heading 3 - -example of ordered list format : - -- list one - - sub list -- list two -- list three - -#### Heading 4 - -Below is an example of how to write a code block : - -````plaintext -```javascript:main.js showLineNumbers {3-4} -function isRocketAboutToCrash() { - // Check if the rocket is stable - if (!isStable()) { - NoCrash(); // Prevent the crash - } -} -``` -```` - -example note : -```plaintext - - This is a general note to convey information to the user. - -``` - -displaying an image in markdown format : - -```plaintext -![Alt text for the image](/images/example-img.png) -``` - -render as : -![Alt text for the image](/images/example-img.png) - -For a complete guide on using markdown content in DocuBook, please refer to the [Components](https://docubook.pro/docs/components) page. - - - every page that is indexed in a folder will have an `index.mdx` file with metadata : - ```plaintext ---- -title : Introduction -description : overview or synopsis of a project -date : 10-12-2024 -image : example-img.png ---- - ``` - \ No newline at end of file diff --git a/contents/docs/api-reference/fetch/index.mdx b/contents/docs/api-reference/fetch/index.mdx deleted file mode 100644 index 1f8a06c..0000000 --- a/contents/docs/api-reference/fetch/index.mdx +++ /dev/null @@ -1,63 +0,0 @@ ---- -title : Fetch -description : example api FETCH -date : 10-12-2024 ---- - -## Heading 2 - -this is regular text written in markdown format with `inline code`, **bold**, and *italic* - -### Heading 3 - -example of ordered list format : - -- list one - - sub list -- list two -- list three - -#### Heading 4 - -Below is an example of how to write a code block : - -````plaintext -```javascript:main.js showLineNumbers {3-4} -function isRocketAboutToCrash() { - // Check if the rocket is stable - if (!isStable()) { - NoCrash(); // Prevent the crash - } -} -``` -```` - -example note : -```plaintext - - This is a general note to convey information to the user. - -``` - -displaying an image in markdown format : - -```plaintext -![Alt text for the image](/images/example-img.png) -``` - -render as : -![Alt text for the image](/images/example-img.png) - -For a complete guide on using markdown content in DocuBook, please refer to the [Components](https://docubook.pro/docs/components) page. - - - every page that is indexed in a folder will have an `index.mdx` file with metadata : - ```plaintext ---- -title : Introduction -description : overview or synopsis of a project -date : 10-12-2024 -image : example-img.png ---- - ``` - \ No newline at end of file diff --git a/contents/docs/api-reference/get/index.mdx b/contents/docs/api-reference/get/index.mdx deleted file mode 100644 index a6b2dbe..0000000 --- a/contents/docs/api-reference/get/index.mdx +++ /dev/null @@ -1,63 +0,0 @@ ---- -title : Get -description : example api GET -date : 10-12-2024 ---- - -## Heading 2 - -this is regular text written in markdown format with `inline code`, **bold**, and *italic* - -### Heading 3 - -example of ordered list format : - -- list one - - sub list -- list two -- list three - -#### Heading 4 - -Below is an example of how to write a code block : - -````plaintext -```javascript:main.js showLineNumbers {3-4} -function isRocketAboutToCrash() { - // Check if the rocket is stable - if (!isStable()) { - NoCrash(); // Prevent the crash - } -} -``` -```` - -example note : -```plaintext - - This is a general note to convey information to the user. - -``` - -displaying an image in markdown format : - -```plaintext -![Alt text for the image](/images/example-img.png) -``` - -render as : -![Alt text for the image](/images/example-img.png) - -For a complete guide on using markdown content in DocuBook, please refer to the [Components](https://docubook.pro/docs/components) page. - - - every page that is indexed in a folder will have an `index.mdx` file with metadata : - ```plaintext ---- -title : Introduction -description : overview or synopsis of a project -date : 10-12-2024 -image : example-img.png ---- - ``` - \ No newline at end of file diff --git a/contents/docs/api-reference/licensing/index.mdx b/contents/docs/api-reference/licensing/index.mdx new file mode 100644 index 0000000..8b0ac42 --- /dev/null +++ b/contents/docs/api-reference/licensing/index.mdx @@ -0,0 +1,87 @@ +--- +title: Licensing API +description: Endpoints for activating, validating, and managing licenses +date: 2024-01-31 +--- + +## Overview + +The Licensing API allows external applications to interact with the WooNooW licensing system. + +**Base URL**: `https://your-domain.com/wp-json/woonoow/v1` + +--- + +## Public Endpoints + +### Activate License + +Activates a license key for a specific domain. + +```http +POST /licenses/activate +``` + +#### Activation Parameters + +| Body Params | Type | Required | Description | +| :--- | :--- | :--- | :--- | +| `license_key` | `string` | **Yes** | The license key to activate | +| `domain` | `string` | **Yes** | The domain where the software is installed | +| `activation_mode` | `string` | No | Set to `oauth` to trigger OAuth flow | + +#### Responses + +```json +{ + "success": true, + "activation_id": 123, + "license_key": "XXXX-YYYY-ZZZZ-WWWW", + "status": "active" +} +``` + +If OAuth is required: + +```json +{ + "success": false, + "oauth_required": true, + "oauth_redirect": "https://vendor.com/my-account/license-connect/...", + "state": "abc12345" +} +``` + +--- + +### Validate License + +Checks if a license key is valid and active for the current domain. + +```http +POST /licenses/validate +``` + +#### Validation Parameters + +| Body Params | Type | Required | Description | +| :--- | :--- | :--- | :--- | +| `license_key` | `string` | **Yes** | The license key to validate | +| `domain` | `string` | **Yes** | The domain to check against | + +--- + +### Deactivate License + +Deactivates a license for the current domain. + +```http +POST /licenses/deactivate +``` + +#### Deactivation Parameters + +| Body Params | Type | Required | Description | +| :--- | :--- | :--- | :--- | +| `license_key` | `string` | **Yes** | The license key to deactivate | +| `domain` | `string` | **Yes** | The domain to remove | diff --git a/contents/docs/api-reference/meta.json b/contents/docs/api-reference/meta.json new file mode 100644 index 0000000..81b1ef3 --- /dev/null +++ b/contents/docs/api-reference/meta.json @@ -0,0 +1,5 @@ +{ + "pages": [ + "licensing" + ] +} \ No newline at end of file diff --git a/contents/docs/api-reference/post/index.mdx b/contents/docs/api-reference/post/index.mdx deleted file mode 100644 index 52eabcc..0000000 --- a/contents/docs/api-reference/post/index.mdx +++ /dev/null @@ -1,63 +0,0 @@ ---- -title : Post -description : example api POST -date : 10-12-2024 ---- - -## Heading 2 - -this is regular text written in markdown format with `inline code`, **bold**, and *italic* - -### Heading 3 - -example of ordered list format : - -- list one - - sub list -- list two -- list three - -#### Heading 4 - -Below is an example of how to write a code block : - -````plaintext -```javascript:main.js showLineNumbers {3-4} -function isRocketAboutToCrash() { - // Check if the rocket is stable - if (!isStable()) { - NoCrash(); // Prevent the crash - } -} -``` -```` - -example note : -```plaintext - - This is a general note to convey information to the user. - -``` - -displaying an image in markdown format : - -```plaintext -![Alt text for the image](/images/example-img.png) -``` - -render as : -![Alt text for the image](/images/example-img.png) - -For a complete guide on using markdown content in DocuBook, please refer to the [Components](https://docubook.pro/docs/components) page. - - - every page that is indexed in a folder will have an `index.mdx` file with metadata : - ```plaintext ---- -title : Introduction -description : overview or synopsis of a project -date : 10-12-2024 -image : example-img.png ---- - ``` - \ No newline at end of file diff --git a/contents/docs/changelog/index.mdx b/contents/docs/changelog/index.mdx new file mode 100644 index 0000000..ccbb17c --- /dev/null +++ b/contents/docs/changelog/index.mdx @@ -0,0 +1,16 @@ +--- +title: Changelog +description: Latest updates and changes to WooNooW +date: 2024-01-31 +--- + +## Initial Release + + + + - Core plugin functionality for WooCommerce enhancement. + - Licensing module with OAuth activation flow. + - Subscription management and payment gateway integration. + - Extensive hook system for developers. + + diff --git a/contents/docs/changelog/version-1/index.mdx b/contents/docs/changelog/version-1/index.mdx deleted file mode 100644 index f5a1ce8..0000000 --- a/contents/docs/changelog/version-1/index.mdx +++ /dev/null @@ -1,49 +0,0 @@ ---- -title : Version 1 -description : changelog version -date : 10-12-2024 ---- - -## Render as - - - - - add components - - - - fix globals.css - - - - improved search components - - - - deprecated footer components - - - - removed utility class - - removed unused hooks - - - -## Output Markdown - -``` - - - - add components - - - - fix globals.css - - - - improved search components - - - - deprecated footer components - - - - removed utility class - - removed unused hooks - - -``` \ No newline at end of file diff --git a/contents/docs/changelog/version-2/index.mdx b/contents/docs/changelog/version-2/index.mdx deleted file mode 100644 index 05b201e..0000000 --- a/contents/docs/changelog/version-2/index.mdx +++ /dev/null @@ -1,49 +0,0 @@ ---- -title : Version 2 -description : changelog version -date : 10-12-2024 ---- - -## Render as - - - - - add components - - - - fix globals.css - - - - improved search components - - - - deprecated footer components - - - - removed utility class - - removed unused hooks - - - -## Output Markdown - -``` - - - - add components - - - - fix globals.css - - - - improved search components - - - - deprecated footer components - - - - removed utility class - - removed unused hooks - - -``` \ No newline at end of file diff --git a/contents/docs/changelog/version-3/index.mdx b/contents/docs/changelog/version-3/index.mdx deleted file mode 100644 index 1ddfba8..0000000 --- a/contents/docs/changelog/version-3/index.mdx +++ /dev/null @@ -1,49 +0,0 @@ ---- -title : Version 3 -description : changelog version -date : 10-12-2024 ---- - -## Render as - - - - - add components - - - - fix globals.css - - - - improved search components - - - - deprecated footer components - - - - removed utility class - - removed unused hooks - - - -## Output Markdown - -``` - - - - add components - - - - fix globals.css - - - - improved search components - - - - deprecated footer components - - - - removed utility class - - removed unused hooks - - -``` \ No newline at end of file diff --git a/contents/docs/configuration/appearance/index.mdx b/contents/docs/configuration/appearance/index.mdx new file mode 100644 index 0000000..e93cae9 --- /dev/null +++ b/contents/docs/configuration/appearance/index.mdx @@ -0,0 +1,135 @@ +--- +title: Appearance Settings +description: Customize the look and feel of your WooNooW store +date: 2024-01-31 +--- + +## Accessing Appearance Settings + +Go to **WooNooW → Appearance** in the WordPress admin. + +--- + +## General Settings + +### Logo + +Upload your store logo for display in the header. + +- **Recommended size**: 200x60 pixels (width x height) +- **Formats**: PNG (transparent background recommended), SVG, JPG +- **Mobile**: Automatically resized for smaller screens + +### SPA Page + +Select which page hosts the WooNooW SPA. Default is "Store". + +> **Note**: This page should contain the `[woonoow_spa]` shortcode. + +### SPA Mode + +Choose how WooNooW handles your store pages: + +| Mode | Description | +|------|-------------| +| **Full** | All WooCommerce pages redirect to SPA | +| **Disabled** | Native WooCommerce templates are used | + +--- + +## Colors + +### Primary Color + +The main brand color used for: +- Buttons +- Links +- Active states +- Primary actions + +**Default**: `#6366f1` (Indigo) + +### Secondary Color + +Secondary UI elements: +- Less prominent buttons +- Borders +- Subtle backgrounds + +**Default**: `#64748b` (Slate) + +### Accent Color + +Highlight color for: +- Sale badges +- Notifications +- Call-to-action elements + +**Default**: `#f59e0b` (Amber) + +--- + +## Typography + +### Body Font + +Font used for general text content. + +**Options**: System fonts and Google Fonts +- Inter +- Open Sans +- Roboto +- Lato +- Poppins +- And more... + +### Heading Font + +Font used for titles and headings. + +**Options**: Same as body fonts, plus: +- Cormorant Garamond (Serif option) +- Playfair Display +- Merriweather + +### Font Sizes + +Font sizes are responsive and adjust automatically based on screen size. + +--- + +## Layout + +### Container Width + +Maximum width of the content area. + +| Option | Width | +|--------|-------| +| Narrow | 1024px | +| Default | 1280px | +| Wide | 1536px | +| Full | 100% | + +### Header Style + +Configure the header appearance: +- **Fixed**: Stays at top when scrolling +- **Static**: Scrolls with page + +### Product Grid + +Columns in the shop page grid: +- Mobile: 1-2 columns +- Tablet: 2-3 columns +- Desktop: 3-4 columns + +--- + +## Saving Changes + +1. Make your changes +2. Click **Save Changes** button +3. Refresh your store page to see updates + +> **Tip**: Open your store in another tab to preview changes quickly. diff --git a/contents/docs/configuration/spa-mode/index.mdx b/contents/docs/configuration/spa-mode/index.mdx new file mode 100644 index 0000000..9831aba --- /dev/null +++ b/contents/docs/configuration/spa-mode/index.mdx @@ -0,0 +1,141 @@ +--- +title: SPA Mode +description: Understanding and configuring WooNooW's SPA mode +date: 2024-01-31 +--- + +## What is SPA Mode? + +SPA Mode controls how WooNooW handles your WooCommerce pages. It determines whether visitors experience the modern SPA interface or traditional WooCommerce templates. + +--- + +## Available Modes + +### Full Mode (Recommended) + +**All WooCommerce pages redirect to the SPA.** + +When a visitor navigates to: +- `/shop` → Redirects to `/store/shop` +- `/product/example` → Redirects to `/store/product/example` +- `/cart` → Redirects to `/store/cart` +- `/checkout` → Redirects to `/store/checkout` +- `/my-account` → Redirects to `/store/my-account` + +**Benefits**: +- Instant page transitions +- Modern, consistent UI +- Better mobile experience +- Smooth animations + +**Best for**: +- New stores +- Stores wanting a modern look +- Mobile-focused businesses + +### Disabled Mode + +**WooCommerce uses its native templates.** + +WooCommerce pages work normally with your theme's templates. WooNooW admin features still work, but the customer-facing SPA is turned off. + +**Benefits**: +- Keep existing theme customizations +- Compatibility with WooCommerce template overrides +- Traditional page-by-page navigation + +**Best for**: +- Stores with heavy theme customizations +- Testing before full rollout +- Troubleshooting issues + +--- + +## Switching Modes + +### How to Switch + +1. Go to **WooNooW → Appearance → General** +2. Find **SPA Mode** setting +3. Select your preferred mode +4. Click **Save Changes** + +### What Happens When Switching + +**Switching to Full**: +- WooCommerce pages start redirecting +- SPA loads for shop experience +- No data is changed + +**Switching to Disabled**: +- Redirects stop immediately +- WooCommerce templates take over +- No data is changed + +> **Note**: All your products, orders, and settings remain unchanged when switching modes. + +--- + +## URL Structure + +### Full Mode URLs + +``` +https://yourstore.com/store/ → Home/Shop +https://yourstore.com/store/shop → Shop page +https://yourstore.com/store/product/slug → Product page +https://yourstore.com/store/cart → Cart +https://yourstore.com/store/checkout → Checkout +https://yourstore.com/store/my-account → Account +``` + +### Disabled Mode URLs + +Standard WooCommerce URLs: +``` +https://yourstore.com/shop/ → Shop page +https://yourstore.com/product/slug → Product page +https://yourstore.com/cart/ → Cart +https://yourstore.com/checkout/ → Checkout +https://yourstore.com/my-account/ → Account +``` + +--- + +## SEO Considerations + +### Full Mode SEO + +- WooCommerce URLs (`/product/slug`) remain in sitemaps +- When users click from search results, they're redirected to SPA +- Meta tags are generated dynamically for social sharing +- 302 (temporary) redirects preserve link equity + +### Disabled Mode SEO + +- Standard WooCommerce SEO applies +- No redirects needed +- Works with Yoast SEO, RankMath, etc. + +--- + +## Troubleshooting + +### Redirects Not Working + +1. **Flush Permalinks**: Go to Settings → Permalinks → Save Changes +2. **Check Store Page**: Ensure the Store page exists and has `[woonoow_spa]` +3. **Clear Cache**: Purge all caching layers + +### Blank Pages After Enabling + +1. Verify SPA Mode is set to "Full" +2. Clear browser cache +3. Check for JavaScript errors in browser console + +### Want to Test Before Enabling + +1. Keep mode as "Disabled" +2. Visit `/store/` directly to preview SPA +3. Switch to "Full" when satisfied diff --git a/contents/docs/developer/addons/bridge-pattern/index.mdx b/contents/docs/developer/addons/bridge-pattern/index.mdx new file mode 100644 index 0000000..d9a3b2e --- /dev/null +++ b/contents/docs/developer/addons/bridge-pattern/index.mdx @@ -0,0 +1,79 @@ +--- +title: Bridge Pattern +description: Integrating third-party plugins with WooNooW +date: 2024-01-31 +--- + +# Addon Bridge Pattern + +## Philosophy + +**WooNooW Core = Zero Addon Dependencies** + +We don't integrate specific plugins into WooNooW core. Instead, we provide: +1. **Hook system** for addons to extend functionality +2. **Bridge snippets** for compatibility with existing plugins +3. **Addon development guide** for building proper WooNooW addons + +--- + +## The Problem + +Example: **Rajaongkir** (Indonesian Shipping Plugin). +It removes standard fields and adds custom dropdowns, storing data in WooCommerce sessions. +It doesn't work with WooNooW OrderForm out of the box because the OrderForm uses standard fields and API-based validation. + +--- + +## Solution: Bridge Snippet + +### Option A: Standalone Bridge Plugin + +Create a tiny bridge plugin that makes the third-party plugin work with WooNooW. + +```php +/** + * Plugin Name: WooNooW Rajaongkir Bridge + * Description: Makes Rajaongkir plugin work with WooNooW OrderForm + * Version: 1.0.0 + */ + +// Hook into WooNooW's shipping calculation +add_filter('woonoow_before_shipping_calculate', function($shipping_data) { + if ($shipping_data['country'] === 'ID' && !empty($shipping_data['city'])) { + // Search API and set session data + $api = Cekongkir_API::get_instance(); + $results = $api->search_destination_api($shipping_data['city']); + + if (!empty($results[0])) { + WC()->session->set('selected_destination_id', $results[0]['id']); + } + } + return $shipping_data; +}); +``` + +### Option B: Frontend Injection + +Inject script to handle UI changes. + +```typescript +import { addonLoader, addFilter } from '@woonoow/hooks'; + +addonLoader.register({ + id: 'rajaongkir-bridge', + init: () => { + addFilter('woonoow_order_form_after_shipping', (content, formData, setFormData) => { + if (formData.shipping?.country !== 'ID') return content; + return ( + <> + {content} +
+ {/* Custom Destination Select */} +
+ + ); + }); + } +}); +``` diff --git a/contents/docs/developer/addons/module-integration/index.mdx b/contents/docs/developer/addons/module-integration/index.mdx new file mode 100644 index 0000000..3ebec18 --- /dev/null +++ b/contents/docs/developer/addons/module-integration/index.mdx @@ -0,0 +1,50 @@ +--- +title: Module Integration +description: Integrating Addons usage with Module Registry +date: 2024-01-31 +--- + +# Addon-Module Integration + +## Vision + +**Module Registry as the Single Source of Truth.** +Functionality extensions—whether built-in Modules or external Addons—should live in the same UI. + +## Registration + +Addons register themselves via the `woonoow/addon_registry` filter. + +```php +add_filter('woonoow/addon_registry', function($addons) { + $addons['my-shipping-addon'] = [ + 'id' => 'my-shipping-addon', + 'name' => 'My Shipping', + 'description' => 'Custom shipping integration', + 'version' => '1.0.0', + 'author' => 'My Company', + 'category' => 'shipping', + 'icon' => 'truck', + 'settings_url' => '/settings/shipping/my-addon', + 'spa_bundle' => plugin_dir_url(__FILE__) . 'dist/addon.js', + ]; + return $addons; +}); +``` + +This ensures your addon appears in the **WooNooW Modules** list with a consistent UI, toggle switch, and settings link. + +## Settings Pages + +Addons can register their own SPA routes for settings pages. + +```php +add_filter('woonoow/spa_routes', function($routes) { + $routes[] = [ + 'path' => '/settings/shipping/my-addon', + 'component_url' => plugin_dir_url(__FILE__) . 'dist/Settings.js', + 'title' => 'My Addon Settings', + ]; + return $routes; +}); +``` diff --git a/contents/docs/developer/addons/react-integration/index.mdx b/contents/docs/developer/addons/react-integration/index.mdx new file mode 100644 index 0000000..7ff4e90 --- /dev/null +++ b/contents/docs/developer/addons/react-integration/index.mdx @@ -0,0 +1,79 @@ +--- +title: React Integration +description: Using React within WooNooW Addons +date: 2024-01-31 +--- + +# Addon React Integration + +## The Challenge + +External addons cannot bundle React because WooNooW already ships with a React runtime. Bundling it again would cause conflicts and bloat. + +## Solution: Exposed Runtime + +WooNooW exposes its React instance and Component library on the `window` object. + +### Core Setup (How it works internally) + +```typescript +// WooNooW Core +window.WooNooW = { + React: React, + ReactDOM: ReactDOM, + components: { + Button: Button, + Input: Input, + Select: Select, + }, + hooks: { addFilter, addAction } +}; +``` + +### Addon implementation + +#### Level 1: Vanilla JS (No Build) + +Good for simple injections. + +```javascript +(function() { + window.addEventListener('woonoow:loaded', function() { + window.WooNooW.addFilter('woonoow_order_form_after_shipping', function(container) { + // Manual DOM manipulation + return container; + }); + }); +})(); +``` + +#### Level 2: React with Build (Recommended) + +Use `vite` or `webpack` and configure React as an **external**. + +**vite.config.js** +```javascript +export default { + build: { + rollupOptions: { + external: ['react', 'react-dom'], + output: { + globals: { + react: 'window.WooNooW.React', + 'react-dom': 'window.WooNooW.ReactDOM' + } + } + } + } +}; +``` + +**Index.tsx** +```typescript +const { React, hooks, components } = window.WooNooW; +const { Button } = components; + +function MyAddonComponent() { + return ; +} +``` diff --git a/contents/docs/features/checkout/index.mdx b/contents/docs/features/checkout/index.mdx new file mode 100644 index 0000000..0671d96 --- /dev/null +++ b/contents/docs/features/checkout/index.mdx @@ -0,0 +1,143 @@ +--- +title: Checkout +description: Streamlined purchasing experience in WooNooW +date: 2024-01-31 +--- + +## Overview + +The checkout process includes: + +1. **Cart Review** - Verify items before checkout +2. **Customer Information** - Billing and shipping details +3. **Payment Method** - Select how to pay +4. **Order Confirmation** - Complete the purchase + +--- + +## Checkout Flow + +### Step 1: Cart + +Before checkout, customers review their cart: +- Product list with images +- Quantity adjustments +- Remove items +- Apply coupon codes +- See subtotal, shipping, and total + +### Step 2: Customer Details + +Customers provide: +- **Email address** +- **Billing information** +- **Shipping address** (if different from billing) + +> **Note**: Logged-in customers have their details pre-filled. + +### Step 3: Shipping Method + +If physical products are in the cart: +- Available shipping methods are shown +- Shipping cost is calculated +- Customer selects preferred method + +### Step 4: Payment + +Customers choose their payment method: +- Credit/Debit Card (Stripe, PayPal, etc.) +- Bank Transfer +- Cash on Delivery +- Other configured gateways + +### Step 5: Place Order + +After reviewing everything: +- Click "Place Order" +- Payment is processed +- Confirmation page is shown +- Email receipt is sent + +--- + +## Features + +### Guest Checkout + +Allow customers to checkout without creating an account. +Configure in **WooCommerce → Settings → Accounts & Privacy**. + +### Coupon Codes + +Customers can apply discount codes: +1. Enter code in the coupon field +2. Click "Apply" +3. Discount is reflected in total + +### Order Notes + +Optional field for customers to add special instructions. + +--- + +## Payment Gateways + +### Supported Gateways + +WooNooW supports all WooCommerce payment gateways: + +| Gateway | Type | +|---------|------| +| Bank Transfer (BACS) | Manual | +| Check Payments | Manual | +| Cash on Delivery | Manual | +| PayPal | Card / PayPal | +| Stripe | Card | +| Square | Card | + +### Configuring Gateways + +1. Go to **WooNooW → Settings → Payments** +2. Enable desired payment methods +3. Configure API keys and settings +4. Test with sandbox/test mode first + +--- + +## After Checkout + +### Order Confirmation Page + +Shows: +- Order number +- Order summary +- Next steps + +### Confirmation Email + +Automatically sent to customer with: +- Order details +- Payment confirmation +- Shipping information (if applicable) + +--- + +## Troubleshooting + +### "Place Order" Button Not Working + +1. Check all required fields are filled +2. Verify payment gateway is properly configured +3. Check browser console for JavaScript errors + +### Payment Declined + +1. Customer should verify card details +2. Check payment gateway dashboard for error details +3. Ensure correct API keys are configured + +### Shipping Not Showing + +1. Verify shipping zones are configured in WooCommerce +2. Check if products have weight/dimensions set +3. Confirm customer's address is in a configured zone diff --git a/contents/docs/features/shop/index.mdx b/contents/docs/features/shop/index.mdx new file mode 100644 index 0000000..ce204b1 --- /dev/null +++ b/contents/docs/features/shop/index.mdx @@ -0,0 +1,98 @@ +--- +title: Shop Page +description: Browsing and filtering your product catalog +date: 2024-01-31 +--- + +## 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. diff --git a/contents/docs/features/shortcodes/index.mdx b/contents/docs/features/shortcodes/index.mdx new file mode 100644 index 0000000..de773de --- /dev/null +++ b/contents/docs/features/shortcodes/index.mdx @@ -0,0 +1,26 @@ +--- +title: Shortcodes +description: Available shortcodes in WooNooW +date: 2024-01-31 +--- + +## The Primary Shortcode + +WooNooW operates as a Single Page Application (SPA). To render the entire store application, you only need one shortcode: + +### `[woonoow_spa]` + +This shortcode initializes the SPA router and renders the appropriate view based on the URL (Shop, Product, Cart, Checkout, Account). + +**Usage:** +Place this shortcode on your designated "Store" page. + +```text +[woonoow_spa] +``` + +--- + +## Legacy Shortcodes + +*Note: Previous versions utilize individual shortcodes (`[woonoow_shop]`, etc.). These are now consolidated into the single SPA entry point for better performance and routing state management.* diff --git a/contents/docs/getting-started/installation/index.mdx b/contents/docs/getting-started/installation/index.mdx new file mode 100644 index 0000000..2b2ab4d --- /dev/null +++ b/contents/docs/getting-started/installation/index.mdx @@ -0,0 +1,94 @@ +--- +title: Installation Guide +description: Installing WooNooW on your WordPress site +date: 2024-01-31 +--- + +## Requirements + +Before installing, ensure your site meets these requirements: + +| Requirement | Minimum | Recommended | +|-------------|---------|-------------| +| WordPress | 6.0+ | Latest | +| WooCommerce | 7.0+ | Latest | +| PHP | 7.4+ | 8.1+ | +| MySQL | 5.7+ | 8.0+ | + +## Installation Methods + +### Method 1: WordPress Admin (Recommended) + +1. Go to **Plugins → Add New** +2. Click **Upload Plugin** +3. Select the `woonoow.zip` file +4. Click **Install Now** +5. Click **Activate** + +### Method 2: FTP Upload + +1. Extract `woonoow.zip` to get the `woonoow` folder +2. Upload to `/wp-content/plugins/` +3. Go to **Plugins → Installed Plugins** +4. Find WooNooW and click **Activate** + +## Post-Installation + +After activation, WooNooW automatically: + +### 1. Creates Store Page +A new "Store" page is created with the SPA shortcode. This is your main storefront. + +### 2. Registers Rewrite Rules +URL routes like `/store/shop` and `/store/product/...` are registered. + +> **Note**: If you see 404 errors, go to **Settings → Permalinks** and click **Save Changes** to flush rewrite rules. + +### 3. Sets Default Configuration +Basic appearance settings are configured with sensible defaults. + +## Verification Checklist + +After installation, verify everything works: + +- [ ] Plugin activated without errors +- [ ] WooNooW menu appears in admin sidebar +- [ ] Store page exists (check **Pages**) +- [ ] `/store` URL loads the SPA +- [ ] Products display on shop page + +## WooCommerce Compatibility + +WooNooW works alongside WooCommerce: + +| WooCommerce Page | WooNooW Behavior (Full Mode) | +|------------------|------------------------------| +| `/shop` | Redirects to `/store/shop` | +| `/product/...` | Redirects to `/store/product/...` | +| `/cart` | Redirects to `/store/cart` | +| `/checkout` | Redirects to `/store/checkout` | +| `/my-account` | Redirects to `/store/my-account` | + +When SPA Mode is **Disabled**, WooCommerce pages work normally. + +## Updating + +To update WooNooW: + +1. Download the latest version +2. Go to **Plugins → Installed Plugins** +3. Deactivate WooNooW (optional but recommended) +4. Delete the old version +5. Install and activate the new version + +Your settings are preserved in the database. + +## Uninstalling + +To completely remove WooNooW: + +1. Deactivate the plugin (restores WooCommerce page content) +2. Delete the plugin +3. (Optional) Delete WooNooW options from database + +> **Note**: Deactivating restores original WooCommerce shortcodes to Cart, Checkout, and My Account pages. diff --git a/contents/docs/getting-started/introduction/index.mdx b/contents/docs/getting-started/introduction/index.mdx index ec21c78..8e7c803 100644 --- a/contents/docs/getting-started/introduction/index.mdx +++ b/contents/docs/getting-started/introduction/index.mdx @@ -1,74 +1,39 @@ --- -title : Introduction -description : overview or synopsis of a project -date : 10-12-2024 +title: Introduction +description: Overview of the WooNooW Plugin ecosystem +date: 2024-01-31 --- -## Heading 2 +## What is WooNooW? -this is regular text written in markdown format with `inline code`, **bold**, and *italic* +**WooNooW** is a comprehensive WooCommerce enhancement suite designed to power up your online store. It provides a robust set of tools for license management, subscription handling, and custom checkout flows. -### Heading 3 +### Key Features -example of ordered list format : +* **License Management**: Sell and manage digital software licenses with ease. +* **OAuth Activation**: Secure, user-verified license activation flow. +* **Subscription Utilities**: Enhanced subscription notifications and manual renewal controls. +* **Developer API**: Full REST API for extending functionality. -- list one - - sub list -- list two -- list three - -#### Heading 4 - -Below is an example of how to write a code block : - -````plaintext -```javascript:main.js showLineNumbers {3-4} -function isRocketAboutToCrash() { - // Check if the rocket is stable - if (!isStable()) { - NoCrash(); // Prevent the crash - } -} -``` -```` - -example note : -```plaintext - - This is a general note to convey information to the user. - -``` - -displaying an image in markdown format : - -```plaintext -![Alt text for the image](/images/example-img.png) -``` - -render as : -![Alt text for the image](/images/example-img.png) - -For a complete guide on using markdown content in DocuBook, please refer to the [Components](https://docubook.pro/docs/components) page. - - - every page that is indexed in a folder will have an `index.mdx` file with metadata : - ```plaintext --- -title : Introduction -description : overview or synopsis of a project -date : 10-12-2024 -image : example-img.png ---- - ``` - - - ```javascript:main.js showLineNumbers {3-4} - function isRocketAboutToCrash() { - // Check if the rocket is stable - if (!isStable()) { - NoCrash(); // Prevent the crash - } - } - ``` - +## Why use WooNooW? + +If you are a plugin developer or a digital store owner using WooCommerce, WooNooW simplifies the complex parts of your business logic. + + + + Built with extensibility in mind. Use our hooks, filters, and REST API to build custom integrations. + + + Manage your digital products, verified customers, and subscriptions all in one place. + + + +## Getting Help + +Need assistance? Check out our support channels: + +* [Official Support](https://woonoow.com/support) +* [Community Forums](https://community.woonoow.com) +* [Developer Docs](https://docs.woonoow.com) diff --git a/contents/docs/getting-started/meta.json b/contents/docs/getting-started/meta.json new file mode 100644 index 0000000..f08f075 --- /dev/null +++ b/contents/docs/getting-started/meta.json @@ -0,0 +1,7 @@ +{ + "pages": [ + "introduction", + "quick-start-guide", + "development" + ] +} \ No newline at end of file diff --git a/contents/docs/hooks/frontend/index.mdx b/contents/docs/hooks/frontend/index.mdx new file mode 100644 index 0000000..605bc20 --- /dev/null +++ b/contents/docs/hooks/frontend/index.mdx @@ -0,0 +1,21 @@ +--- +title: Frontend Hooks +description: Hooks affecting the storefront and checkout experience +date: 2024-01-31 +--- + +## Filters + +### woonoow_ssr_cache_ttl + +Customize the Time-To-Live (TTL) for Server Side Rendered fragments. + +**Parameters:** +* `$ttl` (int): Time in seconds (Default: 3600). + +### woonoow_standard_checkout_field_keys + +Modify the standard set of checkout fields recognized by the system. + +**Parameters:** +* `$keys` (array): List of field aliases (e.g., ['billing_first_name', ...]). diff --git a/contents/docs/hooks/index.mdx b/contents/docs/hooks/index.mdx new file mode 100644 index 0000000..ca470a7 --- /dev/null +++ b/contents/docs/hooks/index.mdx @@ -0,0 +1,27 @@ +--- +title: Hooks Overview +description: Overview of Actions and Filters available in WooNooW +date: 2024-01-31 +--- + +## Introduction + +WooNooW provides a rich set of actions and filters allowing developers to customize almost every aspect of the plugin without modifying core files. + +### Hook Categories + +* [Notifications](/docs/hooks/notifications) - Customize email templates, subjects, and channels. +* [Subscriptions](/docs/hooks/subscriptions) - Intercept payment logic and modify gateway behavior. +* [Frontend & checkout](/docs/hooks/frontend) - Adjust checkout fields and SSR caching. +* [Newsletter](/docs/hooks/newsletter) - Subscribe/unsubscribe events. + +### Usage Example + +```php +add_filter('woonoow_email_default_subject', function($subject, $recipient, $event) { + if ($event === 'subscription_renewal') { + return 'Your subscription is renewing soon!'; + } + return $subject; +}, 10, 3); +``` diff --git a/contents/docs/hooks/meta.json b/contents/docs/hooks/meta.json new file mode 100644 index 0000000..a51ab1c --- /dev/null +++ b/contents/docs/hooks/meta.json @@ -0,0 +1,9 @@ +{ + "pages": [ + "index", + "notifications", + "subscriptions", + "frontend", + "newsletter" + ] +} \ No newline at end of file diff --git a/contents/docs/hooks/newsletter/index.mdx b/contents/docs/hooks/newsletter/index.mdx new file mode 100644 index 0000000..269364d --- /dev/null +++ b/contents/docs/hooks/newsletter/index.mdx @@ -0,0 +1,21 @@ +--- +title: Newsletter Hooks +description: Hooks related to the Newsletter module +--- + +## Actions + +### woonoow_newsletter_subscribed + +Triggered when a user subscribes to the newsletter. + +**Parameters:** +* `$email` (string): The subscriber's email address. +* `$user_id` (int|null): The user ID if logged in, or null. + +### woonoow_newsletter_unsubscribed + +Triggered when a user unsubscribes from the newsletter. + +**Parameters:** +* `$email` (string): The subscriber's email address. diff --git a/contents/docs/hooks/notifications/index.mdx b/contents/docs/hooks/notifications/index.mdx new file mode 100644 index 0000000..ad02b7f --- /dev/null +++ b/contents/docs/hooks/notifications/index.mdx @@ -0,0 +1,108 @@ +--- +title: Notifications Hooks +description: Hooks related to email and push notifications +date: 2024-01-31 +--- + +## Filters + +### woonoow_email_default_templates + +Modify the list of available email templates. + +**Parameters:** +* `$templates` (array): Associative array of template paths. + +### woonoow_email_default_subject + +Customize the default subject line for emails. + +**Parameters:** +* `$subject` (string): The default subject. +* `$recipient` (string): The recipient type (e.g., 'customer', 'admin'). +* `$event` (string): The event triggering the email. + +### woonoow_notification_channels + +Register or modify available notification channels. + +**Parameters:** +* `$channels` (array): list of channels. + +### woonoow_email_variables + +Add custom variables to be replaced in email templates. + +**Parameters:** +* `$variables` (array): Key-value pairs of variables. +* `$event_id` (string): The current event ID. +* `$data` (array): Function context data. + +### woonoow_email_template + +Override the resolved template path for an email. + +**Parameters:** +* `$template_path` (string): Absolute path to the template file. + +--- + +## Actions + +### woonoow_email_sent + +Triggered after an email is successfully sent. + +**Parameters:** +* `$event_id` (string): The event ID. +* `$recipient_type` (string): Type of recipient. +* `$email` (string): The email address it was sent to. + +### woonoow_send_push_notification + +Triggered when the system determines a push notification should be sent. + +**Parameters:** +* `$event_id` (string): The event ID. +* `$recipient` (object): The recipient user object. +* `$data` (array): Payload data. +* `$recipient_type` (string): Type of recipient. +* `$email` (string): The email address it was sent to. + +### woonoow_send_push_notification + +Triggered to send a push notification. + +**Parameters:** +* `$event_id` (string): The event key. +* `$recipient` (WP_User): The recipient user object. +* `$data` (array): Notification payload data. + +### woonoow_notification_events_registry + +Filter to register custom notification events. + +**Parameters:** +* `$events` (array): The array of registered events. + +**Example:** +```php +add_filter('woonoow_notification_events_registry', function($events) { + $events['my_custom_event'] = [ + 'title' => 'My Custom Event', + 'description' => 'Triggered when something happens', + 'recipient' => 'customer', + ]; + return $events; +}); +``` + +### woonoow_notification_event_updated + +Triggered when a notification event's settings are updated via API. + +**Parameters:** +* `$event_id` (string): The event key. +* `$channel_id` (string): The channel (email/push). +* `$enabled` (bool): New status. +* `$recipient` (string): Recipient type. diff --git a/contents/docs/hooks/subscriptions/index.mdx b/contents/docs/hooks/subscriptions/index.mdx new file mode 100644 index 0000000..af0a5bf --- /dev/null +++ b/contents/docs/hooks/subscriptions/index.mdx @@ -0,0 +1,26 @@ +--- +title: Subscription Hooks +description: Hooks for customizing subscription flows and payments +date: 2024-01-31 +--- + +## Filters + +### woonoow_pre_process_subscription_payment + +Intercept the subscription payment process before it begins. + +**Parameters:** +* `$result` (null|mixed): Return non-null to short-circuit the process. +* `$subscription` (WC_Subscription): The subscription object. +* `$order` (WC_Order): The renewal order. + +### woonoow_process_subscription_payment + +Modify or handle the payment processing via a custom gateway logic. + +**Parameters:** +* `$result` (null|bool): The result of the payment. +* `$gateway` (object): The payment gateway instance. +* `$order` (WC_Order): The order being paid. +* `$subscription` (WC_Subscription): The subscription object. diff --git a/contents/docs/licensing/meta.json b/contents/docs/licensing/meta.json new file mode 100644 index 0000000..746b7d4 --- /dev/null +++ b/contents/docs/licensing/meta.json @@ -0,0 +1,5 @@ +{ + "pages": [ + "oauth-flow" + ] +} \ No newline at end of file diff --git a/contents/docs/licensing/oauth-flow/index.mdx b/contents/docs/licensing/oauth-flow/index.mdx new file mode 100644 index 0000000..73ae6d9 --- /dev/null +++ b/contents/docs/licensing/oauth-flow/index.mdx @@ -0,0 +1,114 @@ +--- +title: OAuth Activation Flow +description: Implementation guide for secure user-verified license activation +date: 2024-01-31 +--- + +## Overview + +The Secure OAuth Activation flow ensures that licenses are only activated by their legitimate owners. Unlike simple API activation, this method requires the user to log in to the WooNooW portal and explicitly authorize the activation request. + +### When to use OAuth? + +* ✅ When you want strict control over license usage +* ✅ To prevent license key sharing (key + auth required) +* ✅ If specific user consent is legally required + +--- + +## Authentication Flow + +The flow involves three parties: +1. **Client Application**: The software requesting activation (e.g., a customer's WordPress site) +2. **Vendor Portal**: The WooNooW dashboard where the user manages licenses +3. **Vendor API**: The backend handling the activation logic + + + + The client sends a request to the activation API with `activation_mode: "oauth"`. + + ```bash + POST /woonoow/v1/licenses/activate + { + "license_key": "XXXX-YYYY-ZZZZ-WWWW", + "domain": "https://client-site.com", + "activation_mode": "oauth" + } + ``` + + + + The API responds with `oauth_required: true` and a redirect URL. + + ```json + { + "oauth_required": true, + "oauth_redirect": "https://woonoow.com/my-account/license-connect/...", + "state": "abc12345" + } + ``` + + + + The client redirects the user to the `oauth_redirect` URL. The user logs in and sees a confirmation screen: + + > **Authorize this Request?** + > Site: https://client-site.com + > License: XXXX-YYYY-ZZZZ-WWWW + + Once confirmed, the vendor generates a temporary **activation token**. + + + + The user is redirected back to the client site with the token. The client exchanges this token for the final activation. + + ```bash + POST /woonoow/v1/licenses/activate + { + "activation_token": "temporary-token-123" + } + ``` + + + +--- + +## Implementation Guide + +### 1. Handling the Redirect + +When your application receives the `oauth_redirect` response, you must open this URL in the user's browser. + + + Always verify the `state` parameter when the user returns to your application to prevent CSRF attacks. + + +### 2. Processing the Callback + +Your application needs a callback route (e.g., `/admin.php?page=my-plugin&action=callback`). This URL must be provided in the initial `return_url` parameter. + +The callback will receive: +* `activation_token`: The token needed to complete activation +* `license_key`: The license key being activated +* `nonce`: Random standard nonce for verification + +### 3. Completing Activation + +Once you have the `activation_token`, compare the `state` (if you stored it) and make the final request. + +```javascript +const response = await fetch('https://api.woonoow.com/woonoow/v1/licenses/activate', { + method: 'POST', + headers: { 'Content-Type': 'application/json' }, + body: JSON.stringify({ + license_key: licenseKey, + activation_token: urlParams.get('activation_token') + }) +}); + +const data = await response.json(); + +if (data.success) { + console.log('License Activated!', data); +} +``` diff --git a/contents/docs/meta.json b/contents/docs/meta.json new file mode 100644 index 0000000..a18aac1 --- /dev/null +++ b/contents/docs/meta.json @@ -0,0 +1,9 @@ +{ + "pages": [ + "getting-started", + "licensing", + "hooks", + "api-reference", + "changelog" + ] +} \ No newline at end of file diff --git a/contents/docs/resources/faq/index.mdx b/contents/docs/resources/faq/index.mdx new file mode 100644 index 0000000..c48102e --- /dev/null +++ b/contents/docs/resources/faq/index.mdx @@ -0,0 +1,114 @@ +--- +title: Frequently Asked Questions +description: Quick answers to common questions about WooNooW +date: 2024-01-31 +--- + +## General + +### What is WooNooW? + +WooNooW is a WooCommerce plugin that transforms your store into a modern Single Page Application (SPA). It provides instant page loads, a beautiful UI, and seamless shopping experience. + +### Do I need WooCommerce? + +Yes. WooNooW is an enhancement layer for WooCommerce. You need WooCommerce installed and activated. + +### Will WooNooW affect my existing products? + +No. WooNooW reads from WooCommerce. Your products, orders, and settings remain untouched. + +--- + +## SPA Mode + +### What's the difference between Full and Disabled mode? + +| Mode | Behavior | +|------|----------| +| **Full** | All WooCommerce pages redirect to SPA. Modern, fast experience. | +| **Disabled** | WooCommerce pages use native templates. WooNooW admin still works. | + +### Can I switch modes anytime? + +Yes. Go to **WooNooW → Appearance → General** and change the SPA Mode. Changes take effect immediately. + +### Which mode should I use? + +- **Full**: For the best customer experience with instant loads +- **Disabled**: If you have theme customizations you want to keep + +--- + +## Compatibility + +### Does WooNooW work with my theme? + +WooNooW's SPA is independent of your WordPress theme. In Full mode, the SPA uses its own styling. Your theme affects the rest of your site normally. + +### Does WooNooW work with page builders? + +The SPA pages are self-contained. Page builders work on other pages of your site. + +### Which payment gateways are supported? + +WooNooW supports all WooCommerce-compatible payment gateways: +- PayPal +- Stripe +- Bank Transfer (BACS) +- Cash on Delivery +- And more... + +--- + +## SEO + +### Is WooNooW SEO-friendly? + +Yes. WooNooW uses: +- Clean URLs (`/store/product/product-name`) +- Dynamic meta tags for social sharing +- Proper redirects (302) from WooCommerce URLs + +### What about my existing SEO? + +WooCommerce URLs remain the indexed source. WooNooW redirects users to the SPA but preserves SEO value. + +### Will my product pages be indexed? + +Yes. Search engines index the WooCommerce URLs. When users click from search results, they're redirected to the fast SPA experience. + +--- + +## Performance + +### Is WooNooW faster than regular WooCommerce? + +Yes, for navigation. After the initial load, page transitions are instant because the SPA doesn't reload the entire page. + +### Will WooNooW slow down my site? + +The initial load is similar to regular WooCommerce. Subsequent navigation is much faster. + +### Does WooNooW work with caching? + +Yes. Use page caching and object caching for best results. + +--- + +## Customization + +### Can I customize colors and fonts? + +Yes. Go to **WooNooW → Appearance** to customize: +- Primary, secondary, and accent colors +- Body and heading fonts +- Logo and layout options + +### Can I add custom CSS? + +Currently, use your theme's Additional CSS feature. A custom CSS field may be added in future versions. + +### Can I modify the SPA templates? + +The SPA is built with React. Advanced customizations require development knowledge. diff --git a/contents/docs/resources/troubleshooting/index.mdx b/contents/docs/resources/troubleshooting/index.mdx new file mode 100644 index 0000000..a588e0e --- /dev/null +++ b/contents/docs/resources/troubleshooting/index.mdx @@ -0,0 +1,175 @@ +--- +title: Troubleshooting +description: Common issues and their solutions +date: 2024-01-31 +--- + +## Blank Pages + +### Symptom +WooCommerce pages (shop, cart, checkout) show blank content. + +### Solutions + +**1. Check SPA Mode Setting** +- Go to **WooNooW → Appearance → General** +- Ensure **SPA Mode** is set to "Full" +- If you want native WooCommerce, set to "Disabled" + +**2. Flush Permalinks** +- Go to **Settings → Permalinks** +- Click **Save Changes** (no changes needed) +- This refreshes rewrite rules + +**3. Clear Cache** +If using a caching plugin: +- Clear page cache +- Clear object cache +- Purge CDN cache (if applicable) + +--- + +## 404 Errors on SPA Routes + +### Symptom +Visiting `/store/shop` or `/store/product/...` shows a 404 error. + +### Solutions + +**1. Flush Permalinks** +- Go to **Settings → Permalinks** +- Click **Save Changes** + +**2. Check Store Page Exists** +- Go to **Pages** +- Verify "Store" page exists and is published +- The page should contain `[woonoow_spa]` shortcode + +**3. Check SPA Page Setting** +- Go to **WooNooW → Appearance → General** +- Ensure **SPA Page** is set to the Store page + +--- + +## Product Images Not Loading + +### Symptom +Products show placeholder images instead of actual images. + +### Solutions + +**1. Regenerate Thumbnails** +- Install "Regenerate Thumbnails" plugin +- Run regeneration for all images + +**2. Check Image URLs** +- Ensure images have valid URLs +- Check for mixed content (HTTP vs HTTPS) + +--- + +## Slow Performance + +### Symptom +SPA feels slow or laggy. + +### Solutions + +**1. Enable Caching** +- Install a caching plugin (WP Super Cache, W3 Total Cache) +- Enable object caching (Redis/Memcached) + +**2. Optimize Images** +- Use WebP format +- Compress images before upload +- Use lazy loading + +**3. Check Server Resources** +- Upgrade hosting if on shared hosting +- Consider VPS or managed WordPress hosting + +--- + +## Checkout Not Working + +### Symptom +Checkout page won't load or payment fails. + +### Solutions + +**1. Check Payment Gateway** +- Go to **WooCommerce → Settings → Payments** +- Verify payment method is enabled +- Check API credentials + +**2. Check SSL Certificate** +- Checkout requires HTTPS +- Verify SSL is properly installed + +**3. Check for JavaScript Errors** +- Open browser Developer Tools (F12) +- Check Console for errors +- Look for blocked scripts + +--- + +## Emails Not Sending + +### Symptom +Order confirmation emails not being received. + +### Solutions + +**1. Check Email Settings** +- Go to **WooNooW → Settings → Notifications** +- Verify email types are enabled + +**2. Check WordPress Email** +- Test with a plugin like "Check & Log Email" +- Consider using SMTP plugin (WP Mail SMTP) + +**3. Check Spam Folder** +- Emails may be in recipient's spam folder +- Add sender to whitelist + +--- + +## Plugin Conflicts + +### Symptom +WooNooW doesn't work after installing another plugin. + +### Steps to Diagnose + +1. **Deactivate other plugins** one by one +2. **Switch to default theme** (Twenty Twenty-Three) +3. **Check error logs** in `wp-content/debug.log` + +### Common Conflicting Plugins + +- Other WooCommerce template overrides +- Page builder plugins (sometimes) +- Heavy caching plugins (misconfigured) + +--- + +## Getting More Help + +If you can't resolve the issue: + +1. **Collect Information** + - WordPress version + - WooCommerce version + - WooNooW version + - PHP version + - Error messages (from debug.log) + +2. **Enable Debug Mode** + Add to `wp-config.php`: + ```php + define('WP_DEBUG', true); + define('WP_DEBUG_LOG', true); + ``` + +3. **Contact Support** + Provide the collected information for faster resolution. diff --git a/docu.json b/docu.json index 01c20bb..fe0ad3f 100644 --- a/docu.json +++ b/docu.json @@ -1,108 +1,226 @@ { "$schema": "https://docubook.pro/docu.schema.json", "meta": { - "baseURL": "https://docubook.pro", - "title": "DocuBook", - "description": "DocuBook is a modern documentation platform for building, deploying, and managing your docs with ease.", + "baseURL": "https://docs.woonoow.com", + "title": "WooNooW Docs", + "description": "Official documentation for WooNooW Plugin - The ultimate WooCommerce enhancement suite.", "favicon": "/favicon.ico" }, "navbar": { - "logo": { - "src": "/images/docu.svg", - "alt": "DocuBook Logo" + "logo": { + "src": "/images/logo.png", + "alt": "WooNooW Logo" + }, + "logoText": "WooNooW Docs", + "menu": [ + { + "title": "Home", + "href": "/" }, - "logoText": "DocuBook", - "menu": [ - { "title": "Home", "href": "/" }, - { "title": "Docs", "href": "/docs/getting-started/introduction" }, - { "title": "Community", "href": "https://docubook.pro" } - ] + { + "title": "Developer Docs", + "href": "/docs" + }, + { + "title": "Plugin Site", + "href": "https://woonoow.com" + } + ] }, "repository": { - "url": "https://github.com/DocuBook/docubook", - "editPathTemplate": "/blob/main/{filePath}", - "editLink": true + "url": "https://git.backoffice.biz.id/dwindown/WooNooW", + "editPathTemplate": "/blob/main/woonoow-docs/contents/{filePath}", + "editLink": false }, "sponsor": { - "title": "Hosted on", + "title": "Powered by", "item": { - "title": "Vercel", - "description": "Deploy your DocuBook app with zero configuration.", - "image": "/images/vercel.png", - "url": "https://vercel.com/import/project?template=https://github.com/DocuBook/docubook" + "title": "WooNooW", + "description": "Enhance your WooCommerce store.", + "image": "/images/logo.png", + "url": "https://woonoow.com" } }, "footer": { - "copyright": "DocuBook", - "social": [ - { - "name": "Instagram", - "url": "https://www.instagram.com/wildan.nrs", - "iconName": "InstagramIcon" - }, - { - "name": "Facebook", - "url": "https://www.facebook.com/wildan.nrsh", - "iconName": "FacebookIcon" - }, - { - "name": "Twitter", - "url": "https://x.com/wildan_nrss", - "iconName": "TwitterIcon" - }, - { - "name": "Youtube", - "url": "https://www.youtube.com/@wildan.nrs_", - "iconName": "YoutubeIcon" - } - ] - }, - "routes": [ - { + "copyright": "WooNooW", + "social": [] + }, + "routes": [ + { "title": "Getting Started", "href": "/getting-started", "noLink": true, "context": { - "icon": "Book", - "description": "Set up your Documentation", - "title": "Guides" - }, - "items": [ - { "title": "Introduction", "href": "/introduction" }, - { "title": "Quick Start Guide", "href": "/quick-start-guide" }, - { "title": "Development", "href": "/development" } - ] + "icon": "Book", + "description": "Guides and References", + "title": "Docs" }, - { - "title": "Api Reference", + "items": [ + { + "title": "Introduction", + "href": "/introduction" + }, + { + "title": "Installation", + "href": "/installation" + } + ] + }, + { + "title": "Configuration", + "href": "/configuration", + "noLink": true, + "context": { + "icon": "Settings", + "description": "Setup & Options", + "title": "Config" + }, + "items": [ + { + "title": "SPA Mode", + "href": "/spa-mode" + }, + { + "title": "Appearance", + "href": "/appearance" + } + ] + }, + { + "title": "Core Features", + "href": "/features", + "noLink": true, + "context": { + "icon": "Layout", + "description": "Store Functionality", + "title": "Features" + }, + "items": [ + { + "title": "Shop Page", + "href": "/shop" + }, + { + "title": "Checkout", + "href": "/checkout" + }, + { + "title": "Shortcodes", + "href": "/shortcodes" + } + ] + }, + { + "title": "Licensing & OAuth", + "href": "/licensing", + "noLink": true, + "context": { + "icon": "Key", + "description": "License Management", + "title": "Licensing" + }, + "items": [ + { + "title": "OAuth Flow", + "href": "/oauth-flow" + } + ] + }, + { + "title": "API Reference", "href": "/api-reference", "noLink": true, "context": { - "icon": "Terminal", - "description": "reference for using the API", - "title": "API Reference" - }, - "items": [ - { "title": "Get", "href": "/get" }, - { "title": "Fetch", "href": "/fetch" }, - { "title": "Post", "href": "/post" }, - { "title": "Delete", "href": "/delete" } - ] + "icon": "Terminal", + "description": "API Endpoints", + "title": "API" }, - { - "title": "Changelog", - "href": "/changelog", + "items": [ + { + "title": "Licensing API", + "href": "/licensing" + } + ] + }, + { + "title": "Developer Guides", + "href": "/developer", "noLink": true, "context": { - "icon": "History", - "description": "Update and Changes", - "title": "Release" - }, - "items": [ - { "title": "version 1", "href": "/version-1" }, - { "title": "version 2", "href": "/version-2" }, - { "title": "version 3", "href": "/version-3" } - ] - } - ] -} + "icon": "Code", + "description": "Advanced Integration", + "title": "Dev" + }, + "items": [ + { + "title": "Addons: Bridge Pattern", + "href": "/addons/bridge-pattern" + }, + { + "title": "Addons: React Integration", + "href": "/addons/react-integration" + }, + { + "title": "Addons: Module Registry", + "href": "/addons/module-integration" + } + ] + }, + { + "title": "Hooks & Filters", + "href": "/hooks", + "noLink": true, + "context": { + "icon": "Anchor", + "description": "Actions and Filters", + "title": "Hooks" + }, + "items": [ + { + "title": "Overview", + "href": "/" + }, + { + "title": "Notifications", + "href": "/notifications" + }, + { + "title": "Subscriptions", + "href": "/subscriptions" + }, + { + "title": "Frontend", + "href": "/frontend" + }, + { + "title": "Newsletter", + "href": "/newsletter" + } + ] + }, + { + "title": "Resources", + "href": "/resources", + "noLink": true, + "context": { + "icon": "Box", + "description": "Tools and Assets", + "title": "Resources" + }, + "items": [ + { + "title": "FAQ", + "href": "/faq" + }, + { + "title": "Troubleshooting", + "href": "/troubleshooting" + }, + { + "title": "Changelog", + "href": "/changelog" + } + ] + } + ] +} \ No newline at end of file diff --git a/public/images/logo.png b/public/images/logo.png new file mode 100644 index 0000000..44da7b6 Binary files /dev/null and b/public/images/logo.png differ diff --git a/styles/globals.css b/styles/globals.css index 6c012de..e8b0fa7 100644 --- a/styles/globals.css +++ b/styles/globals.css @@ -125,67 +125,67 @@ background-size: 200% 200%; } -/* Modern Blue Theme */ +/* Fresh Lime Theme */ @layer base { :root { - --background: 210 40% 98%; - --foreground: 220 30% 15%; + --background: 85 45% 98%; + --foreground: 85 30% 10%; --card: 0 0% 100%; - --card-foreground: 220 30% 15%; + --card-foreground: 85 30% 10%; --popover: 0 0% 100%; - --popover-foreground: 220 30% 15%; - --primary: 210 81% 56%; - /* #2281E3 */ + --popover-foreground: 85 30% 10%; + --primary: 85 70% 45%; --primary-foreground: 0 0% 100%; - --secondary: 210 30% 90%; - --secondary-foreground: 220 30% 15%; - --muted: 210 20% 92%; - --muted-foreground: 220 15% 50%; - --accent: 200 100% 40%; + --secondary: 85 40% 90%; + --secondary-foreground: 85 30% 10%; + --muted: 85 30% 92%; + --muted-foreground: 85 15% 45%; + --accent: 85 60% 40%; --accent-foreground: 0 0% 100%; --destructive: 0 85% 60%; --destructive-foreground: 0 0% 100%; - --border: 210 20% 85%; - --input: 210 20% 85%; - --ring: 210 81% 56%; + --border: 85 25% 88%; + --input: 85 25% 88%; + --ring: 85 70% 45%; --radius: 0.5rem; - --chart-1: 210 81% 56%; - --chart-2: 200 100% 40%; - --chart-3: 220 76% 60%; - --chart-4: 190 90% 50%; - --chart-5: 230 86% 45%; + --chart-1: 85 70% 45%; + --chart-2: 85 60% 40%; + --chart-3: 85 80% 40%; + --chart-4: 85 85% 35%; + --chart-5: 85 90% 30%; --line-number-color: rgba(0, 0, 0, 0.05); } .dark { - --background: 220 25% 10%; - --foreground: 210 30% 96%; - --card: 220 25% 15%; - --card-foreground: 210 30% 96%; - --popover: 220 25% 15%; - --popover-foreground: 210 30% 96%; - --primary: 210 100% 65%; - --primary-foreground: 220 25% 10%; - --secondary: 215 25% 20%; - --secondary-foreground: 210 30% 96%; - --muted: 215 20% 25%; - --muted-foreground: 215 20% 65%; - --accent: 200 100% 60%; + --background: 85 20% 8%; + --foreground: 85 30% 96%; + --card: 85 20% 10%; + --card-foreground: 85 30% 96%; + --popover: 85 20% 10%; + --popover-foreground: 85 30% 96%; + --primary: 85 75% 55%; + --primary-foreground: 85 20% 8%; + --secondary: 85 25% 18%; + --secondary-foreground: 85 30% 96%; + --muted: 85 20% 20%; + --muted-foreground: 85 20% 70%; + --accent: 85 70% 50%; --accent-foreground: 0 0% 100%; - --destructive: 0 85% 70%; + --destructive: 0 85% 65%; --destructive-foreground: 0 0% 100%; - --border: 215 20% 25%; - --input: 215 20% 25%; - --ring: 210 100% 65%; - --chart-1: 210 100% 65%; - --chart-2: 200 100% 60%; - --chart-3: 220 90% 70%; - --chart-4: 190 100% 65%; - --chart-5: 230 90% 60%; + --border: 85 25% 22%; + --input: 85 25% 22%; + --ring: 85 75% 55%; + --chart-1: 85 75% 55%; + --chart-2: 85 70% 50%; + --chart-3: 85 80% 45%; + --chart-4: 85 85% 40%; + --chart-5: 85 90% 35%; --line-number-color: rgba(255, 255, 255, 0.1); } } + @layer base { * { @apply border-border;