WebTend Service Catalog Builder

01 — Introduction

What is WebTend Service Catalog Builder?

WebTend Service Catalog Builder gives service-based businesses everything they need to showcase their offerings, present pricing plans, and capture qualified leads — all in one lightweight, self-hosted plugin. No SaaS subscriptions, no phone-home, no third-party dependencies beyond WordPress itself.

The plugin ships with a custom Services post type, a visual Pricing Table builder, an Inquiry Form with spam protection and email notifications, Gutenberg blocks, Elementor widgets, and shortcodes for any page builder.

🗂️

Services CPT

Custom Post Type with categories, tags, icon support (image / SVG / font class), gallery, features list, FAQ accordion, and related services.

Free

💰

Pricing Table Builder

Visual drag-and-drop plan builder with monthly/annual billing toggle, highlighted plan styling, feature comparison, and custom CTAs.

Free

📬

Service Inquiry Form

AJAX form with honeypot spam protection, budget range selector, email notifications with Reply-To, and full DB submission log.

Free

🔌

Gutenberg + Elementor

Native Gutenberg blocks and Elementor widgets for Services Grid, Pricing Table, and Inquiry Form. Shortcodes work with any page builder.

Free

🔍

SEO & Schema Markup

Automatic JSON-LD schema.org/Service and FAQPage markup. SEO-friendly customisable URL slugs per service.

Free

🛒

WooCommerce Integration

Optionally link any service to a WooCommerce product for live price display and a Buy button — activates only when WC is installed.

Free

wp-admin → Service Builder → Dashboard

🗂️

Services CPT

Custom post type with full meta

Active Add New →

💰

Pricing Builder

Drag-and-drop plan builder

Active Manage →

📬

Inquiries

3 new submissions

Active View →

02 — Requirements

System Requirements

WebTend Service Catalog Builder is lightweight with minimal hard dependencies. Elementor and WooCommerce are both optional — the plugin fully works without them.

Component	Minimum	Recommended
WordPress	6.2	7.0
PHP	7.4	8.2+
MySQL / MariaDB	5.6 / 10.0	8.0 / 10.6
Elementor	Optional — Free or Pro	Latest stable
WooCommerce	Optional — any version	8.0+
Browser (admin)	Chrome 90+, Firefox 88+, Safari 14+	Latest stable

🎨

Elementor

Free & Pro — optional

📦

Gutenberg Blocks

WordPress core, no plugin needed

🛒

WooCommerce

Optional product linking

🏗️

Classic & Block Themes

All theme types

🔄

WPML / Polylang

Translation ready

⚡

Any Page Builder

Via shortcodes

03 — Installation

Installation

Method A — WordPress Plugin Directory (Recommended)

1

Search in WordPress Admin

Go to Plugins → Add New and search for WebTend Service Catalog Builder or webtend-service-catalog-builder.

2

Install & Activate

Click Install Now on the plugin card, then click Activate. The plugin creates its database table and flushes rewrite rules on first activation.

3

Create Your First Service

Navigate to Service Builder → Add New Service in the admin menu to create your first service entry.

Method B — Manual Upload

1

Download & Upload

Download webtend-service-catalog-builder.zip from wordpress.org/plugins. Go to Plugins → Add New → Upload Plugin and install the ZIP.

2

Activate

Click Activate Plugin. You will see the Service Builder menu appear in your WordPress admin sidebar.

3

Re-save Permalinks

Go to Settings → Permalinks and click Save Changes to ensure service URLs work correctly.

💡

Template overrides Copy any file from plugins/webtend-service-catalog-builder/templates/ into {your-theme}/webtend-service-catalog-builder/ and edit freely. Your changes survive plugin updates.

04 — Quick Start

Quick Start

After activation you will find Service Builder in your WordPress admin menu. Follow this order to get your service catalog live in minutes.

Go to Service Builder → Add New Service and create your first service with a tagline, icon, and feature list
Go to Service Builder → Pricing Tables and build a pricing table with 2–3 plans using the visual builder
Attach the pricing table to your service in the Service Details meta box
Add the [wscb_services] shortcode (or the Gutenberg block) to any page to display the services grid
Embed [wscb_pricing_table id="X"] on your pricing page
Configure notification email in Service Builder → Settings → Inquiry Form

