CP Commerce Admin Applet

Purpose and Overview

The CP Commerce Admin Applet is the central backend for your entire Customer Portal (CP) — the front-facing website and mobile app where your end-customers browse products, place orders, book events, and interact with your brand.

Instead of relying on developers to push website changes, this applet gives Marketing, E-Commerce, and Operations teams direct control over what customers see, how they interact, and what they can do — all from a single administrative console.

Key Features Overview

Who Benefits from This Applet?

E-Commerce & Marketing Teams:

• Build and manage website layouts, banners, and menus without developer support
• Create dynamic forms and surveys for customer feedback
• Set up events, activities, and bookable facilities
• Launch targeted newsletter campaigns and push notifications

B2B Account Managers:

• Enforce corporate spending limits on wholesale customer accounts
• Control which portal content is visible to specific customer groups
• Manage user registrations and block problematic accounts

Operations & IT Admins:

• Configure shipping providers and delivery fee logic
• Manage iOS and Android app version requirements
• Set up third-party integrations (Google Analytics, reCAPTCHA, social logins)
• Generate digital signature key pairs for API security

Customer Support:

• Moderate product reviews and ratings before they go public
• View and manage submitted customer forms
• Block abusive or defaulting users from the portal

What Problems Does This Solve?

The Fragmented Portal Management Problem:

Managing an e-commerce customer portal traditionally requires:

• Developer involvement for every website layout change
• Separate tools for forms, surveys, and event bookings
• No centralized control over mobile app versioning
• Manual tracking of B2B spending limits
• Disconnected review moderation processes

The CP Commerce Admin Solution:

• Visual website management — Configure layouts, menus, and banners from one console
• Built-in form builder — Template and dynamic forms with submission tracking
• Integrated event engine — Calendar, facility, and activity booking all in one place
• Automated B2B controls — Spending limits auto-enforced at checkout
• Review moderation — Approve or reject customer reviews before they go live
• Mobile app governance — Force mandatory updates for outdated app versions
• One applet, complete control — No more switching between disconnected tools

Key Features Overview

Key Concepts

Understanding the CP Commerce Framework

The CP Commerce Admin controls the admin-side configuration that drives what customers see on the Customer Portal (the front-end).

The CP Commerce Hierarchy

CP Commerce Admin Applet
│
├── Website (Core entity)
│   ├── Details (branch, pricing, merchant, menus, shipping config)
│   ├── App Version (iOS / Android)
│   ├── Manage Image (website image library)
│   ├── Digital Signature (API key pairs)
│   ├── Post Registration Config
│   ├── 3rd Party Auth Config (Google, Facebook, Apple, etc.)
│   ├── Layout Instance (website page builder)
│   ├── Reviews (Review Settings + Review Votes)
│   ├── Menu List (navigation menu builder)
│   ├── Country Config (locale, language, settlement methods)
│   ├── Label List (content classification tags)
│   └── Content Category
│
├── Shipping Provider (3PL integration)
├── Rating (star ratings management)
├── Review (review moderation)
├── Users (portal user management)
├── Newsletter Topic (email campaign topics)
├── Notification (push notifications)
├── Template Form (reusable form templates)
├── Dynamic Form (survey/questionnaire builder)
├── Submitted Form (form response inbox)
├── Spending Limit (B2B budget controls)
├── Blocked Customers (blacklist management)
├── Facilities (bookable spaces)
├── Activity (programs/classes within facilities)
├── Activity Category (grouping for activities)
├── Calendar (admin calendar view)
├── Events (event management)
└── Schedule (scheduler view)

The “Golden Chain” of Website Setup

Before a customer can use your portal, three things must be linked correctly:

1. Website → Branch → Merchant — The storefront must know which branch and merchant entity it belongs to.
2. Website → Pricing → Pricebook — The system must know how to price items (Pricing Scheme, Entity Pricing, or Ecomsync by Branch).
3. Website → Layout → Menu — The visual structure (which pages to show, which navigation menus to use) must be configured.

Quick Start Guide

Get up and running quickly with these essential workflows.

For E-Commerce Admins: Launch Your First Website

Goal: Create and publish a basic Customer Portal website.

