SERPsKit Pricing Table – A Fully Responsive WordPress Plugin

SERPsKit Pricing Table is a WordPress plugin that gives you a single Gutenberg block with eight ready-made pricing table designs, full sidebar customization for every color, font, button, and icon, and responsive layouts that work on any theme without writing CSS.

What It Does

I built this plugin because pricing table plugins either look generic or need a page builder to change a button color. I needed different layouts for different projects. A clean blue table for one site. A Black Friday promo with dark backgrounds for another. A quantity slider for bulk service pricing on a third. No single plugin handled all of these.

SERPsKit Pricing Table is one block with eight designs. Insert it, pick a design, customize everything from the sidebar. No shortcodes. No separate settings page. Every element is controllable per block, per plan, per feature. The table inherits your theme’s font, fits your content width, and stacks on mobile.

See all pricing tables demo, as well as example: SERPsKit Pricing Table Design Demo

The Eight Designs

1. Shape Top + CTA

Three columns with a colored shape bar at the top. Plan name, subtitle, monthly/yearly price with switchable suffix, “Get Started” button, features with icons, and a “More details” CTA at the bottom. The toggle switches both price and suffix text (e.g., “per year” to “lifetime”).

2. License Sizes

Three columns with a “Choose License Size” dropdown and billing toggle. Define sizes (1 Website, 3 Websites, etc.) and set per-plan prices for each. Visitors select a size and billing period, all prices update instantly. Supports strike-through prices and info lines. Built for selling plugins, themes, or per-site licensed products.

3. Black Friday

Three columns on dark backgrounds with a bundled promo image, editable “BIG CHOICE & CRAZY DISCOUNTS” tagline, circular “BIG SALE” badge, and percentage text. Outlined white buttons. Promo section toggles on/off per plan. All text and colors customizable.

4. Quantity Slider

Three columns with a draggable horizontal slider above the cards. Define quantity stops (5, 10, 25, 50) with per-plan prices at each stop. A floating tooltip follows the thumb showing “10 Guest Posts” or whatever label you set. Prices update live as the visitor drags. Built for service businesses with variable-quantity packages.

5. Clean Blue

Three columns, minimal white and blue color scheme. Monthly/yearly toggle. Solid buttons. No strike-through prices, no info lines. Plan name, subtitle, price, features, button. Clean and professional without visual complexity.

6. Navy

Three columns inside a single unified card with no gaps. Dark navy highlighted column with green accent button. Button sits above the features list (reversed layout). Suits premium brand pages with density and contrast.

7. 4-Column

Variable 2, 3, or 4 columns inside an outer container card. Triangular “Most Liked” corner ribbon. Features listed before price (reversed order). Full-width buttons. Built for agencies and businesses with four or more tiers.

8. 2-Column Split

Two columns (40/60 width). Solid blue cards with pill-shaped plan name. Two separate feature columns per card for wider layouts. Rounded “Subscribe Now” button with configurable arrow icon. Pill badges (“MOST POPULAR”, “MOST VALUE”) in the top-right corner. Built for membership sites and two-tier pricing.

Also see: Amazon Affiliate Kit – Amazon Affiliate WordPress Plugin

Key Features

• Full Sidebar Customization: Every element is customizable from the block editor sidebar. Plan names, prices, buttons, features, icons, colors, font sizes, shadow, padding, gaps, corner radius, backgrounds. No CSS needed.
• Monthly/Yearly Billing Toggle: Sliding toggle that switches between two pricing options. Fully customizable: switch color, label colors, badge background and text color. The discount badge is display-only. You control both prices manually.
• Per-Feature Icons: Each feature has its own icon selector and color picker. 15 built-in SVG icons: check, circle-check, cross, circle-cross, star, heart, dot, arrow-right, chevron-right, plus, bolt, shield, crown, gift, rocket. Default icon color per plan, with per-feature overrides.
• Shadow and Outer Glow: One control panel for both effects. X/Y offset, blur, spread, opacity, color. Zero offset with blur for glow. Positive Y offset for drop shadow.
• License Size Selector (Design 2): Dropdown for visitors to choose site count. Combined with billing toggle, gives you a pricing matrix. Define sizes and prices from the sidebar.
• Quantity Slider (Design 4): Draggable slider with floating tooltip. Define stops with per-plan prices. Prices update in real time. Slider color and label customizable.
• Black Friday Promo (Design 3): Per-plan promo section with bundled image, tagline, badge, and percentage text. Toggle on/off per plan. Replace the image by swapping <code>assets/images/black-friday.webp</code>.
• Button Controls: Text, URL, background, hover color, text color, width, height, radius, font size. New tab and nofollow toggles. Design 1 has a separate CTA section with its own link and styling.
• Corner Ribbon (Design 7): Triangular ribbon in the top-right. Custom text and color per plan.
• Split Features (Design 8): Two separate feature editors per plan. Both columns stack on mobile.
• Responsive: All designs collapse to single-column below 900px. No configuration needed. Theme font inheritance. Fits any content container.
• Lightweight: CSS and JS load only on pages with the block. Frontend JS is 123 lines. No jQuery. No external libraries.

What You Get

• 8 unique pricing table designs in one Gutenberg block
• Monthly/yearly billing toggle with color controls
• License size selector with price lookup (Design 2)
• Quantity slider with live price updates (Design 4)
• Black Friday promo section with bundled image (Design 3)
• Corner ribbon badge (Design 7)
• Split feature columns (Design 8)
• Button with arrow icon (Design 8)
• 15 built-in SVG icons with per-feature selection
• Shadow and outer glow controls
• Per-plan button controls (URL, nofollow, new tab, colors, size)
• CTA section with separate styling (Design 1)
• Variable column count: 2, 3, or 4 (Design 7)
• Fully responsive
• Theme font inheritance
• Lifetime updates for the purchased version

Requirements

• WordPress 5.8+
• PHP 7.4+
• Gutenberg block editor (Classic Editor not supported)

Who This Is For

Anyone who needs pricing tables on WordPress without hiring a designer. SaaS products, plugins, consulting services, memberships, courses, or anything with tiered pricing.

Running Black Friday or holiday promotions? Design 3 is ready. Selling services in bulk quantities? Design 4 handles it. Selling per-site licenses? Design 2 was built for that. Building client sites and need something reliable across themes? Every design is self-contained, responsive, and works without a page builder.

Documentation & Support

Full documentation at serpskit.com/docs/serpskit-pricing-table. Covers installation, all eight designs, controls reference, and FAQ.