Marketing · Gutenberg
Split CTA block for WordPress
Two-panel call-to-action section, each with its own background, headline, description and button.
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.
What it actually does
Two-panel call-to-action section, each with its own background, headline, description and button.
Inspector panels on this block: Layout, Panel. Those titles come from index.js, not from a shared template.
Behavior controls: “Panel sizes” options: Equal halves, 60 / 40, 40 / 60; “Text align” options: Left, Center, Right; “Divider style” options: None, Line, Arrow.
Where to find it
Gutenberg inserter → Marketing → search “Split CTA” (block name `blockenberg/split-cta` in block.json). Style it in the sidebar after insert.
How to use Split CTA block for WordPress
- Install Blockenberg. Install from WordPress.org and activate the plugin.
- Insert the block. Edit a page, click +, search for “Split CTA”, insert it. Category: Marketing.
- Configure inspector controls that exist on this block. Open Layout. Set “Panel sizes”, “Text align”, “Divider style”, “Min height (px)”.
- Check the published page. An IntersectionObserver starts work when the block enters the viewport. The block editor preview may not run the same view script.
Inspector controls from this block’s code
| Control | What the code does |
|---|---|
| Panel sizes | Select control; the chosen value is saved on the block. Options: Equal halves; 60 / 40; 40 / 60. block.json default: equal. Saved as `layout`. |
| Text align | Select control; the chosen value is saved on the block. Options: Left; Center; Right. block.json default: center. Saved as `textAlign`. |
| Divider style | Select control; the chosen value is saved on the block. Options: None; Line; Arrow. block.json default: line. Saved as `dividerStyle`. |
| Min height (px) | Numeric range control in the inspector. Range 160–700. block.json default: 360. Saved as `minHeight`. |
| Panel padding (px) | Numeric range control in the inspector. Range 20–120. block.json default: 56. Saved as `panelPadding`. |
| Outer radius (px) | Numeric range control in the inspector. Range 0–32. block.json default: 16. Saved as `wrapRadius`. |
| Button radius (px) | Numeric range control in the inspector. Range 0–99. block.json default: 8. Saved as `btnRadius`. |
| Badge radius (px) | Numeric range control in the inspector. Range 0–99. block.json default: 99. Saved as `badgeRadius`. |
| Stack on mobile | On/off toggle in the inspector. On by default. Saved as `stackOnMobile`. |
| Padding top (px) | Numeric range control in the inspector. Range 0–200. block.json default: 0. Saved as `paddingTop`. |
| Padding bottom (px) | Numeric range control in the inspector. Range 0–200. block.json default: 0. Saved as `paddingBottom`. |
| Show badge | On/off toggle in the inspector. Saved as `panels`. |
| Badge text | Text field in the inspector. Saved as `panels`. |
| Button label | Text field in the inspector. Saved as `panels`. |
| Button URL | Text field in the inspector. Saved as `panels`. |
| Open link in new tab | On/off toggle in the inspector. Saved as `panels`. |
What the front-end script actually does
- An IntersectionObserver starts work when the block enters the viewport.
When this is the right block
- Two-panel call-to-action section, each with its own background, headline, description and button — that is the job of Split CTA, not a generic content block.
- Use it when you need the editor control labeled “Panel sizes”, which exists on this block’s inspector.
- Inserter grouping: landing pages, campaign sections, and conversion layouts.
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 Split CTA block in WordPress?
Install Blockenberg from WordPress.org, edit a page in the block editor, click +, and search for “Split CTA”. It sits under Marketing. After insert, open Layout and set “Panel sizes”, “Text align”, “Divider style”, “Min height (px)”.
What makes Split CTA different from other Blockenberg blocks?
Two-panel call-to-action section, each with its own background, headline, description and button. Inspector labels on this block include “Panel sizes”, “Text align”, “Divider style”, “Min height (px)”.
Is the Split CTA Gutenberg block free?
Yes. Split CTA ships inside Blockenberg. Get the plugin from WordPress.org — no paid add-on is required for this block.
Can I style Split CTA 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, Panel).
Related marketing blocks
Affiliate Disclosure
Styled FTC-compliant affiliate link disclosure notice for articles and reviews. Distinct from Affiliate Review Box — this is the small legal notice, not a full product review.
Affiliate Review Box
Structured product review block with score badge, pros & cons columns, verdict summary, price display, and affiliate CTA button.
Affiliate Section
Affiliate/referral program landing section with commission highlight, how-it-works steps, benefits list, and stats.
Age Gate
Age verification overlay that protects page content behind a customizable age confirmation dialog.
Announcement Strip
A thin dismissible announcement bar — ideal above the site header for promotions, launches, or alerts.
App Download
Ready-made app promotion section with iOS / Android badges, device screenshot, heading, subtitle, ratings/reviews, and full background controls.
Get Blockenberg
Install Blockenberg from WordPress.org, then insert Split CTA from the Gutenberg inserter.