Introduction

Komper turns any set of products into a responsive comparison table. Create categories, define the specification fields you want to compare (up to 11 field types — text, number, rating, yes/no, URL, image, and more), add products and values, then render comparisons anywhere on your site via shortcodes, a Gutenberg block, or a widget.

The plugin ships with WordPress-native REST endpoints, WooCommerce integration, import/export in JSON & CSV, and seven pre-built table templates — all styled with a scoped, prefixed Tailwind build so there are zero conflicts with your theme.

Installation

1. Buy a licence from the Vnetware storefront — you'll get the plugin zip and a licence key by email.
2. In WordPress, go to Plugins → Add New → Upload Plugin and choose the downloaded zip.
3. Activate the plugin. A new Komper item appears in the admin sidebar.
4. Open Komper → License and paste your licence key — see the next section.

Activating your license

1. Open Komper → License in the WordPress admin.
2. Paste the key we emailed you (KOMPER-XXXX-XXXX-XXXX-XXXX) and click Activate.
3. You'll see the status change to Active, along with plan, expiry and remaining site slots.

Each licence activates on a limited number of sites. Moving the plugin to another domain? Click Deactivate first to free the slot — or from the Vnetware customer dashboard go to Licenses → {your licence} → Deactivate. Activations are URL-based, so https://WWW.Example.Com/ and https://example.com are treated as the same site.

Periodic verification

Once per day the plugin pings the licence server to confirm the key is still valid. If the server is unreachable, the plugin stays active for a 72-hour grace period so your site never breaks because of an outage on our end.

Quick start

A brand-new install takes about three minutes to get a comparison table on a page.

1. Create a category

Go to Komper → Categories. Add a category for your product family — "Laptops", "Smartphones", "Coffee Makers" — this becomes the scope for the fields that follow.

2. Add specification fields

Go to Komper → Fields, pick the category you just made, and add the things you want to compare: "RAM", "Screen Size", "Has Thunderbolt". Each row in the final table is one field. Reorder via drag-and-drop.

3. Add products

Go to Komper → Products, click Add Product, choose the category, give the product a name, thumbnail and summary, then fill in the values for each of the fields you defined. Duplicate existing products for variants.

4. Show the table

Edit any post or page and paste a shortcode, or drop the Gutenberg block — example:

[komper pid="1,2,3" category="1"]

Visit the page — your comparison table is live.

Shortcodes

Komper exposes three shortcodes. Use each on any page, post, or custom post type.

[komper] — comparison table

Renders a side-by-side table for the products you list.

[komper_form] — search/select form

A selector users interact with to build their own comparison.

[komper_products] — product gallery

Visual picker — either a thumbnail grid or a checkbox list.

Gutenberg block

In the block editor, search for Komper Comparison (or just "komper"). The block lives under Widgets. The sidebar Inspector Controls let you configure:

• Display type — table, search/select form, or product gallery.
• Category and Product IDs — same semantics as the shortcode parameters.
• Field IDs — restrict which fields show.
• Mode, Thumbnail, Columns, Orientation, Max/Min items, New window.

The block uses ServerSideRender, so the editor preview matches the frontend exactly.

Widget

Komper ships a classic WordPress widget — ideal for sidebars and footer widget areas. Find it under Appearance → Widgets as Komper and drop it into any widget zone.

Floating compare bar

The compare bar is a slim bar pinned to the bottom of every page. It displays the products the visitor has queued for comparison, persists the selection in localStorage, and gives a one-click Compare Now button.

It's enabled by default. To disable, toggle off Show compare bar in Komper → Settings.

Field types

Eleven field types cover almost every spec you'd want to compare.

Settings

Find them under Komper → Settings. Saving redirects back to the same page with a one-shot confirmation notice.

• Comparison URL slug — the base of the shareable comparison URL. Default: /compare/.
• Compare button text — override the text on every Compare button.
• Min / Max products — how many products can appear in a single comparison.
• Table orientation — vertical (fields as rows) or horizontal (fields as columns).
• Show compare bar — toggle the floating bar.
• Date format — passed to date_i18n() for date fields.
• Table template — pick one of the seven pre-built looks, or start from Default and extend with Custom CSS.
• Custom CSS — injected as an inline <style> block on pages that render Komper content.
• Ad placements (top, middle, bottom) — arbitrary HTML to inject around the table.
• Header scripts — snippet injected into wp_head (admins with unfiltered_html only).

Table templates

Seven ready-made looks for the comparison table. Switch between them instantly in Settings — there's a live preview at /{compare-slug}/preview/ (admin-only).

WooCommerce integration

When WooCommerce is active Komper automatically adds an Add to Compare button on every product page and shop archive. Clicking it pushes the product into the floating compare bar. No configuration is needed for the button itself — but you'll want to sync your WooCommerce catalogue into Komper so the table actually renders product rows.

Syncing a product

Komper exposes a REST endpoint that imports a WooCommerce product into a Komper category. Product name, slug, short description, and featured image are mirrored across; the WC product ID is stored on the Komper row so you can back-link later.

POST /wp-json/komper/v1/wc-sync
{
  "wc_product_id": 123,     // WooCommerce product ID
  "category_id": 1          // Komper category ID
}

Runnable straight from the browser console on any admin page:

fetch('/wp-json/komper/v1/wc-sync', {
  method: 'POST',
  headers: {
    'Content-Type': 'application/json',
    'X-WP-Nonce': komperAdmin.nonce
  },
  body: JSON.stringify({ wc_product_id: 123, category_id: 1 })
}).then(r => r.json()).then(console.log);

Re-running against the same WooCommerce product updates the existing Komper row — so it's idempotent.

Specification values (the field data) are entered manually in Komper — WooCommerce doesn't have structured spec fields; that's the whole point of Komper.

Import & export

Under Komper → Import / Export.

JSON (full backup)

Click Export JSON to download a full snapshot — categories, fields, products, and values. Import JSON adds everything from a JSON file into your current database (additive — nothing is overwritten).

CSV (per-category)

Export CSV writes a single category's products as a spreadsheet with one row per product and one column per field.

Import CSV (new in v2.2) accepts a CSV with the same shape — the first column Product Name is required, columns Product Image and Status are optional, and any remaining headers are matched case-insensitively to your category's field names.

Unknown columns are ignored; existing products are never overwritten.

REST API

All plugin operations are exposed via the WordPress REST API under /wp-json/komper/v1.

Admin writes require a WordPress nonce in the X-WP-Nonce header (Komper localises this as komperAdmin.nonce).

Updates

Once your licence is active Komper appears in the standard Plugins admin page whenever a new release is available — no extra updater plugin needed. Under the hood:

• Each time WordPress checks for plugin updates, Komper pings our server with the licence key + site URL.
• If a newer version is available, the server issues a one-time signed download URL valid for 24 hours.
• Clicking Update in WordPress downloads the signed zip and installs it as usual.

Plugins with an expired or missing licence still work — they just don't get update notifications.

FAQ

Will Komper conflict with my theme?

No. All CSS is prefixed (kp-*) and scoped to a .komper-scope wrapper, and Tailwind's preflight reset is disabled. Styles can't leak outside Komper's own markup.

Does it support jQuery-free themes?

Yes. The frontend JS is vanilla; the admin JS is also vanilla. jQuery is optional.

Can visitors build their own comparisons?

Yes — drop [komper_form] or [komper_products] on a page. Visitors tick products, click Compare Now, and land on /{compare-slug}/{category}/{ids}/.

Can I override the look of the comparison table?

Three ways: pick a different template in Settings, add Custom CSS there, or override the template file by copying it from templates/frontend/ into your theme under a komper/ folder (standard locate_template() override).

What happens when my licence expires?

The plugin keeps working. Only automatic updates stop — renew from your Vnetware dashboard to resume receiving new releases.

Where can I get support?

Open a ticket from your Vnetware customer dashboard and our team will get back to you by email.