BallinKit Docs
Back to Site

Admin Panel — Creating & Managing Products

The KIT Designer Admin Panel is accessible from the KIT Designer menu in your WordPress admin sidebar. It contains all tools for configuring customizable products, managing fonts, reviewing orders, setting pricing rules, and controlling the licensing status of the plugin.

Navigating the Admin Panel

After plugin activation, the following sub-menus appear under KIT Designer:

  • KIT Designer — Dashboard overview with quick-access links
  • Setup Status — Wizard showing WooCommerce and license readiness
  • Categories — Manage product template categories
  • Products — Manage customizable product configurations (kit_product CPT)
  • Fonts — Upload and manage custom fonts for the designer
  • Orders — View customizer order designs and download print files
  • Assets — Browse and manage uploaded garment/pattern assets
  • Pricing Rules — Configure feature-based, view-based, and area-based pricing
  • Settings — Set API URL, API Secret, cache directories, and studio theme mode
  • Licensing — Activate / deactivate the plugin license key
  • Templates — Create and manage pre-made design templates (kit_template CPT)
  • Saved User Designs — Browse all designs saved by customers (kit_design CPT)

Step 1: Create a Category (Optional)

Navigate to KIT Designer > Categories to create product categories (e.g. jersey, t-shirt, cap). Categories act as configuration groups for the designer canvas. Each category can define different view presets and canvas settings.

Step 2: Create a Customizable Product Configuration

Navigate to KIT Designer > Products > Add Customizable Product. This creates a kit_product custom post type entry that stores the full designer canvas configuration.

General Settings

  • Display Name: User-friendly designer header title shown in the studio (e.g. "My Sports Jersey")
  • Category Configuration: Select the product category — views and initial setups change based on this selection
  • Enable Views: Check the views that will appear in the designer. Available views are:
    • Front View
    • Back View
    • Top View
    • Side View
    • Left Sleeve View
    • Right Sleeve View
    • Left Side View
    • Right Side View
    • Bottom View
    Quick presets are available: Multi-Print Preset (Front, Back, Left & Right Sleeve) and Front & Back Only.

Per-View Configuration

For each enabled view, configure the following:

  • Base Image: Upload the garment/product image for this view. Selected from WordPress Media Library (filtered to kit-uploads folder). The base image defines the background canvas for the designer.
  • Color/Pattern Image: Upload an optional color mask or pattern overlay image. This image is colorized or composited over the base for the selected garment color.
  • Canvas Print Boundaries: Define the X, Y, Width, Height (in inches) of the printable area. This boundary restricts where customers can place text and graphics.
  • Patterns: Upload multiple pattern images per view. Each pattern has a label and color swatch for the customer to select.

Color Configuration

  • Define garment color swatches with Hex value and Label
  • Set the Default Color for the canvas on load
  • Toggle Allow Custom Color (yes/no) — enables a color picker for customers to choose any hex color

Step 3: Link to a WooCommerce Product

Once the kit_product configuration is saved, link it to a WooCommerce product:

  1. Open or create a WooCommerce product (Products > Add New or Edit).
  2. In the Product Data panel, look for the KIT Customizer meta box.
  3. Select the kit_product configuration from the dropdown.
  4. Configure per-product pricing strategy and overrides (see Pricing Rules).
  5. Save/publish the product.

The Products list in the admin panel shows each kit_product with its linked WooCommerce products, configured views, color swatches, and a direct Edit link.

Variable Products Support

BallinKit supports WooCommerce variable products. You can link one kit_product configuration to a WooCommerce variable product and the designer will load the matching configuration for the selected variation. This is useful for size/color variants that share the same canvas layout but have different base images.

Product Configuration Data Storage

The full configuration (views, colors, patterns, boundaries) is stored as a serialized PHP array in the _kit_product_config post meta of the kit_product post. WooCommerce products and variations reference it via the _kit_product_id post meta key, which stores the kit_product post ID.

Previous First Setup Next Asset Layers