Blocks Reference

All 29 blocks are listed below, organized by category. Each block is registered under the acf-blocks category in the editor inserter.

This ACF blocks list covers all 29 blocks in the plugin, organized by category: content, commerce, engagement, and layout. Every block registers under the acf-blocks category in the inserter, and each entry below notes the block name you’ll see in markup.

Content Blocks

Accordion (acf/accordion)

Collapsible content sections using native HTML <details> and <summary> elements. No JavaScript required for the toggle behavior. Supports an optional FAQ schema toggle that outputs FAQPage JSON-LD structured data.

• Keywords: accordion, faq, toggle
• Supports: wide/full alignment, InnerBlocks (jsx), anchor
• Style variations: default
• Schema: FAQPage (when enabled)

Callout (acf/callout)

Highlighted content boxes for tips, warnings, notes, or quotes. Comes with multiple visual styles.

• Keywords: callout, notice, alert
• Style variations: default, dark, testimonial, dashed-light, dashed-dark, highlight

Hero (acf/hero)

Full-width hero section with headline, subheading, and call-to-action buttons. Supports InnerBlocks for flexible content. Falls back to legacy ACF fields if InnerBlocks content is empty.

• Keywords: hero, banner, header
• Supports: wide/full alignment, InnerBlocks (jsx)

CTA (acf/cta)

Call-to-action block with heading, description, and button. Supports InnerBlocks.

• Keywords: cta, call to action, button
• Supports: InnerBlocks (jsx)

Section Block (acf/section-block)

A container block that wraps InnerBlocks content. Configurable background color, background image, background video, and overlay. Supports custom HTML tag selection. Outputs scoped inline CSS for per-instance styling.

• Keywords: section, container, wrapper
• Supports: wide/full alignment, InnerBlocks (jsx)
• Editor script: Custom InnerBlocks edit component via editor.js

Opinion Box (acf/opinion-box)

Editorial content box with author attribution. Suitable for author opinions, editor’s picks, or expert commentary.

• Keywords: opinion, editorial, author
• Supports: InnerBlocks (jsx)

Tabs (acf/tabs)

Tabbed content interface. Content is organized into named tabs that users can switch between.

• Keywords: tabs, tabbed content
• Style variations: default
• Supports: InnerBlocks (jsx)

Thread Builder (acf/thread-builder)

Builds discussion-style thread layouts, similar to social media threads.

• Keywords: thread, discussion, conversation

Product and E-Commerce Blocks

Product Review (acf/product-review)

Comprehensive product review with star rating, pros/cons, pricing, and a verdict. Outputs Product schema with Review, Offer, positiveNotes, and negativeNotes.

• Keywords: review, product, rating
• Style variations: default
• Schema: Product with Review

Product Box (acf/product-box)

Single product highlight with image, description, pricing, and CTA buttons.

• Keywords: product, box, showcase
• Style variations: default, no-image

Product Cards (acf/product-cards)

Grid of product cards for showcasing multiple products.

• Keywords: products, cards, grid
• Supports: InnerBlocks (jsx)

Compare Block (acf/compare)

Side-by-side product comparison with nested repeater fields for features. Supports comparing multiple products with rows of feature data.

• Keywords: compare, comparison, versus
• Style variations: default

PL Block (acf/pl-block)

Product list with pricing details. Designed for “best of” lists with ranked products.

• Keywords: product list, pricing, list
• Supports: InnerBlocks (jsx)

Coupon Code (acf/cb-coupon-code)

Displays promotional/discount codes with a click-to-copy feature. Uses the Clipboard API with an execCommand fallback. The copy function is injected once per page regardless of how many coupon blocks appear.

• Keywords: coupon, discount, code

Media and Display Blocks

Video (acf/video)

Video embeds supporting YouTube, Vimeo, and self-hosted files. Configurable aspect ratio, autoplay, loop, mute, and controls.

• Keywords: video, youtube, vimeo
• Supports: InnerBlocks (jsx)

Gallery (acf/gallery)

Image gallery with lightbox support.

• Keywords: gallery, images, photos
• Supports: InnerBlocks (jsx)

Stats Block (acf/stats)

Statistics display for showcasing numbers and metrics.

• Keywords: stats, numbers, metrics
• Style variations: default
• Supports: InnerBlocks (jsx)

Star Rating (acf/star-rating)

Interactive star rating with AJAX submission. Visitors can submit ratings that are stored as aggregate post meta. Rated state persists in localStorage to prevent duplicate submissions. Outputs AggregateRating schema with a configurable @type (Article, BlogPosting, CreativeWork, etc.).

• Keywords: rating, stars, score
• Style variations: default
• Schema: AggregateRating
• AJAX: acf_star_rating_submit (public, both logged-in and anonymous users)
• Frontend JS: star-rating-block.js

Code Block (acf/code-block)

Syntax-highlighted code display with language selection, filename, and theme options (light/dark).

• Keywords: code, syntax, programming

Changelog (acf/changelog)

Version changelog display with entries grouped by version number and date. Each entry has typed items (added, changed, fixed, removed, etc.).

• Keywords: changelog, version, release
• Style variations: default, timeline

Checklist (acf/checklist)

Interactive checklist with optional progress bar. Supports checked/unchecked states and strikethrough styling.

• Keywords: checklist, todo, list
• Style variations: default, card, minimal

Navigation and Organization Blocks

Table of Contents (acf/toc)

Auto-generated table of contents that links to headings in the post content. Automatically adds id attributes to headings that lack them. Supports sticky positioning and active-section highlighting via IntersectionObserver. Outputs ItemList / SiteNavigationElement schema.

• Keywords: toc, table of contents, navigation
• Style variations: default
• Schema: ItemList, SiteNavigationElement
• Content filter: Adds IDs to headings via the_content
• Frontend JS: IntersectionObserver for active highlight (inline, when enabled)

Feature Grid (acf/feature-grid)

Grid layout for displaying features with icons, titles, and descriptions.

• Keywords: features, grid, icons
• Style variations: default, card, dark, minimal, bordered, gradient
• Supports: InnerBlocks (jsx)

Post Display (acf/post-display)

Displays selected posts using the ACF relationship field. Supports multiple layout styles with per-instance inline CSS.

• Keywords: posts, display, related
• Style variations: default, dark, card, minimal, bordered

URL Preview (acf/url-preview)

Link preview cards similar to social media embeds. Enter a URL in the editor, click “Fetch”, and the block populates title, description, and image from the page’s Open Graph metadata. Images can be imported to the WordPress media library.

• Keywords: url, preview, link, embed
• Supports: InnerBlocks (jsx)
• AJAX: acf_url_preview_fetch (admin only, requires edit_posts)
• AJAX: acf_url_preview_import_image (admin only, requires upload_files)

Team and Form Blocks

Team Member (acf/team-member)

Team member profile cards with photo, name, role, and bio.

• Keywords: team, member, profile
• Supports: InnerBlocks (jsx)

Email Form (acf/email-form)

Email capture form supporting two modes: native form POST to a custom form_action URL, or webhook POST to a REST endpoint. The form submission is handled via inline JavaScript.

• Keywords: email, form, subscribe
• Supports: InnerBlocks (jsx)

Testimonial (acf/testimonial)

Customer testimonial display with author name, photo, company, and rating.

• Keywords: testimonial, quote, review
• Style variations: default

Pros/Cons (acf/pros-cons)

Side-by-side pros and cons list.

• Keywords: pros, cons, advantages

Quick answers to common questions: