298 blocks for the WordPress block editor
Real blocks with real settings panels, inserted from the inserter WordPress gives you. No shortcodes, no proprietary canvas, no second editor to learn. Everything a visitor sees is a control in the sidebar.
208 blocks you can insert today
Filter by family or search by name, keyword or what the block does. Premium blocks are marked, and every plan includes all of them.
The inserter WordPress gives you, with the Canvas families under the core ones. Nothing here is a shortcode and nothing opens a second editor.
Showing all 208
Posts
30 blocks, listed under Posts in the block inserter.
Agency Works Free
Display Portfolio projects as an agency-style carousel or grid, or render a single project page (attributes, contact CTA, related projects).
Blog Archive Loop Free
Blog loop for the main query (index, category, tag, author, date). Uses the theme blog-entry partials + pagination.
See it live: Blog Archive Loop on Home (opens in a new tab) Settings of the Blog Archive Loop block in the documentation
Blog Loop Free
Composable blog entry loop. Compose the per-post card from Post Image/Title/Meta/Excerpt blocks; the container, pagination, and timeline chrome are layout-driven.
See it live: Blog Loop on Blog | Grid (opens in a new tab) Settings of the Blog Loop block in the documentation
Blog Single Post Free
Single blog post layout (title, meta, image, content, tags, share, nav, author, comments, related + sidebar). For single.html.
Construction Projects Free
Display projects from the Projects post type as a portfolio grid (2 to 5 columns), or render a single project page (attributes, contact CTA, related projects).
See it live: Construction Projects on Projects | 5 Columns (opens in a new tab)
Illustrator Works Free
Portfolio items as a filterable grid of square cards with coloured frames, or the pieces of a single project page.
Interior Projects Free
Display studio projects from the Projects post type as a filterable portfolio grid, or render a single project page (details sidebar, consultation CTA, related projects).
See it live: Interior Projects on Stonecroft (opens in a new tab)
Law Firm Cases Free
Display cases from the Portfolio post type as cards, or render a single case page (attributes, contact CTA, related cases).
See it live: Law Firm Cases on Recent Cases (opens in a new tab)
Photo Shots Free
Display photographs from the Shots post type as an expanding preview grid, or render a single shot page (frame, capture details, enquiry CTA, related shots).
Post Archive Index Free
Every record as a date and a title, optionally grouped by year and month: the "everything we have published" index.
Settings of the Post Archive Index block in the documentation
Post Author Free
Displays the current post author bio card with avatar, display name, and biographical description.
See it live: Post Author on The Slow Web: Why the Best Reading Experiences Are Getting Quieter (opens in a new tab) Settings of the Post Author block in the documentation
Post Comments Free
Renders the WordPress comments template including the comment list and submission form.
See it live: Post Comments on The Slow Web: Why the Best Reading Experiences Are Getting Quieter (opens in a new tab) Settings of the Post Comments block in the documentation
Post Content Free
Displays the full content of the current post, running all content filters including shortcodes and embeds.
See it live: Post Content on This is a Standard post with a Preview Image (opens in a new tab) Settings of the Post Content block in the documentation
Post Date Free
The record's publication date on its own, for a byline the meta list cannot draw.
See it live: Post Date on The Slow Web: Why the Best Reading Experiences Are Getting Quieter (opens in a new tab) Settings of the Post Date block in the documentation
Post Excerpt Free
Displays a word-trimmed excerpt of the current post with configurable length.
See it live: Post Excerpt on Blog | Grid (opens in a new tab) Settings of the Post Excerpt block in the documentation
Post Image Free
Displays the current post featured image with configurable size and optional permalink link.
See it live: Post Image on Blog | Mixed Feed (opens in a new tab) Settings of the Post Image block in the documentation
Post Media Free
The entry media box of the current post: its featured image, video or audio embed, gallery slider, thumbnail grid, quotation, link or status card, chosen from the post format.
See it live: Post Media on Blog | Timeline Left Sidebar (opens in a new tab) Settings of the Post Media block in the documentation
Post Meta Free
Displays configurable post meta including date, author, categories, and comment count.
See it live: Post Meta on Blog | Mixed Feed (opens in a new tab) Settings of the Post Meta block in the documentation
Post Navigation Free
Displays previous and next post navigation links for the current post.
See it live: Post Navigation on The Slow Web: Why the Best Reading Experiences Are Getting Quieter (opens in a new tab) Settings of the Post Navigation block in the documentation
Post Read More Free
Renders a read more link or button pointing to the current post permalink.
See it live: Post Read More on Home (opens in a new tab) Settings of the Post Read More block in the documentation
Post Reading Bar Free
Displays reading time, font-size, print, and share-scroll controls for the current post.
See it live: Post Reading Bar on This is a Standard post with a Preview Image (opens in a new tab) Settings of the Post Reading Bar block in the documentation
Post Reading Time Free
How long the record takes to read, computed from its own body.
See it live: Post Reading Time on The Slow Web: Why the Best Reading Experiences Are Getting Quieter (opens in a new tab) Settings of the Post Reading Time block in the documentation
Post Related Free
Displays a grid of related posts from the same categories as the current post.
See it live: Post Related on The Slow Web: Why the Best Reading Experiences Are Getting Quieter (opens in a new tab) Settings of the Post Related block in the documentation
Post Share Free
Displays social sharing links for the current post with configurable networks, style, and size.
See it live: Post Share on Event Single (opens in a new tab) Settings of the Post Share block in the documentation
Post Terms Free
Displays taxonomy terms (categories or tags) for the current post with text, badge, pill, tag-cloud, or inline-category styles.
See it live: Post Terms on Blog | Mixed Feed (opens in a new tab) Settings of the Post Terms block in the documentation
Post Title Free
Displays the current post title inside a configurable heading tag with an optional permalink link.
See it live: Post Title on Blog | Mixed Feed (opens in a new tab) Settings of the Post Title block in the documentation
Post Table of Contents Free
An index of the post's own headings, with working anchors and a marker that follows the reader.
See it live: Post Table of Contents on A Practical Guide to Design Tokens That Survive a Rebrand (opens in a new tab) Settings of the Post Table of Contents block in the documentation
Posts Free
Query and display posts in a variety of layouts including grid, list, masonry, and timeline. Supports filtering by category, tag, custom post type, and ordering.
See it live: Posts on Blog | Grid (opens in a new tab) Settings of the Posts block in the documentation
Recent Comments Free
The latest approved comments from across the site, each with the commenter's avatar, name and opening words, linking into the thread.
See it live: Recent Comments on Widgets (opens in a new tab) Settings of the Recent Comments block in the documentation
Resume Works Free
Display projects from the Works post type as a compact list or a tile grid, or render a single project page (attributes, CTA, related projects).
Content
30 blocks, listed under Content in the block inserter.
Background Video / Audio Free
A self-hosted looping video or audio layer for a hero, section background or designed player. Emits just the media element, so the wrapper that positions it stays yours.
See it live: Background Video / Audio on Media Actions (opens in a new tab) Settings of the Background Video / Audio block in the documentation
Cascading Images Included with any plan
Layered image composition with per-image translate, rotate, scale, z-index, animation delay, and optional decorative background shapes.
See it live: Cascading Images on Cascading Images (opens in a new tab) Settings of the Cascading Images block in the documentation
Chart Included with any plan
Draw a chart from a data set you supply, so figures from a report or a price comparison can be read at a glance. The chart type, its data and its labels all come from the configuration you enter.
See it live: Chart on Services - Layout 1 (opens in a new tab) Settings of the Chart block in the documentation
Circle Stack Included with any plan
A horizontal stack of circular avatars, icons, or text badges: ideal for team teasers, social proof, and follower counts.
See it live: Circle Stack on Circle Stacks (opens in a new tab) Settings of the Circle Stack block in the documentation
Clients Free
Display client, partner, or brand logos in a responsive grid or owl-carousel with optional linking and lightbox support.
See it live: Clients on Clients (opens in a new tab) Settings of the Clients block in the documentation
Data Table Included with any plan
Lay out rows and columns of structured information, such as a specification list or a plan comparison, with column headings visitors can sort by and an optional summary row at the foot.
See it live: Data Table on User Profile (opens in a new tab) Settings of the Data Table block in the documentation
Map Free
A Google Maps or OpenStreetMap map with custom markers, zoom level and, on Google Maps, map type and style overrides.
See it live: Map on Maps (opens in a new tab) Settings of the Map block in the documentation
Hover Card Free
Image card that tilts in 3D under the pointer, with a title and category caption that lift toward the viewer.
See it live: Hover Card on Hover Parallax (opens in a new tab) Settings of the Hover Card block in the documentation
Icon Browser Free
Searchable reference grid of every icon in the enabled icon packs.
See it live: Icon Browser on Icons (opens in a new tab) Settings of the Icon Browser block in the documentation
Inline SVG Free
Vector icon drawn from SVG path data, with size, colour, viewBox and per-layer opacity as sidebar controls.
See it live: Inline SVG on Pricing (opens in a new tab) Settings of the Inline SVG block in the documentation
Link Tiles Free
A grid of icon-and-label tiles, each linking to a page. Tiles pointing at a page that does not exist are left out.
See it live: Link Tiles on List Groups & Cards (opens in a new tab) Settings of the Link Tiles block in the documentation
Lists & Cards Free
Bootstrap-based list groups and cards with multiple styles, colors, and layouts.
See it live: Lists & Cards on List Groups & Cards (opens in a new tab) Settings of the Lists & Cards block in the documentation
Media Embed Free
Place a video or audio player on the page from a hosting service, from a file you have uploaded, or from an embed address a provider gave you, sized to the aspect ratio you choose.
See it live: Media Embed on Media Embeds (opens in a new tab) Settings of the Media Embed block in the documentation
Nav Tree Free
An indented multi-level link tree: the navigation list a side panel or documentation sidebar uses.
Navbar Free
Collapsible navigation bar with a brand, hamburger toggler, dropdown links and an optional trailing search form, button or text.
See it live: Navbar on Navigation (opens in a new tab) Settings of the Navbar block in the documentation
Overlay Content Free
One content layer inside an overlay: aligned, optionally masked, with trigger icons and nested blocks.
See it live: Overlay Content on Item Overlays (opens in a new tab) Settings of the Overlay Content block in the documentation
Overlay Item Free
An image card with an overlay stacked on top of it: badge, tint layer, and one or more overlay content layers.
See it live: Overlay Item on Item Overlays (opens in a new tab) Settings of the Overlay Item block in the documentation
Page Title Free
The page-title / hero bar. Drop a heading, subtitle, and breadcrumbs inside; choose alignment, a background image, parallax, and a dark scheme.
See it live: Page Title on Page Title Left Aligned Layout (opens in a new tab) Settings of the Page Title block in the documentation
Page Title Buttons Free
Action buttons in the page-title band. Reads each page's own buttons in dynamic mode, or renders the buttons you author here. A button with no link becomes a scroll trigger.
See it live: Page Title Buttons on Buttons (opens in a new tab) Settings of the Page Title Buttons block in the documentation
Particles Free
An animated particle background layer for a section: line web, starfield, bubbles, snow or low poly.
See it live: Particles on Particles (opens in a new tab) Settings of the Particles block in the documentation
Preloader Free
An animated CSS loading indicator in any of the design system’s loader styles.
See it live: Preloader on Preloaders (opens in a new tab) Settings of the Preloader block in the documentation
Pricing Switcher Included with any plan
Toggle switch that controls monthly/yearly (or any two-state) pricing display across paired Pricing Table blocks.
See it live: Pricing Switcher on Pricing (opens in a new tab) Settings of the Pricing Switcher block in the documentation
Q&A Item Free
One question and its answer, each with its own marker: the building block of an interview.
See it live: Q&A Item on Jane Doe on Twenty Years of Building Type (opens in a new tab) Settings of the Q&A Item block in the documentation
Rounded Skill Free
One circular skill ring that fills to its percentage, showing the figure, your own text, an icon or a counter in the middle.
See it live: Rounded Skill on Pie & Skills (opens in a new tab) Settings of the Rounded Skill block in the documentation
Scroll Arrow Included with any plan
An animated scroll-down arrow for hero sections: smooth-scrolls to a target section anchor.
See it live: Scroll Arrow on Christmas Sale Store (opens in a new tab) Settings of the Scroll Arrow block in the documentation
Star Rating Free
A star rating you set as a single score. Supports half stars, custom icons and an optional wrapper element.
See it live: Star Rating on Results (opens in a new tab) Settings of the Star Rating block in the documentation
Testimonials Free
Show what customers say about you as a grid, a rotating carousel or speech bubbles, with an author, a photo and a star rating on each quote.
See it live: Testimonials on Testimonials & Twitter (opens in a new tab) Settings of the Testimonials block in the documentation
Thumbnails Free
Image thumbnail grid with hover effects and optional captions. Supports lightbox and link overlays.
Ticker Free
Scrolling announcement ticker with configurable items, direction, speed, and styling.
See it live: Ticker on Tickers (opens in a new tab) Settings of the Ticker block in the documentation
Twitter Feed Free
A rotating feed of an account's latest tweets, fetched when the page loads. Choose the account, how many to show and how the widget is laid out.
See it live: Twitter Feed on Widgets (opens in a new tab) Settings of the Twitter Feed block in the documentation
Canvas
29 blocks, listed under Canvas in the block inserter.
Alert Free
Alert and notification boxes using Bootstrap alert or Canvas style-msg system. Supports filled, bordered, and extended variants with optional icon and dismiss button.
See it live: Alert on Style Boxes (opens in a new tab) Settings of the Alert block in the documentation
Button Free
Fully featured button with style variants, sizes, shapes, colors, icons, hover effects, and shadow options.
See it live: Button on Buttons (opens in a new tab) Settings of the Button block in the documentation
Code Highlight Included with any plan
Syntax-highlighted code block powered by Prism.js. Supports 15+ languages with an optional clipboard copy button.
See it live: Code Highlight on Code Highlighter (opens in a new tab) Settings of the Code Highlight block in the documentation
Counter Free
Animated number counter with icon, prefix/suffix, and caption label.
See it live: Counter on Counters (opens in a new tab) Settings of the Counter block in the documentation
Divider Free
Horizontal divider with optional icon, style variants, alignment, width presets, and scroll-to link support.
See it live: Divider on Dividers (opens in a new tab) Settings of the Divider block in the documentation
Dropcap Free
Styled dropcap letter with accompanying paragraph text. Supports boxed, bordered, circle, and circle-bordered variants with left or right positioning.
See it live: Dropcap on Headings & Dropcaps (opens in a new tab) Settings of the Dropcap block in the documentation
Heading Free
Styled heading with optional subtitle. Supports Heading Block, Title Block, Emphasis Title, and Fancy Title types.
See it live: Heading on Headings & Dropcaps (opens in a new tab) Settings of the Heading block in the documentation
Highlight Free
Highlighted text with configurable style variants including marker, underline, gradient, outline, and text-only. Supports optional before/after surrounding copy and any block-level HTML tag.
Icon Box Free
Feature box with icon, title, and description. Supports multiple icon styles, sizes, layouts, and hover effects.
See it live: Icon Box on Featured Boxes (opens in a new tab) Settings of the Icon Box block in the documentation
Icon List Free
Icon list with repeater items. Each item has an icon (CSS class), text label, and optional link. Supports default, large, and extra-large size variants.
See it live: Icon List on Icon Lists (opens in a new tab) Settings of the Icon List block in the documentation
Login Form Included with any plan
Renders a WordPress login form with Canvas styling. Shows a welcome message to logged-in users.
See it live: Login Form on Login & Register (opens in a new tab) Settings of the Login Form block in the documentation
Notification Free
Display a toast notification triggered by a button click or automatically on page load.
See it live: Notification on Notifications (opens in a new tab) Settings of the Notification block in the documentation
Page Title Breadcrumbs Free
Renders a breadcrumb trail (Home > Parent > Current) for the current page or post.
See it live: Page Title Breadcrumbs on Page Title Left Aligned Layout (opens in a new tab) Settings of the Page Title Breadcrumbs block in the documentation
Page Title Heading Free
Renders the page / post title as a heading. Supports dynamic (context) and static (literal) source modes.
See it live: Page Title Heading on Page Title Left Aligned Layout (opens in a new tab) Settings of the Page Title Heading block in the documentation
Page Title Subtitle Free
Renders the page subtitle. Reads _canvas_page_subtitle meta in dynamic mode, or displays custom text in static mode.
See it live: Page Title Subtitle on Page Title Left Aligned Layout (opens in a new tab) Settings of the Page Title Subtitle block in the documentation
Plain Image Free
A bare img element (no figure wrapper) with exact class control, optional link, and optional retina (2x) srcset pair.
See it live: Plain Image on Shape Dividers (opens in a new tab) Settings of the Plain Image block in the documentation
Portfolio Excerpt Included with any plan
Displays a trimmed excerpt for the current portfolio item.
See it live: Portfolio Excerpt on Open Imagination (opens in a new tab) Settings of the Portfolio Excerpt block in the documentation
Pricing Table Included with any plan
Flexible pricing box card. Supports default, simple, minimal, and extended layouts with optional pricing switcher, feature list, and CTA button.
See it live: Pricing Table on Pricing (opens in a new tab) Settings of the Pricing Table block in the documentation
Process Steps Free
Numbered or icon step indicators with dashed connector lines. Optionally enables Bootstrap 5 tab content with prev/next navigation.
See it live: Process Steps on Process Steps (opens in a new tab) Settings of the Process Steps block in the documentation
Progress Bar Free
Animated skill/progress bar with percentage counter, horizontal or vertical orientation, and Bootstrap stripe patterns.
See it live: Progress Bar on Progress Bars & Skills (opens in a new tab) Settings of the Progress Bar block in the documentation
Promo Box Free
Promotional call-to-action box with heading, subtext, and CTA button. Supports default, border, light, and dark styles.
See it live: Promo Box on Promo Boxes (opens in a new tab) Settings of the Promo Box block in the documentation
Quote Free
Blockquote with default border, icon quote, and speech bubble styles. Supports reverse alignment, citation footer, and optional border/icon color overrides.
See it live: Quote on Quotes & Blockquotes (opens in a new tab) Settings of the Quote block in the documentation
Read More Free
Collapsible content area with animated expand/collapse triggered by a read-more link.
See it live: Read More on Read More (opens in a new tab) Settings of the Read More block in the documentation
Register Form Included with any plan
A user registration form with Canvas styling. Requires user registration to be enabled in WordPress settings.
See it live: Register Form on Login & Register (opens in a new tab) Settings of the Register Form block in the documentation
Shape Divider Free
SVG decorative shape divider for section transitions.
See it live: Shape Divider on Shape Dividers (opens in a new tab) Settings of the Shape Divider block in the documentation
Social Icons Free
Group of social icon links with hover animation, multiple styles, sizes, and optional sticky positioning.
See it live: Social Icons on Social Icons (opens in a new tab) Settings of the Social Icons block in the documentation
Stat List Free
A list of figures, each a bold value over a short label, such as years of experience, launches or awards.
See it live: Stat List on Team (opens in a new tab) Settings of the Stat List block in the documentation
Styled Icon Free
Standalone icon with filled, bordered, or plain style, shape variants, color options, and optional link.
See it live: Styled Icon on Styled Icons (opens in a new tab) Settings of the Styled Icon block in the documentation
Team Member Free
One team member with a photo, name, role, bio, social links and figures, as a card, a roster row, a stats card, a stacked card or a leader portrait.
See it live: Team Member on Team (opens in a new tab) Settings of the Team Member block in the documentation
Interactive
25 blocks, listed under Interactive in the block inserter.
Accordion Free
Stack titled panels that open and close, so a long run of questions or reference material fits on one page and visitors expand only the parts they need.
See it live: Accordion on Toggles & Accordions (opens in a new tab) Settings of the Accordion block in the documentation
AJAX Button Free
Button that loads external content via AJAX into a container. Supports append, prepend, and replace insertion modes.
See it live: AJAX Button on AJAX Button (opens in a new tab) Settings of the AJAX Button block in the documentation
Carousel Free
Responsive owl-carousel slider with per-breakpoint item counts, autoplay, navigation arrows, dots, lightbox, and lazy-load support.
See it live: Carousel on Carousel (opens in a new tab) Settings of the Carousel block in the documentation
Countdown Included with any plan
Countdown or count-up timer powered by the jQuery countdown plugin.
See it live: Countdown on Counters (opens in a new tab) Settings of the Countdown block in the documentation
Flip Card Included with any plan
One 3D flip card with a front and a back face, each with its own background, that turns over on hover.
See it live: Flip Card on Flip Cards (opens in a new tab) Settings of the Flip Card block in the documentation
Gallery Free
Image gallery with masonry support, configurable columns, gap control, and optional lightbox.
See it live: Gallery on Gallery (opens in a new tab) Settings of the Gallery block in the documentation
Cookie Consent Free
Cookie consent bar with a privacy preferences modal and per-service consent toggles.
See it live: Cookie Consent on GDPR Layout 2 (opens in a new tab) Settings of the Cookie Consent block in the documentation
Hover 3D Free
Card with a CSS perspective tilt effect on mouse-move powered by the theme JS module.
Image Compare Included with any plan
Before/after image comparison slider with configurable orientation, offset, handle style, and side labels.
See it live: Image Compare on Image Compare (opens in a new tab) Settings of the Image Compare block in the documentation
Image Hotspot Included with any plan
Interactive image with positioned hotspot pins that reveal tooltips on hover or click.
See it live: Image Hotspot on Image Hotspots (opens in a new tab) Settings of the Image Hotspot block in the documentation
Image Slider Included with any plan
FlexSlider-powered image slider with slide/fade animation, autoplay, arrows, dots, thumbnail nav, and touch-swipe support.
See it live: Image Slider on Image Sliders (opens in a new tab) Settings of the Image Slider block in the documentation
Modal Included with any plan
Trigger a modal / popup dialog from a button, link, or auto-open on page load.
See it live: Modal on Modal & Popovers (opens in a new tab) Settings of the Modal block in the documentation
Nav Free
A tabs / pills / underline navigation strip with active and disabled states and one-level dropdowns.
See it live: Nav on Navigation (opens in a new tab) Settings of the Nav block in the documentation
Off-Canvas Free
A Bootstrap 5 off-canvas sliding panel (start / end / top / bottom) opened by a button or link.
See it live: Off-Canvas on Bootstrap Off-Canvas (opens in a new tab) Settings of the Off-Canvas block in the documentation
Pagination Free
A pagination row: circle, rounded, pill, 3D, transparent or button styling, in three sizes and any alignment.
See it live: Pagination on Paginations & Progress Bars (opens in a new tab) Settings of the Pagination block in the documentation
Parallax Image Included with any plan
Full-width parallax image section with optional overlay and content.
See it live: Parallax Image on Parallax Elements (opens in a new tab) Settings of the Parallax Image block in the documentation
Scroll Reveal Included with any plan
Animate content into view as the user scrolls down the page.
Slider Included with any plan
Embed a Canvas slider anywhere on the site by selecting it. Slides, effects, navigation, and height are configured on the slider itself.
See it live: Slider on Home Living & Interior Decoration (opens in a new tab) Settings of the Slider block in the documentation
Tab Strip Free
A tab strip whose panels are ordinary blocks elsewhere on the page.
See it live: Tab Strip on User Profile (opens in a new tab) Settings of the Tab Strip block in the documentation
Tabs Free
Split related content across labelled tabs so visitors read one section at a time, which keeps a long comparison or specification page short enough to scan.
See it live: Tabs on Tabs (opens in a new tab) Settings of the Tabs block in the documentation
Text Fill Scroll Included with any plan
Progressively fills text color as the element scrolls into view.
Text Rotator Free
Animated rotating or typed text within a heading element.
See it live: Text Rotator on Headings & Dropcaps (opens in a new tab) Settings of the Text Rotator block in the documentation
Toggle Free
Hide one piece of content behind a heading a visitor clicks to reveal, for a long answer or a set of terms that should not take up the page by default.
See it live: Toggle on Toggles & Accordions (opens in a new tab) Settings of the Toggle block in the documentation
Video Facade Free
Lazy-load video embed behind a thumbnail image; iframe loads only on click for faster pages.
YouTube Background Free
YouTube video playing as an ambient muted background behind overlay content.
See it live: YouTube Background on Event Single | Full Width Video (opens in a new tab) Settings of the YouTube Background block in the documentation
WooCommerce
24 blocks, listed under WooCommerce in the block inserter.
Conference Tickets Included with any plan
Pricing boxes for a category of ticket products, each with a quantity select and a live add-to-cart link.
See it live: Conference Tickets on Tickets (opens in a new tab) Settings of the Conference Tickets block in the documentation
Store Price Filter Included with any plan
A double-handle price range control that filters a product grid in place.
See it live: Store Price Filter on Shop with Filters (opens in a new tab) Settings of the Store Price Filter block in the documentation
Wishlist Free
The products a shopper saved, with their price, stock and an add to cart button. Put it on the page chosen in Theme Options, Wishlist.
Wishlist Button Free
Saves the current product to the shopper's wishlist. Use it in product templates and product cards.
Add to Cart Included with any plan
Renders the WooCommerce add-to-cart form for the current product with optional quantity input.
See it live: Add to Cart on Checked Short Dress (opens in a new tab) Settings of the Add to Cart block in the documentation
Cart Table Included with any plan
Display the WooCommerce cart table with line items, quantities, and totals.
See it live: Cart Table on Cart (opens in a new tab) Settings of the Cart Table block in the documentation
Cart Totals Included with any plan
Display the WooCommerce cart totals panel including subtotal, shipping, and checkout button.
See it live: Cart Totals on Cart (opens in a new tab) Settings of the Cart Totals block in the documentation
Checkout Billing Included with any plan
Display the WooCommerce checkout billing address form.
Checkout Order Review Included with any plan
Display the WooCommerce checkout order review summary with line items and totals.
Settings of the Checkout Order Review block in the documentation
Cross-Sells Included with any plan
Displays cross-sell products from the current WooCommerce cart. Only renders when the cart is active and contains cross-sell products.
See it live: Cross-Sells on Cart (opens in a new tab) Settings of the Cross-Sells block in the documentation
WooCommerce Notices Included with any plan
Display WooCommerce notices: errors, success messages, or informational notices.
See it live: WooCommerce Notices on Cart (opens in a new tab) Settings of the WooCommerce Notices block in the documentation
Product Carousel Included with any plan
Display WooCommerce products in a scrollable owl-carousel. Supports autoplay, navigation arrows, dots, and responsive breakpoints.
See it live: Product Carousel on Carousel (opens in a new tab) Settings of the Product Carousel block in the documentation
Product Categories Included with any plan
Display WooCommerce product categories as a responsive card grid with thumbnails, names, and product counts.
See it live: Product Categories on Blue Round-Neck Tshirt (opens in a new tab) Settings of the Product Categories block in the documentation
Product Gallery Linker Included with any plan
A thumbnail strip that moves a product gallery carousel to the image you click.
See it live: Product Gallery Linker on Men Aviator Sunglasses (opens in a new tab) Settings of the Product Gallery Linker block in the documentation
Product Images Included with any plan
Displays the WooCommerce product featured image and optional gallery thumbnails.
See it live: Product Images on Checked Short Dress (opens in a new tab) Settings of the Product Images block in the documentation
Product Meta Included with any plan
Displays the product meta card: SKU, categories, and tags.
See it live: Product Meta on Checked Short Dress (opens in a new tab) Settings of the Product Meta block in the documentation
Product Price Included with any plan
Displays the WooCommerce product price including sale price and currency formatting.
See it live: Product Price on Checked Short Dress (opens in a new tab) Settings of the Product Price block in the documentation
Product Rating Included with any plan
Displays the star rating and optional review count for the current WooCommerce product.
See it live: Product Rating on Checked Short Dress (opens in a new tab) Settings of the Product Rating block in the documentation
Product Share Included with any plan
Displays the "Share:" card with social sharing links for the current WooCommerce product.
See it live: Product Share on Checked Short Dress (opens in a new tab) Settings of the Product Share block in the documentation
Product Short Description Included with any plan
Displays the product short description with its paragraph markup intact.
See it live: Product Short Description on Checked Short Dress (opens in a new tab) Settings of the Product Short Description block in the documentation
Product Tabs Included with any plan
Renders the WooCommerce product data tabs: Description, Additional Information, and Reviews.
See it live: Product Tabs on Checked Short Dress (opens in a new tab) Settings of the Product Tabs block in the documentation
Products Included with any plan
Display WooCommerce products in a grid or list layout. Filter by source, category, tag, and ordering.
See it live: Products on Products (opens in a new tab) Settings of the Products block in the documentation
Related Products Included with any plan
Displays a grid of WooCommerce products related to the current product. Only renders on single-product templates.
See it live: Related Products on Checked Short Dress (opens in a new tab) Settings of the Related Products block in the documentation
Variation Swatches Included with any plan
Colour dots or button pills that choose a variable product's variation.
See it live: Variation Swatches on Pink Printed Dress (opens in a new tab) Settings of the Variation Swatches block in the documentation
Header
22 blocks, listed under Header in the block inserter.
App Menu Free
An app-style navigation bar pinned to the bottom of the screen on small devices.
See it live: App Menu on Menu - App Style 1 (opens in a new tab) Settings of the App Menu block in the documentation
Color Scheme Toggle Free
The visitor dark-mode switch. Shows on the site while the Dark Mode Switch is on in Theme Options > Color Scheme > Dark Mode with a placement that includes the header.
Settings of the Color Scheme Toggle block in the documentation
Header Button Free
A call-to-action button/link for a built header, styled with the theme's button classes.
See it live: Header Button on Home (opens in a new tab) Settings of the Header Button block in the documentation
Header Cart Free
The WooCommerce mini-cart icon + dropdown for a built header. Renders nothing when WooCommerce is inactive.
See it live: Header Cart on Home (opens in a new tab) Settings of the Header Cart block in the documentation
Header Container Free
The root of a built header: drop a Logo, Navigation, and other header parts inside.
See it live: Header Container on Italian Restaurant (opens in a new tab) Settings of the Header Container block in the documentation
Header Icon Link Free
A single icon-only link for a built header (wishlist, account, user, cart trigger, login modal), using the .header-misc-icon markup.
See it live: Header Icon Link on Header SaaS (opens in a new tab) Settings of the Header Icon Link block in the documentation
Header Info Free
A small inline info/contact element (phone, email, hours, or text) with an optional icon and link for a built header.
See it live: Header Info on Menu - Style 7 (opens in a new tab) Settings of the Header Info block in the documentation
Header Logo Free
The site logo for a built header. Uses the Site Logo from Theme Options by default, or a chosen image override.
See it live: Header Logo on Italian Restaurant (opens in a new tab) Settings of the Header Logo block in the documentation
Header Navigation Free
The primary navigation menu for a built header. Pick a menu and alignment.
See it live: Header Navigation on Italian Restaurant (opens in a new tab) Settings of the Header Navigation block in the documentation
Header Root Free
The outermost element of a built header: carries variant classes and data-sticky-* attributes read by the theme's sticky-header script. Drop the #header-wrap group (and any other header content) inside.
See it live: Header Root on Home (opens in a new tab) Settings of the Header Root block in the documentation
Header Search Free
The header search toggle. Emits the #top-search trigger the theme search dropdown is wired to.
See it live: Header Search on Home (opens in a new tab) Settings of the Header Search block in the documentation
Header Shop Search Free
An always-visible product search field for a header row: the storefront and directory alternative to the header search toggle. Choose a bare field with a resting glyph or an input group with a submit button.
See it live: Header Shop Search on Header Directory (opens in a new tab) Settings of the Header Shop Search block in the documentation
Header Side Panel Trigger Free
The header icon that opens the side panel. Shows only while the Side Panel is switched on in Theme Options.
Settings of the Header Side Panel Trigger block in the documentation
Header Social Free
A row of social / contact icon links for a built header, using the top-social markup and styling.
See it live: Header Social on Online Fashion Store - Shop Sidebar (opens in a new tab) Settings of the Header Social block in the documentation
Header Topbar Free
The slim utility row above a built header (#top-bar): drop Top Links, Header Social, Header Info, or a Language Switcher inside.
Header Wishlist Free
A heart in the header that links to the wishlist and shows how many products are saved.
Header Zone Free
A positioning slot inside a Header Container row: drop a Logo, Navigation, or a small cluster of header parts inside, then use the alignment/order/visibility fields to place it.
See it live: Header Zone on Italian Restaurant (opens in a new tab) Settings of the Header Zone block in the documentation
Icon Nav List Free
A vertical Bootstrap .nav icon-link list (nav-item > nav-link > icon + text), used by off-canvas menu panels.
See it live: Icon Nav List on User Profile (opens in a new tab) Settings of the Icon Nav List block in the documentation
Language Switcher Free
A compact language dropdown for a built header: shows the current language and lists the others, using the primary-menu with-arrows markup.
Settings of the Language Switcher block in the documentation
Mega Menu Column Included with any plan
A single mega-menu column (.mega-menu-column): a heading + link list, flat links, or free widget content. Place one or more inside a Row block as your Mega Menu content (Appearance > Menus > Mega Menu still controls the outer panel type/style).
See it live: Mega Menu Column on Mega Menu (opens in a new tab) Settings of the Mega Menu Column block in the documentation
Page Menu Free
A sub-header page navigation bar with sticky and side-dots variants: one-page anchor scrolling or plain links. Use only one per page.
See it live: Page Menu on Page with Submenu (opens in a new tab) Settings of the Page Menu block in the documentation
Top Links Free
The top-bar links menu with optional single-level dropdown, using the .top-links markup and styling.
See it live: Top Links on Online Fashion Store - Shop Sidebar (opens in a new tab) Settings of the Top Links block in the documentation
Layout
19 blocks, listed under Layout in the block inserter.
Column Free
A responsive grid column (.col-*). Set per-breakpoint widths and place any content inside.
See it live: Column on Columns & Grids (opens in a new tab) Settings of the Column block in the documentation
Container Free
A responsive .container wrapper. Place rows and columns inside to build section layouts.
Copyrights Free
A piece of the footer copyrights bar: the copyright line with its links, or the inline link menu. Insert the Copyrights Bar variation of the Wrapper for both side by side.
See it live: Copyrights on Footer - Layout 2 (opens in a new tab) Settings of the Copyrights block in the documentation
Footer About Free
A footer "About" column with logo, description and optional address, using the .footer-logo markup.
See it live: Footer About on Footer - Layout 2 (opens in a new tab) Settings of the Footer About block in the documentation
Footer Contacts Free
Large label/value contact rows using the .footer-big-contacts markup and styling.
See it live: Footer Contacts on Footer - Layout 3 (opens in a new tab) Settings of the Footer Contacts block in the documentation
Footer Instagram Free
A footer Instagram / photo-stream widget: a masonry grid of images with optional links, using the .masonry-thumbs markup.
See it live: Footer Instagram on Footer - Layout 4 (opens in a new tab) Settings of the Footer Instagram block in the documentation
Footer Widget Area Free
The root of a built footer widget row: drop Footer About, Widget Links, Footer Contacts, Subscribe, or Footer Instagram blocks inside.
See it live: Footer Widget Area on Footer - Layout 2 (opens in a new tab) Settings of the Footer Widget Area block in the documentation
Grid Filter Included with any plan
Isotope category filter bar (.grid-filter) that drives Isotope-filterable grids. Source items from a taxonomy or a manual list.
See it live: Grid Filter on Portfolio Filter Styles (opens in a new tab) Settings of the Grid Filter block in the documentation
Hero Free
Renders the hero each page assigns in its Hero panel, or one hero you pick. Compose heroes under Canvas → Heroes.
See it live: Hero on Sections (opens in a new tab) Settings of the Hero block in the documentation
Image Element Free
A bare image with no figure or caption around it, for logos and badges that sit inline beside other content.
See it live: Image Element on Home (opens in a new tab) Settings of the Image Element block in the documentation
Inline Contact Free
A flat inline run of icon + text contact items (email, phone, Skype, etc.) joined by middot separators: the #copyrights bar contact line.
See it live: Inline Contact on Contact (opens in a new tab) Settings of the Inline Contact block in the documentation
Inline Text Free
A run of text that sits directly inside its container, with no paragraph or span of its own. Inline leaves only.
See it live: Inline Text on Full Width Layout (opens in a new tab) Settings of the Inline Text block in the documentation
Line Break Free
A single line break used as a spacing device. Add responsive classes in the Advanced panel to break the row only on some screen sizes.
See it live: Line Break on Hover Parallax (opens in a new tab) Settings of the Line Break block in the documentation
Page Title Free
Renders the page title band each page shows under its header, as set in the page's Page Title panel and in Theme Options. The band itself is the Page Title template part.
See it live: Page Title on Page Title Left Aligned Layout (opens in a new tab) Settings of the Page Title block in the documentation
Quantity Input Free
A .quantity stepper: a number input flanked by minus/plus buttons. Static and product-agnostic, pair with a button for an "Add to Cart" row.
See it live: Quantity Input on Cart Quantity (opens in a new tab) Settings of the Quantity Input block in the documentation
Row Free
A grid row. Place Canvas Column blocks inside to lay out content in a responsive grid.
See it live: Row on Columns & Grids (opens in a new tab) Settings of the Row block in the documentation
Page Slider Free
Renders the slider each page assigns in its Slider panel, or one slider you pick. Slides, effects and height are configured on the slider itself.
See it live: Page Slider on Canvas Slider (opens in a new tab) Settings of the Page Slider block in the documentation
Widget Links Free
A footer link-list column using the .widget_links markup and styling.
See it live: Widget Links on Widgets (opens in a new tab) Settings of the Widget Links block in the documentation
Wrapper Free
A bare HTML element that carries only the classes you give it and holds other blocks inside. Use it when a design needs an exact wrapper element without any extra editor classes.
See it live: Wrapper on Sections (opens in a new tab) Settings of the Wrapper block in the documentation
Events
16 blocks, listed under Events in the block inserter.
Conference Programme Included with any plan
Day-tabbed session agenda, or a row of upcoming-event cards, built from the event records.
See it live: Conference Programme on Canvas Development Conference (opens in a new tab) Settings of the Conference Programme block in the documentation
Event Archive Grid Included with any plan
Events grid for the main query (archive + category). Uses the event-entry-grid partial + shared pagination.
See it live: Event Archive Grid on Events (opens in a new tab) Settings of the Event Archive Grid block in the documentation
Event Categories Included with any plan
Displays the categories assigned to the current event. Supports text, badge, and pill styles. Only renders on canvas_event post type.
Event Content Included with any plan
Renders the full post content of the current event through the_content filter. Only renders on canvas_event post type.
See it live: Event Content on Event Single (opens in a new tab) Settings of the Event Content block in the documentation
Event Date Included with any plan
Displays the event start and end dates with optional time and calendar icon. Only renders on canvas_event post type.
Event Excerpt Included with any plan
Displays a trimmed excerpt for the current event.
Event Image Included with any plan
Displays the featured image of the current event. Only renders on canvas_event post type.
See it live: Event Image on Event Single (opens in a new tab) Settings of the Event Image block in the documentation
Event Location Included with any plan
Displays the event venue name and address with an optional Google Maps link and location icon. Only renders on canvas_event post type.
Event Meta Included with any plan
Displays event metadata: date, location, organizer, and price. Each field can be toggled independently. Only renders on canvas_event post type.
See it live: Event Meta on Event Single | Both Sidebars (opens in a new tab) Settings of the Event Meta block in the documentation
Event Navigation Included with any plan
Renders previous and next event navigation links with configurable labels and optional thumbnails. Only renders on canvas_event post type.
See it live: Event Navigation on Event Single | Both Sidebars (opens in a new tab) Settings of the Event Navigation block in the documentation
Event Organizer Included with any plan
Displays the event organizer with an optional link to their website and a person icon. Only renders on canvas_event post type.
Event Posts Included with any plan
Queries and displays canvas_event posts in a responsive card grid. Supports filtering by upcoming, past, or all events. Can be placed on any page.
See it live: Event Posts on Events List (opens in a new tab) Settings of the Event Posts block in the documentation
Event Price Included with any plan
Displays the event price, or a configurable free label when no price is set. Supports text and badge styles. Only renders on canvas_event post type.
Related Events Included with any plan
Displays a grid of related events based on shared categories. Only renders on canvas_event post type.
See it live: Related Events on Spring Music Fest (opens in a new tab) Settings of the Related Events block in the documentation
Event Title Included with any plan
Displays the current event title inside a configurable heading tag with an optional permalink link. Only renders on canvas_event post type.
Events Calendar Included with any plan
A month-grid calendar of your events, with previous / next / today controls. Each day links to the events happening on it.
See it live: Events Calendar on Events Calendar (opens in a new tab) Settings of the Events Calendar block in the documentation
Portfolio
8 blocks, listed under Portfolio in the block inserter.
Portfolio Archive Grid Included with any plan
Portfolio grid for the main query (archive + category). Uses the portfolio-entry-grid partial + #portfolio overlay grid.
See it live: Portfolio Archive Grid on Portfolio (opens in a new tab) Settings of the Portfolio Archive Grid block in the documentation
Portfolio Categories Included with any plan
Displays the taxonomy categories assigned to the current portfolio project. Use inside portfolio single templates.
See it live: Portfolio Categories on Meridian Brand Identity (opens in a new tab) Settings of the Portfolio Categories block in the documentation
Portfolio Content Included with any plan
Displays the full content of the current portfolio project. Use inside portfolio single templates.
See it live: Portfolio Content on Open Imagination (opens in a new tab) Settings of the Portfolio Content block in the documentation
Portfolio Image Included with any plan
Displays the media region of the current portfolio project: featured image, gallery slider, project video, or thumbnail grid. Use inside portfolio single templates.
See it live: Portfolio Image on Open Imagination (opens in a new tab) Settings of the Portfolio Image block in the documentation
Portfolio Meta Included with any plan
Displays the portfolio project details: client, date, skills, and URL. Use inside portfolio single templates.
See it live: Portfolio Meta on Open Imagination (opens in a new tab) Settings of the Portfolio Meta block in the documentation
Portfolio Navigation Included with any plan
Displays previous and next portfolio project navigation links. Use inside portfolio single templates.
See it live: Portfolio Navigation on Open Imagination (opens in a new tab) Settings of the Portfolio Navigation block in the documentation
Portfolio Related Included with any plan
Displays related portfolio projects based on shared categories. Use inside portfolio single templates.
See it live: Portfolio Related on Open Imagination (opens in a new tab) Settings of the Portfolio Related block in the documentation
Portfolio Title Included with any plan
Displays the current portfolio project title. Use inside portfolio single templates.
See it live: Portfolio Title on Meridian Brand Identity (opens in a new tab) Settings of the Portfolio Title block in the documentation
Forms
5 blocks, listed under Forms in the block inserter.
Form Included with any plan
A working form. Place Form Field and Form Submit blocks inside: submissions are validated, saved and emailed.
See it live: Form on Forms Styles (opens in a new tab) Settings of the Form block in the documentation
Form Embed Included with any plan
Embed a Canvas form anywhere on the site by selecting its Form ID.
See it live: Form Embed on Index Shop (opens in a new tab) Settings of the Form Embed block in the documentation
Form Field Included with any plan
A single form input field. Use inside a Canvas Form to collect user input.
See it live: Form Field on Form Elements (opens in a new tab) Settings of the Form Field block in the documentation
Form Submit Button Included with any plan
The submit button for a Canvas form. Supports style variants, size, full-width mode, and an icon.
See it live: Form Submit Button on Forms Styles (opens in a new tab) Settings of the Form Submit Button block in the documentation
Quick Contact Included with any plan
A compact "Quick Quotation" contact form widget (name / email / message), styled with the Canvas form CSS.
See it live: Quick Contact on Widgets (opens in a new tab) Settings of the Quick Contact block in the documentation
90 blocks that arrive with their demo
Some designs need a block that only makes sense inside that design. Those blocks are always registered, so a demo you imported keeps rendering forever, but they stay out of the inserter on sites that never asked for them.
Posts 60
Album Tiles, Architecture Projects, Architecture Team, Arrangement Gallery, Artist Bubbles, Bakery Menu, Barber Items, Beauty Kits, and 52 more.
See all 60 Posts blocks
WooCommerce 9
Channel Merch, Event Passes, Fashion Cart Part, Fashion Product Part, Fashion Products, Gear Products, Illustrator Prints, Store Products, eCommerce Products.
Content 7
Article Cards, Finance Calculator, Forum Discussion, Forum Members, Forum Topics, Recipe Categories, Rental Calculator.
Interactive 5
Audio Player Bar, Domain Search, Host Price, Host Slider, Play Track Button.
Canvas 4
Dental FAQ, Dot Grid Backdrop, Live Transaction Feed, Virtual Card.
Header 3
Forum Header Dropdown, Forum Search Overlay, Photographer Menu.
Portfolio 2
Portfolio Grid, Videographer Works.
Theme Options lists every block Canvas registers, demo-scoped ones included, each with a switch that takes it out of the inserter and stops its front-end assets loading.
Import a demo and its blocks appear in the pages it built, fully editable, with the same settings panels every other Canvas block has. Roll the demo back and they leave with it.
Every block has these
Seven settings sit on every block Canvas registers, and the first four sit on core and third-party blocks too, because they are added to the editor rather than to our blocks.
The sidebar of a selected block. Everything a visitor sees is a control here, which is why there is no code view to open.
Animation
Reveal a block as it enters the viewport, with a speed, a delay and an optional exit animation. Motion respects a visitor's reduced-motion preference.
Custom CSS
Write CSS for one block instance when a core control cannot express what you want. It is scoped to that block and filtered before it reaches the page.
Custom attributes
Add data attributes or ARIA attributes to a block's root element from the sidebar, so a third-party script or a test harness can find it.
Display conditions
Show or hide a block by login state, user role, device size or the value of a Theme Option, so one page can serve several audiences.
Block defaults
Set a block up the way you like it once, then save those settings as the default for every one you insert afterwards on this site.
Global style presets
Save a named style and apply it to blocks anywhere on the site. Change the preset later and every block using it changes with it.
Per-block asset loading
A page enqueues only the CSS and JavaScript of the blocks it actually renders, so a page without a slider never downloads the slider script.
183 block patterns
A pattern drops a finished section into the page as ordinary blocks you then edit. There is no raw HTML inside one, so every heading, image, icon and link stays a control in the sidebar.
Patterns are grouped into 17 categories in the inserter:
Patterns are labelled rather than locked: a premium pattern stays visible in the inserter with its label, and it renders in full when the blocks inside it are free ones. The 173 block templates and 4 style variations that ship with the theme work the same way, in the Site Editor.
Every block, on every plan
There is no block ladder to climb. Starter, Pro and Agency all ship the same 298 blocks, the same 183 patterns and the same 88 demos.