Marketing · Gutenberg

Testimonial Featured block for WordPress

A single large featured testimonial section — big decorative quote mark, full testimonial text, person photo, name, title, company logo, star rating, and optional result metric badge. Designed as a standalone section for maximum impact. Different from testimonial carousels or grids.

Get Blockenberg

Free Gutenberg block in Blockenberg. The inspector controls and front-end behavior on this page come from this block’s source, not a shared stub.

Get Blockenberg

What it actually does

A single large featured testimonial section — big decorative quote mark, full testimonial text, person photo, name, title, company logo, star rating, and optional result metric badge. Designed as a standalone section for maximum impact. Different from testimonial carousels or grids.

Inspector panels on this block: Layout & Style. Those titles come from index.js, not from a shared template.

Behavior controls: “Layout” options: Centered, Side-by-side; “Card Style” options: Clean (no background), Card (light box), Dark.

Where to find it

Gutenberg inserter → Marketing → search “Testimonial Featured” (block name `blockenberg/testimonial-featured` in block.json). Style it in the sidebar after insert.

How to use Testimonial Featured block for WordPress

  1. Install Blockenberg. Install from WordPress.org and activate the plugin.
  2. Insert the block. Edit a page, click +, search for “Testimonial Featured”, insert it. Category: Marketing.
  3. Configure inspector controls that exist on this block. Open Layout & Style. Set “Card Style”, “Show Decorative Quote Mark”, “Show Stars”, “Star Rating”.
  4. Check the published page. The view script reads HTML data attributes: data-opts. The block editor preview may not run the same view script.

Inspector controls from this block’s code

ControlWhat the code does
LayoutSelect control; the chosen value is saved on the block. Options: Centered; Side-by-side. block.json default: centered. Saved as `layout`.
Card StyleSelect control; the chosen value is saved on the block. Options: Clean (no background); Card (light box); Dark. block.json default: clean. Saved as `cardStyle`.
Show Decorative Quote MarkOn/off toggle in the inspector. On by default. Saved as `showQuotemark`.
Show StarsOn/off toggle in the inspector. On by default. Saved as `showRating`.
Star RatingNumeric range control in the inspector. Range 1–5. block.json default: 5. Saved as `rating`.
Show Company LogoOn/off toggle in the inspector. Off by default. Saved as `showCompanyLogo`.
Show Result MetricOn/off toggle in the inspector. On by default. Saved as `showResultMetric`.
Quote Mark SizeNumeric range control in the inspector. Range 60–200. block.json default: 120. Saved as `quotemarkSize`.
Avatar SizeNumeric range control in the inspector. Range 40–100. block.json default: 64. Saved as `avatarSize`.
Max Width (px)Numeric range control in the inspector. Range 500–1200. block.json default: 860. Saved as `maxWidth`.
Padding TopNumeric range control in the inspector. Range 0–160. block.json default: 80. Saved as `paddingTop`.
Padding BottomNumeric range control in the inspector. Range 0–160. block.json default: 80. Saved as `paddingBottom`.
Colors — BackgroundColor control in the inspector. block.json default: #ffffff. Saved as `bgColor`.
Quote TextColor control in the inspector. block.json default: #111827. Saved as `textColor`.
NameColor control in the inspector. block.json default: #111827. Saved as `nameColor`.
Colors — TitleColor control in the inspector. block.json default: #6b7280. Saved as `titleColor`.
Quote MarkColor control in the inspector. block.json default: #ede9fe. Saved as `quotemarkColor`.
StarsColor control in the inspector. block.json default: #f59e0b. Saved as `starColor`.
AccentColor control in the inspector. block.json default: #7c3aed. Saved as `accentColor`.
Result BGColor control in the inspector. block.json default: #f0fdf4. Saved as `resultBg`.
Result TextColor control in the inspector. block.json default: #15803d. Saved as `resultColor`.
Card BGColor control in the inspector. block.json default: #f9fafb. Saved as `cardBg`.

What the front-end script actually does

When this is the right block

Notes from the implementation

viewScript: this folder’s frontend.js is enqueued on the front end for this block.

FAQ

How do I add the Testimonial Featured block in WordPress?

Install Blockenberg from WordPress.org, edit a page in the block editor, click +, and search for “Testimonial Featured”. It sits under Marketing. After insert, open Layout & Style and set “Card Style”, “Show Decorative Quote Mark”, “Show Stars”, “Star Rating”.

What makes Testimonial Featured different from other Blockenberg blocks?

A single large featured testimonial section — big decorative quote mark, full testimonial text, person photo, name, title, company logo, star rating, and optional result metric badge. Designed as a standalone section for maximum impact. Different from testimonial carousels or grids. Inspector labels on this block include “Card Style”, “Show Decorative Quote Mark”, “Show Stars”, “Star Rating”.

Is the Testimonial Featured Gutenberg block free?

Yes. Testimonial Featured ships inside Blockenberg. Get the plugin from WordPress.org — no paid add-on is required for this block.

Can I style Testimonial Featured to match my theme?

Yes. Blockenberg’s shared typography and color panels apply here, plus any block-specific style controls listed on this page (panels: Layout & Style).

Related marketing blocks

Get Blockenberg

Install Blockenberg from WordPress.org, then insert Testimonial Featured from the Gutenberg inserter.

Get Blockenberg