1. Navigate to the Website section from the sidebar (default landing page)
2. Create Website: Click "+" → Enter Website Title (e.g., “My Brand Store”) → Select Branch → Choose Pricing Model → Select Membership Class → Click Create
3. Configure Details: In the edit view, assign:
   • Top Menu, User Menu, Left-side Menu, Bottom Menu
   • Default Layout Routing (the homepage layout)
   • Default Authentication Portal
   • Content Category
   • Sales Order Printable Format
4. Build Layout: Go to the Layout Instance tab → Click "+" to create your first page layout → Use the Website Builder button to visually design the page
5. Set Up App Versions (if mobile): Go to App Version tab → Add iOS and Android version entries
6. Publish: Set Status to Active → Click Save

What happens next? Your Customer Portal is now live and accessible to customers. They can browse, register, and place orders based on your layout and pricing configuration.

Pro Tip: Enable “App Version Update Check” checkbox and set the App Store URLs to auto-prompt users with outdated mobile apps to update.

For Marketing Teams: Create a Customer Survey

Goal: Build a dynamic form, publish it to the portal, and review submissions.

1. Navigate to Dynamic Form from the sidebar
2. Create: Click "+" → Enter form title (e.g., “Customer Satisfaction Q1”)
3. Add Questions: Open the form → Go to the Question tab → Add questions (text, multiple choice, dropdown, file upload)
4. Review Responses: When customers submit, their answers appear in the Response tab
5. Or use Template Forms: Navigate to Template Form to create reusable form templates with managed images

What happens next? The form is available on the Customer Portal. As customers submit, you can view, filter, and export their responses from either the Response tab within the Dynamic Form or from the Submitted Form section in the sidebar.

For Operations: Set Up a Shipping Provider

Goal: Connect a delivery service so customers see shipping options at checkout.

1. Navigate to Shipping Provider from the sidebar
2. Create: Click "+" → Enter provider name (e.g., “J&T Express”)
3. Configure Edit View:
   • Main Details tab: Set provider type (Flat Rate or Table Rate)
   • Table Rate tab (if applicable): Define rates by weight, destination, or order value
   • API Details tab: Enter the provider’s API credentials for real-time rate calculation
4. Link to Website: Go back to the Website Edit → Check “Enable Shipping Fee Process” → Select the Shipping Fee Option → Choose Shipping Price Book or set a delivery charges item code

What happens next? Customers see delivery options and rates at checkout. The system calculates costs based on your configured rules.

The Webstore Management Dashboard

Goal: Provide Store Managers a unified, simplified front-end console to configure their website without needing to navigate the complex backend ERP menus.