✅

No WooCommerce? No problem. The plugin works completely independently of WooCommerce. The WooCommerce integration activates automatically only when WC is installed and active — you never need to configure it manually.

05 — Feature

Services Custom Post Type

The plugin registers a wscb_service Custom Post Type with full meta box support. Each service has its own URL (/services/web-design/), archive page, and single template — all overridable from your theme.

Service Meta Fields

Field	Description	Example
Short Tagline	One-line description shown on cards and schema markup	Professional web design for modern brands
Duration / Delivery Time	Estimated project timeline shown on the card	2–4 weeks
Starting Price Label	Display price text — freeform, not connected to WooCommerce unless linked	From $299
CTA Button Text	Default: "Learn More". Overridable per-service or via shortcode	Get Started
CTA Button URL	URL for the CTA — falls back to the service permalink	https://example.com/contact
Service Icon	Image upload, inline SVG code, or icon font class (e.g. dashicons-admin-site)	SVG / image / font class
Feature List	Repeatable bullet rows with configurable icon style (check, star, bolt, etc.)	Up to 4 shown on card
Gallery	Multi-image gallery via WP Media Library	portfolio shots, process images
FAQ Accordion	Repeatable Q&A pairs — rendered as an accordion with FAQPage schema	How long does it take? / 2–4 weeks
Related Services	Multi-select of other services to display in the "You may also like" section	—
Linked Pricing Table	Attach a pricing table post to display on the single service page	ID of wscb_pricing_table post
WooCommerce Product	Link to a WC product for live price + Buy button (optional)	Product ID

Taxonomies

Taxonomy	Slug	Usage
Service Category	wscb_service_cat	Group services by type (Design, Development, Marketing, etc.)
Service Tag	wscb_service_tag	Cross-cutting labels (e.g. "Fast turnaround", "Enterprise ready")

💡

SVG security All SVG code entered in the Service Icon field is run through the built-in WSCB_SVG_Sanitizer class before saving. This strips disallowed elements and attributes to prevent XSS.

06 — Feature

Pricing Table Builder

Create pricing plans with a visual drag-and-drop interface. Each pricing table is a separate post type (wscb_pricing_table) that can be embedded on any page and attached to any service.

Plan Builder Features

Drag-and-drop reordering of plans
Monthly / Annual billing toggle with automatic savings badge calculation
Mark any plan as "Highlighted / Recommended" — gets accent styling automatically
Per-plan feature list with tooltip-ready rows
Feature comparison table across plans
Custom CTA per plan: open a URL or trigger the inquiry form for that plan

wp-admin → Service Builder → Pricing Tables → Edit

⠿

Starter

$299 / mo

⠿

Professional Recommended

$599 / mo

⠿

Enterprise

Custom pricing

07 — Feature

Service Inquiry Form

A fully self-hosted inquiry and lead capture form. Submissions are stored in a custom database table (wp_wscb_inquiries) and optionally emailed to your notification address. No third-party form plugins required.

Form Fields

Field	Required	Notes
Name	Yes	Stored as submitted
Email	Yes	Used as Reply-To in notification email
Phone	No	Optional contact number
Budget Range	No	Dropdown — configured in settings
Message	Yes	Free-text enquiry body
Service / Plan	Auto	Pre-filled from `service_id` and `plan_id` shortcode attributes
Honeypot	Hidden	Invisible field — bots fill it, humans don't. Submissions with a value are silently discarded.

Frontend — [wscb_inquiry_form service_id="12" plan_id="pro"]

Get in touch about Web Design — Professional Plan

Your Name *

Jane Smith

Email Address *

jane@example.com

Phone (optional)

+1 555 000 1234

Budget Range

$1,000 – $5,000 ▾

Message *

Hi, I'd like to discuss a redesign for our company website...

Inquiries Admin Panel

All submissions appear under Service Builder → Inquiries with status tracking (New / Read / Replied / Archived).

wp-admin → Service Builder → Inquiries

#	Name	Service	Plan	Budget	Date	Status
3	Jane Smith	Web Design	Professional	$1k–$5k	Today	New
2	Mark Owens	SEO Audit	Starter	Under $1k	Yesterday	Read
1	Lisa Chen	Branding	Enterprise	$10k+	2 days ago	Read

⚠️

