Category Configuration & Automatic Pagination

In a B2B export catalog, structured category navigation serves as the primary compass guiding foreign engineers to the exact component they need.

If hundreds of varied bolts, seals, and dampers are dumped into a single generic list, bounce rates skyrocket. SymbolFlow Appsuite provides a purpose-built Offering Categories architecture. Operators can create new categories at any time and assign products across multiple classifications. Crucially, upon site build, the engine automatically generates dedicated category landing pages with responsive pagination and structured SEO data!

---

1. Core Architecture & Architectural Advantages

Core Feature	Traditional Platform Pain Point	Appsuite Automated Engine
Multi-Category Assignment	Restricts items to a single primary category, capping search discovery	Native Many-to-Many (hasMany: true): A single product can belong to multiple categories simultaneously
Category Page Assembly	Requires manually creating pages and dropping in collection widgets	Zero-Configuration Static Generation: The compiler builds dedicated category index pages automatically
High-Volume Pagination	Giant unwieldy pages causing browser lag, or buggy third-party plugins	Automated Static Pagination: Calculates page counts and compiles /page/2, /page/3 with clean navigation controls
SEO Authority Flow	Category pages lack dedicated metadata, treated as thin pages	Automated Category SEO: Injects localized category titles, breadcrumb paths, and JSON-LD schema

---

2. Step 1: Creating & Managing Offering Categories

Categories are configured in the dedicated Offering Categories (商品/服务分类) collection:

Step-by-Step Instructions:

1. Log into Payload CMS;
2. Under Collections in the left sidebar, click Offering Categories (商品/服务分类);
3. Click the Create New button in the top-right corner;
4. Configure the core fields:
   • Title: Category display name (localized for en and zh).
     • In English mode: Cylindrical Rubber Mounts
     • In Chinese mode: 圆柱形橡胶减震器
   • Slug: The unique lowercase URL path identifier.
     • Example: cylindrical-rubber-mounts
5. Click Save in the top-right corner.

[!TIP] SEO Naming Best Practice: Always keep slugs strictly lowercase with hyphens (e.g. marine-vibration-isolators). This produces human-readable URLs that Google algorithms use as primary topical signals.

---

3. Step 2: Assigning Products to One or Multiple Categories

Once categories exist, assign them when creating or editing items in the Offerings collection:

Step-by-Step Instructions:

1. Navigate to Offerings (商品/服务) in the sidebar and open your target product (such as our benchmark VD Cylindrical Rubber Vibration Damper);
2. Locate the Categories relationship field;
3. This is a multi-select relationship (hasMany: true). You can select multiple categories matching the product’s engineering scope:
   • Category 1: Cylindrical Rubber Mounts (Mechanical profile)
   • Category 2: HVAC Vibration Isolators (Target industrial application)
   • Category 3: Industrial Anti-Vibration Hardware (Broad catalog tier)
4. Click Publish to save changes.

Commercial Advantage of Multi-Category Assignment:

Whether an international buyer browses via “HVAC Components” or explores “Rubber Dampers”, your VD Damper appears prominently in both results. This multiplies buyer discovery touchpoints across your site.

---

4. Automated Category Pages & Static Pagination

When you trigger a site build (Build & Deploy) from the SymbolFlow Platform Dashboard, the Astro compiler executes the following automated pipeline:

1. Generating Dedicated Category URLs

Using your configured offeringType (default offerings) and the category slug, the compiler generates clean, localized paths:

• English category page: https://yourdomain.com/en/offerings/category/cylindrical-rubber-mounts
• Chinese category page: https://yourdomain.com/zh/offerings/category/cylindrical-rubber-mounts

2. Aggregating Assigned Products

The compiler gathers all offerings linked to the active category for the corresponding language, rendering them in a responsive industrial showroom grid (featuring primary photos, titles, spec chips, and starting prices).

3. Automated Static Pagination

To ensure lightning-fast page loads worldwide, the system chunks long catalog lists:

• When the total number of products in a category exceeds the page limit (OFFERINGS_PER_PAGE), the compiler generates numbered sub-routes:
  • Page 1: /offerings/category/cylindrical-rubber-mounts
  • Page 2: /offerings/category/cylindrical-rubber-mounts/page/2
  • Page 3: /offerings/category/cylindrical-rubber-mounts/page/3
• A standardized pagination bar (Previous, Next, Numbered Pages) is injected automatically at the bottom.

4. Sidebar Taxonomy Navigation

Every category landing page includes a contextual sidebar or filter bar listing all active categories in the current language, highlighting the currently selected category so buyers can pivot between lines effortlessly.

---

5. Operational Best Practices & Stability Rules

1. Category Deletion Caution: If a category contains live products and has already been indexed by Googlebot, never delete it casually. Deleting an active category will return 404 errors for the category URL and its paginated sub-paths. If a category must be deprecated, configure a 301 redirect rule in Cloudflare.
2. Translate Category Titles in Each Locale: Offering category titles are natively localized. Remember to switch between English (en) and Chinese (zh) in Payload CMS to provide native terms for each market.