When an administrator clicks the Website Builder button from the backend (or navigates to https://[your-store-url]/page/website-builder/layout-menu/webstore), they are greeted by the Webstore Management Dashboard.

This dashboard acts as an aggregated shortcut center, presenting the most critical e-commerce configuration tools as large, easy-to-click tiles.

The 10 Dashboard Tiles

Dashboard Access Controls & Visibility

Not every store employee should have access to the entire Webstore Dashboard.

To enforce Role-Based Access Control (RBAC) or to simply declutter the interface for smaller stores, super-administrators can hide specific tiles from the frontend dashboard.

To hide a tile:

1. Navigate to the Website Edit > Details tab in the backend CP Commerce Applet.
2. Scroll down to the Hide Website Builder Elements section.
3. Check the respective boxes (e.g., Hide Voucher Management or Hide Image Manager).
4. Save the website configuration. The specified tiles will immediately vanish from the frontend Webstore Dashboard for all managers.

Website Management (website route)

Website Listing

The default landing page of the applet. Shows all configured website/storefront entities.

Listing View:

• Each row = one website entity
• Key columns: Website Code, Website Title, Status
• Click any row to open the edit view

Website Create

Creating a new website — Field-by-Field Guide:

After clicking Create, you are taken to the full edit view with many more fields and tabs.

Website Edit — Tabs Overview

When you select a website to edit, you’ll see the full configuration panel with the following tabs:

Details Tab (Deep Dive)

This is the most field-heavy tab. Here’s the full configuration:

App Version Tab (Deep Dive)

Manages iOS and Android mobile app version tracking with two sub-tabs:

Creating an App Version Entry:

Manage Image Tab (Deep Dive)

The Manage Image tab serves as the central asset library for your storefront. Here, you upload and organize specifically formatted images that are later referenced in branding, layout banners, and product displays.

Image Listing Grid:

Digital Signature Tab

Generate and manage cryptographic key pairs (RSA/DSA) used to digitally sign API requests between the Customer Portal and external ERP systems. This ensures data integrity and authenticity.

Post Registration Config Tab

What is Post Registration Config?

This tab controls what happens automatically the moment a new customer completes their registration on the Customer Portal. Instead of manually creating records in multiple applets, you can configure the system to handle onboarding steps instantly — adding the user to your tenant, creating a customer record, or setting up their membership.

Post Registration Config — Fields:

3rd Party Auth Config Tab

Centralize all external API integrations for authentication, security (reCAPTCHA), and analytics. Each provider has its own sub-tab:

Layout Instance Tab

The Layout Instance tab is the control center for your site’s pages. A “Layout Instance” represents a specific page (e.g., Homepage, About Us, Landing Page).

Layout Instance Edit — Tabs:

When you open a layout instance, you’ll see 4 tabs:

Create Form Fields:

How the Visual Website Builder Works

Accessible via the Website Builder button in the header, this drag-and-drop environment allows you to design your pages using a hierarchical node system:

1. Rows: Horizontal containers that define the page flow.
2. Columns: Vertical dividers inside rows to control content width.
3. Widgets: Functional UI components (Product Sliders, Banners, Form Embeds).

Configuration Palette:

• Elements Palette (Left): Drag Rows, Columns, and Widgets onto the canvas.
• Interactive Canvas (Center): Rearrange elements visually.
• Properties Panel (Right): Configure the specific settings for the selected element.

Widget Reference Guide

Below is the complete catalog of all available widgets, organized by category. When configuring a node as a Widget, select the appropriate Widget ID from the dropdown and configure its parameters.

🏗️ Structure & Header Widgets

🛍️ Product Display Widgets

🧭 Navigation & Menu Widgets

🛒 E-Commerce Workflow Widgets

👤 User Account & Membership Widgets

📋 Form & Interaction Widgets

Menu List Tab

What is the Menu List Tab?

This tab manages the navigation structures used across your storefront — the top menu bar, user dropdown, sidebar, and footer links. Menus created here are referenced by the Generic Header, Vertical Menu, Horizontal Menu, and Footer widgets in Layout Instance.

Creating a Menu:

Menu Item Edit — Tabs:

Each individual menu item (link) within a menu has its own edit view with 2 tabs:

Posts Tab

What is the Posts Tab?

Posts are your website’s content entries — blog articles, news items, brand stories, FAQs, and announcements. These are the “static pages” that layout widgets reference to display non-product content on the storefront.

Creating a Post:

Post Edit — Tabs:

User Agreement Tab

What is the User Agreement Tab?

This is your central repository for legally binding documents — Privacy Policies, Terms & Conditions, Data Protection Agreements — that customers must agree to when registering or making purchases on the portal. Beyond storage, this tab gives you a full audit trail: you can see exactly who agreed to which version of a document, when they agreed, and how (IP address, consent method).

Creating an Agreement Document:

Editing an Agreement — Tabs:

When you open an existing agreement document, you’ll see 2 tabs:

Agreed Users Tab

This tab provides the compliance proof you need. It shows a searchable grid of every portal user who has accepted this specific agreement document:

Reviews Tab

What is the Reviews Tab?

This tab configures the rules and settings for how the product review system works on your storefront — whether reviews need admin approval, minimum character counts, and how the “helpful” voting system operates.

Label List Tab

What is the Label List Tab?

Labels are classification tags used to organize and filter content across your website. They power the “Category Group” dropdowns in product widgets and the “Content Category” filters in post listings. Labels can also be hierarchical — a parent label can have child labels for multi-level categorization.

Creating a Label List:

Label List Edit — Tabs:

Content Category Tab

Define logical groupings for products and posts to enable organized browsing.

Account Tab

What is the Account Tab?

This tab controls which customer accounts (entities) are linked to your website. It works hand-in-hand with the “Restrict View/Access by Entity” setting in the Details tab — when that setting is enabled, only customers whose accounts are linked here can see and access the portal content.

Account Listing:

The listing shows all accounts currently linked to this website. Key columns:

Adding an Account (“Link to Website”):

Clicking the "+" button opens a selection grid showing all available accounts from your ERP system. You are selecting and linking an existing account — not creating a new one. Select the account row and click Add to link it to this website.

Viewing/Editing a Linked Account:

Clicking any account row opens a read-only detail view. All fields are view-only — account details are managed in the source applet (e.g., Customer Master), not here.

Unlinking an Account:

Click the Delete button in the account detail view to unlink (remove) the account from this website. This does not delete the account from the system — it only removes the website association.

Branch Tab

Manage the physical branch locations or pickup points linked to this specific digital storefront. Branches are created and managed in the Organisation Applet.

Region Tab

Define the geographical regions used for shipping calculation and content localization.

Country Tab

What is the Country Tab?

This tab allows you to configure country-specific settings for your storefront. If your portal supports customers from multiple countries, each country can have its own language options, payment methods, support contacts, and financial label configurations.

Country Edit — Tabs:

When you open a country record, you’ll see 5 tabs:

Voucher Management Tab

Link and manage discount vouchers and promotional coupons that customers can use during checkout. For full voucher configuration details, see the Voucher Management Applet.

Commission Scheme Tab

Define how sales commissions are calculated for agents or affiliates linked to this website. For full commission configuration details, see the Commission Scheme Applet.

Language Tab

Configure the multi-language support settings for the storefront Frontend.

Settlement Method Tab

Link the payment settlement gateways (Stripe, Bank Transfer, Card, etc.) available for this website’s checkout process. Settlement methods are configured in the Cashbook Applet.

Shipping Providers (shipping-provider route)

What are Shipping Providers?

This section lets you configure all the delivery options your customers see at checkout. Whether you use a flat fee, weight-based rates, or a real-time API from a logistics partner, each shipping option is set up here as a “provider method.”

Shipping Provider Types:

The edit view changes based on the provider type. There are 3 types, each with different configuration fields:

Type 1 — Flat Rate:

A single fixed delivery fee regardless of order weight or destination.

Type 2 — Table Rate:

Variable delivery fees based on weight, destination zone, or order value. Has 2 tabs:

Type 3 — Integration (API-driven):

Real-time rate calculation via a third-party logistics API (e.g., J&T Express, DHL). Has 2 tabs:

Dynamic Forms (dynamic-form route)

What are Dynamic Forms?

A built-in survey and questionnaire builder. You design questions, and customers fill in responses directly on the Customer Portal.

Dynamic Form Edit — Tabs:

Template Forms (template-form route)

Reusable form templates with built-in image management. Useful for creating standardized registration or feedback forms.

Template Form Edit — Tabs:

Submitted Forms (submitted-form route)

The central inbox for all customer form submissions across both Dynamic Forms and Template Forms. Admins can view, filter, export, and take action on submitted responses.

Events & Facilities Booking Engine

Manage events, facilities, activities, and calendar bookings directly within the CP Commerce Admin. For a dedicated events workflow with expenses, guest management, and advanced scheduling, see the Events Management Applet.

Facilities (facilities route)

Define bookable physical spaces or assets.

Facilities Edit — Tabs:

Activities (activity route)

Programs, classes, or services offered within a facility.

Activity Edit — Tabs:

Activity Categories (activity-category route)

Group activities into logical categories (e.g., “Fitness”, “Workshops”, “Consultation”). Helps customers filter and browse available programs.

Events (events route)

Create specific occurrences (e.g., “Summer Mega Sale Launch — July 15”).

Event Edit — Tabs:

Calendars (calendars route)

Admin calendar view for managing scheduled events and bookings.

Calendar Edit — Tabs:

Schedule (schedule route)

Scheduler view for visualizing bookings across facilities and time slots.

Spending Limits (spending-limit route)

What are Spending Limits?

Spending Limits are automated financial controls designed for B2B customer accounts. When a corporate customer’s purchasing manager tries to place an order that would exceed their company’s approved spending limit, the checkout is automatically blocked — preventing unauthorized overruns without manual finance intervention.

Real-World Scenario:

Company: XYZ Corp
Purchasing Manager: Ahmad
Spending Limit: RM 5,000 / 30 days

Scenario: Ahmad's cart totals RM 6,200
Result: Checkout is BLOCKED — exceeds the 30-day spending limit
Action: Finance approves an exception, or Ahmad splits the order

If Ahmad exceeds the limit 3 times: His account is banned for the configured Ban Period

Spending Limit Edit — Fields:

Ratings & Reviews

Ratings (rating route)

Manage product/service star ratings submitted by customers.

Rating Edit — Tab:

Reviews (review route)

What is the Review section?

This is the global moderation queue where admins can create, view, and approve/reject customer product reviews before they appear on the Customer Portal. Unlike the Review Settings inside Website Edit (which configure rules), this section manages the actual review content.

Creating a Review (Admin-side):

Admins can manually create reviews on behalf of customers — useful for importing testimonials or seeding initial reviews for new products.

Review Edit — Tab:

Users (users route)

Portal user management — view all registered Customer Portal users.

Users Edit — Tab:

Blocked Customers (blocked-customers route)

Blacklist management — block abusive, fraudulent, or defaulting users from accessing the Customer Portal entirely.

Newsletter Topics (newsletter-topic route)

What are Newsletter Topics?

Newsletter Topics let you create topic-based mailing lists for your Customer Portal. Instead of sending every email to every customer, you define topics (e.g., “Weekly Deals”, “New Arrivals”, “Events”) and customers choose which ones to subscribe to.

Newsletter Topic Edit — Tabs:

Notifications (notification route)

What is the Notification section?

Send push notifications directly to Customer Portal mobile app users. Each notification can include a title, detailed content, images, and can be scheduled for future delivery — ideal for flash sale announcements, order status updates, or event reminders.

Notification Edit — Tabs:

Each notification can have Posts (sub-items) with their own tabs:

Configuration & Settings

Access via the Settings sidebar menu item.

Feature Visibility (Settings > Feature Visibility)

Toggle which features are visible/accessible in the applet. This is the default settings landing page.

Default Settings (Settings > Default Selection)

Set system-wide default values that auto-populate when creating new records.

Field Configuration (Settings > Field Settings)

Configure which fields are visible, required, or hidden across different forms in the applet.

Webhook (Settings > Webhook)

Configure outbound webhooks to notify external systems when events occur (e.g., new form submission, new review, new user registration).

Permission Management

Personalization

Access via the Personalization sidebar menu item.

Personal Default Settings (Personalization > Personal Default Selection)

Set your own personal default values. These only affect your account and override system defaults where applicable.

Sidebar (Personalization > Sidebar)

Customize which sidebar menu items you see. Hide sections you don’t use to declutter your workspace.

FAQ

Q: I created a website but customers can’t see it. What’s wrong? A: Check three things: (1) Status must be set to Active. (2) A Default Layout Routing must be assigned so the homepage has content. (3) The Branch and Merchant must be correctly linked.

Q: Can I have multiple websites for different countries or brands? A: Yes. Each website entity can be linked to a different branch, pricing scheme, and country configuration. Use the Country Config tab within each website to manage locale-specific settings.

Q: The mobile app is showing “Update Required” but my users already have the latest version. A: Go to Website Edit > App Version > iOS/Android. Ensure the Version Number exactly matches the semantic version submitted to the App Store / Play Store (e.g., “3.5.2” not “v3.5.2”). A mismatch triggers a false mandatory update prompt.

Q: How do Spending Limits affect regular B2C customers? A: They don’t. Spending Limits are designed for B2B Corporate customer groups only. B2C retail customers have no spending cap — their purchases are limited only by their payment method at checkout.

Q: I can’t see some sidebar menu items that other team members can see. A: Check two things: (1) Your Permission Set in Settings may not include access to those features. Ask your admin to verify. (2) Your Personalization > Sidebar settings may have those items hidden.

Q: How do I make a form available on the Customer Portal? A: Create the form in Dynamic Form or Template Form, add your questions, and the form automatically becomes accessible on the portal. The Submitted Form section in the sidebar collects all responses.

Q: What’s the difference between “Review” in the sidebar and “Reviews” tab inside website edit? A: The Review sidebar item is a global moderation queue for all product reviews across all websites. The Reviews tab inside Website Edit is for configuring review settings (rules, vote options) specific to that website.

Q: Customers report they can’t log in with Google on the portal. A: Go to Website Edit > 3rd Party Auth Config > Google Login and verify the OAuth Client ID and Secret are correctly configured and not expired. Also check that the redirect URI matches your portal domain.