AJAX submission only The inquiry form submits via AJAX — there is no full page reload. Ensure your theme does not disable wp_footer(), as the plugin enqueues its scripts there. Classic themes and all tested modern themes work correctly.

08 — Feature

Display Options

The plugin offers three ways to embed content — use whichever fits your workflow.

Gutenberg Blocks

Search for "WebTend" in the Gutenberg block inserter to find three native blocks:

Services Grid — filterable by category/tag, configurable columns and display options
Pricing Table — select any saved pricing table to embed it
Inquiry Form — select a service and optionally pre-select a plan

Elementor Widgets

When Elementor is active, three widgets appear in the WebTend widget category:

Services Grid Widget — same options as the Gutenberg block with live Elementor preview
Pricing Table Widget — select table by ID, toggle billing switch visibility
Inquiry Form Widget — embed form with service and plan pre-selection

✅

Elementor is optional Elementor widgets are loaded lazily — only when Elementor fires its elementor/loaded action. If Elementor is not installed, no Elementor code runs at all.

09 — Feature

SEO & Schema Markup

WebTend Service Catalog Builder outputs structured data automatically on every single service page. No Yoast or RankMath required — though both are compatible.

schema.org/Service

Injected into <head> on single service pages as a application/ld+json script block.

JSON-LD — Single Service Page

{
  "@context":    "https://schema.org",
  "@type":       "Service",
  "name":        "Web Design",
  "description": "Professional web design for modern brands",
  "url":         "https://example.com/services/web-design/",
  "serviceType": "Design, Development",
  "provider": {
    "@type": "Organization",
    "name": "Your Agency",
    "url":  "https://example.com"
  },
  "offers": {
    "@type":       "Offer",
    "description": "From $299"
  }
}

FAQPage Schema

If a service has FAQ accordion entries, a FAQPage schema block is also injected automatically — no configuration needed.

JSON-LD — FAQPage (auto-generated from FAQ accordion)

{
  "@context":   "https://schema.org",
  "@type":      "FAQPage",
  "mainEntity": [
    {
      "@type":  "Question",
      "name":   "How long does the project take?",
      "acceptedAnswer": {
        "@type": "Answer",
        "text":  "Typically 2–4 weeks depending on scope."
      }
    }
  ]
}

💡

Custom URL slug Change the URL base from /services/ to anything you like in Service Builder → Settings → General → Service URL Slug. After saving, go to Settings → Permalinks and click Save to flush rewrite rules.

10 — Feature

WooCommerce Integration

The WooCommerce integration is completely optional and activates automatically when WooCommerce is installed. No manual configuration is required to enable it.

Link any service to a WooCommerce product using the WooCommerce Link meta box on the service editor
The service card and single page display the product's live WooCommerce price automatically
A Buy button is shown alongside the regular CTA — clicking it adds the product to the WooCommerce cart
The integration registers a Service product type in the WC product editor, letting you mark products as services for organisation

ℹ️

Variable products When a linked WooCommerce product is variable, the Buy button links to the product page rather than adding directly to cart. Simple products add to cart directly from the service page.

11 — Reference

Shortcodes

All three shortcodes work in any editor — Gutenberg classic block, Elementor HTML widget, WPBakery, Divi, or the Classic Editor.

[wscb_services]

Display all published services in a responsive grid. Filter by category or tag, control columns, ordering, and which elements show.

categorySlug of wscb_service_cat. Comma-separated for multiple. Default: all

tagSlug of wscb_service_tag. Comma-separated. Default: all

columns2, 3, or 4. Default: 3

limitMax services to show. Default: -1 (all)

orderbymenu_order | date | title. Default: menu_order

show_excerptyes | no — show tagline/excerpt. Default: yes

show_priceyes | no — show price label. Default: yes

show_buttonyes | no — show CTA button. Default: yes

button_textOverride the CTA button text for all cards. Default: per-service value or "Learn More"

Examples


[wscb_services]


[wscb_services category="design" columns="2" show_price="no"]


[wscb_services limit="6" orderby="date"]

[wscb_pricing_table id="123"]

Embed a saved pricing table by its post ID. Get the ID from the URL when editing the pricing table: post=123.

idPost ID of the wscb_pricing_table post. Required.

[wscb_inquiry_form service_id="456"]

Embed the inquiry form. Pre-fills the service name and optionally pre-selects a pricing plan so the submission arrives with full context.

service_idPost ID of the service this form is for. Stored on the submission. Default: 0

plan_idSlug or ID of the pricing plan to pre-select. Default: empty

12 — Reference

All Settings

All settings are stored in a single wscb_settings option as a serialized array. Access them at Service Builder → Settings.

General

Setting	Key	Default
Service URL Slug	service_slug	services
Archive Page Title	archive_title	Our Services
Archive Grid Columns	archive_cols	3

Inquiry Form

Setting	Key	Default
Notification Email	inquiry_email	admin email
Email Subject	inquiry_subject	New Service Inquiry – {service_name}
Success Message	inquiry_success	Thank you! We'll be in touch within 24 hours.
Redirect After Submission	inquiry_redirect	empty (show success message)

Schema / SEO

Setting	Key	Default
Enable Service Schema Markup	schema_enable	Yes (1)
Service Provider Name	schema_provider	Site name from WordPress

💡

Reading settings programmatically

Use get_option( 'wscb_settings', array() ) to read all settings. Missing keys always return safe defaults. Use placeholders {service_name} and {plan_name} in the email subject line.

13 — Reference

Hooks & Filters

Extend or customise the plugin without editing core files. All hooks are documented below.

Filters

Hook	Arguments	Description
wscb_service_schema	`$schema`, `$post_id`	Modify the JSON-LD Service schema array before it is output to `<head>`. Return the modified array.
wscb_load_frontend_assets	`$load`	Return `false` to prevent frontend CSS/JS from loading on any given page. Useful for manual asset management.
wscb_after_service_cta	`$post_id`	Action fired immediately after the service CTA button is output on a service card. Use to append custom HTML (e.g., a wishlist button).

Actions

Hook	Description
wscb_inquiry_submitted	Fires after an inquiry is saved to the database. Passes `$inquiry_id`, `$data`.
wscb_before_services_grid	Fires before the services grid HTML is output. Passes `$atts` (shortcode attributes).
wscb_after_services_grid	Fires after the services grid HTML. Passes `$atts`.

Example: extend the Service schema

PHP — functions.php or custom plugin

/**
 * Add areaServed to the Service schema.
 */
add_filter( 'wscb_service_schema', function( $schema, $post_id ) {
    $schema['areaServed'] = get_post_meta( $post_id, '_service_area', true ) ?: 'Worldwide';
    return $schema;
}, 10, 2 );

Example: hook into new inquiry submissions

PHP — functions.php or custom plugin

/**
 * Send a Slack notification when a new inquiry arrives.
 */
add_action( 'wscb_inquiry_submitted', function( $inquiry_id, $data ) {
    $webhook = 'https://hooks.slack.com/services/YOUR/WEBHOOK';
    wp_remote_post( $webhook, [
        'body' => json_encode([
            'text' => 'New inquiry from ' . $data['name'] . ' — ' . $data['email'],
        ]),
        'headers' => [ 'Content-Type' => 'application/json' ],
    ]);
}, 10, 2 );

14 — Reference

Privacy & GDPR

The plugin is designed with privacy-first principles. All data stays on your server — nothing is sent to Webtend or any third-party service.

Data collected by the Inquiry Form

Data Field	Purpose	Stored Where
Name	Identify the submitter	`wp_wscb_inquiries`
Email address	Reply-To on notification; contact	`wp_wscb_inquiries`
Phone number	Optional contact number	`wp_wscb_inquiries`
Budget range	Project scoping	`wp_wscb_inquiries`
Message	Inquiry content	`wp_wscb_inquiries`
IP address	Basic spam/abuse mitigation	`wp_wscb_inquiries`
Service ID & Plan ID	Context for the inquiry	`wp_wscb_inquiries`

🔒

WordPress Privacy Tools integrated All personally identifiable fields are registered with WordPress's built-in Personal Data Export and Personal Data Erase tools (Settings → Privacy). Erasure anonymises identifying fields (name, email, phone, IP) while retaining the record for statistics.

⚠️

Add to your Privacy Policy Mention in your site's Privacy Policy that you collect name, email, phone, budget, and message data via the service inquiry form, and that this data is stored on your server and used only to respond to the enquiry.

15 — FAQ

Frequently Asked Questions

Does this work without Elementor?

Yes, completely. Elementor is optional. The plugin provides Gutenberg blocks and shortcodes that work with any page builder or the classic editor. Elementor widgets are loaded lazily and only when Elementor is detected.

Does this work without WooCommerce?

Yes. WooCommerce integration is optional. The WooCommerce-specific class is included only when WooCommerce is installed. All core features — services, pricing tables, inquiry forms, schema markup — work without WooCommerce.

Can I customise the service and pricing templates?

Yes. Copy any file from plugins/webtend-service-catalog-builder/templates/ into {your-theme}/webtend-service-catalog-builder/ (creating the folder if it does not exist). Your copied file takes precedence and will not be overwritten by plugin updates.

How do I change the /services/ URL slug?

Go to Service Builder → Settings → General and update the Service URL Slug field. After saving, go to Settings → Permalinks and click Save Changes (even without making a change) to flush WordPress's rewrite rules and make the new slug active.

Where are inquiry submissions stored?

Submissions are stored in a custom database table named {prefix}_wscb_inquiries, created on plugin activation using dbDelta(). They are visible under Service Builder → Inquiries and are included in WordPress's Personal Data Export/Erase tools.

Is the plugin translation ready?

Yes. All user-facing strings use the webtend-service-catalog-builder text domain and a .pot file is included. Load your translation files via the standard load_plugin_textdomain() path, or use Loco Translate / WPML's translation tools.

What happens to data when the plugin is uninstalled?

The uninstall.php file removes the wscb_settings option and drops the wp_wscb_inquiries table when the plugin is deleted via the Plugins screen. Deactivating (without deleting) does not remove any data.

How do I get support?

Free support is available on the WordPress.org support forum. Please include your WordPress version, PHP version, active theme name, and a clear description of the issue when posting.

16 — Changelog

Changelog

v1.0.0

June 2026

Initial Release

Initial release — WebTend Service Catalog Builder for Elementor

Services CPT — custom post type with categories, tags, icon (image/SVG/font), gallery, feature list, FAQ accordion, and related services

Pricing Table Builder — drag-and-drop visual plan builder with monthly/annual toggle, highlighted plan, feature comparison, and per-plan CTAs

Service Inquiry Form — AJAX submission, honeypot spam protection, budget selector, email notifications with Reply-To, full DB log

Gutenberg blocks — Services Grid, Pricing Table, Inquiry Form blocks registered via register_block_type

Elementor widgets — Services Grid Widget, Pricing Table Widget, Inquiry Form Widget (lazy-loaded)

Shortcodes — [wscb_services], [wscb_pricing_table], [wscb_inquiry_form] with full attribute support

Schema markup — automatic JSON-LD schema.org/Service and FAQPage output on single service pages

WooCommerce integration — optional product linking with live price and Buy button (auto-detected)

SVG sanitizer — built-in SVG sanitization for service icon uploads

Privacy / GDPR — Personal Data Export and Erase integration; no data sent to external services

Template override — copy templates to {theme}/webtend-service-catalog-builder/ to customise

Translation ready — full .pot file included, text domain webtend-service-catalog-builder

GPL v2 licensed — no SaaS dependencies, no phone-home, fully open source

WebTend — Service Catalog Builderfor Elementor

What is WebTend Service Catalog Builder?

System Requirements

Installation

Method A — WordPress Plugin Directory (Recommended)

Search in WordPress Admin

Install & Activate

Create Your First Service

Method B — Manual Upload

Download & Upload

Activate

Re-save Permalinks

Quick Start

Services Custom Post Type

Service Meta Fields

Taxonomies

Pricing Table Builder

Plan Builder Features

Service Inquiry Form

Form Fields

Inquiries Admin Panel

Display Options

Gutenberg Blocks

Elementor Widgets

SEO & Schema Markup

schema.org/Service

FAQPage Schema

WooCommerce Integration

Shortcodes

All Settings

General

Inquiry Form

Schema / SEO

Hooks & Filters

Filters

Actions

Example: extend the Service schema

Example: hook into new inquiry submissions

Privacy & GDPR

Data collected by the Inquiry Form

Frequently Asked Questions

Changelog

WebTend — Service Catalog Builder
for Elementor