Marketing · Gutenberg
Webinar Section block for WordPress
Promote a live webinar or online event with date, speakers, agenda topics, countdown timer, and CTA.
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
Promote a live webinar or online event with date, speakers, agenda topics, countdown timer, and CTA.
Inspector panels on this block: Content, Layout. Those titles come from index.js, not from a shared template.
Behavior controls: “Layout” options: Split (info + speakers), Centered.
Where to find it
Gutenberg inserter → Marketing → search “Webinar Section” (block name `blockenberg/webinar-section` in block.json). Style it in the sidebar after insert.
How to use Webinar Section block for WordPress
- Install Blockenberg. Install from WordPress.org and activate the plugin.
- Insert the block. Edit a page, click +, search for “Webinar Section”, insert it. Category: Marketing.
- Configure inspector controls that exist on this block. Open Content. Set “Show Badge”, “Badge Text”, “Show Subtext”, “Show Date/Time”.
- 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
| Control | What the code does |
|---|---|
| Show Badge | On/off toggle in the inspector. On by default. Saved as `showBadge`. |
| Badge Text | Text field in the inspector. block.json default: FREE LIVE WEBINAR. Saved as `badge`. |
| Show Subtext | On/off toggle in the inspector. On by default. Saved as `showSubtext`. |
| Show Date/Time | On/off toggle in the inspector. On by default. Saved as `showDateTime`. |
| Event Date | Text field in the inspector. Saved as `eventDate`. |
| Time | Text field in the inspector. block.json default: 2:00 PM. Saved as `eventTime`. |
| Timezone | Text field in the inspector. block.json default: EST. Saved as `eventTimezone`. |
| Show Topics | On/off toggle in the inspector. On by default. Saved as `showTopics`. |
| Topics Heading | Text field in the inspector. block.json default: What You'll Learn. Saved as `topicsHeading`. |
| Show Speakers | On/off toggle in the inspector. On by default. Saved as `showSpeakers`. |
| Show Countdown | On/off toggle in the inspector. On by default. Saved as `showCountdown`. |
| Countdown End (ISO date) | Text field in the inspector. Saved as `countdownEnd`. |
| CTA Label | Text field in the inspector. block.json default: Reserve My Free Spot →. Saved as `ctaLabel`. |
| CTA URL | Text field in the inspector. block.json default: #. Saved as `ctaUrl`. |
| Show CTA Subtext | On/off toggle in the inspector. On by default. Saved as `showCtaSubtext`. |
| CTA Subtext | Text field in the inspector. block.json default: Limited to 500 attendees • Replay available afterward. Saved as `ctaSubtext`. |
| Layout | Select control; the chosen value is saved on the block. Options: Split (info + speakers); Centered. block.json default: split. Saved as `layout`. |
| Max Width (px) | Numeric range control in the inspector. Range 600–1400. block.json default: 1100. Saved as `maxWidth`. |
| Padding Top (px) | Numeric range control in the inspector. Range 0–200. block.json default: 80. Saved as `paddingTop`. |
| Padding Bottom (px) | Numeric range control in the inspector. Range 0–200. block.json default: 80. Saved as `paddingBottom`. |
| Colors — Background | Color control in the inspector. block.json default: #0f172a. Saved as `bgColor`. |
| Heading Color | Color control in the inspector. block.json default: #ffffff. Saved as `headingColor`. |
| Subtext Color | Color control in the inspector. block.json default: #94a3b8. Saved as `subtextColor`. |
| Accent Color | Color control in the inspector. block.json default: #a78bfa. Saved as `accentColor`. |
| Badge BG | Color control in the inspector. block.json default: #7c3aed. Saved as `badgeBg`. |
| Check/Topic Color | Color control in the inspector. block.json default: #a78bfa. Saved as `checkColor`. |
| Date Block BG | Color control in the inspector. block.json default: #1e293b. Saved as `dateBg`. |
| Speaker Card BG | Color control in the inspector. block.json default: #1e293b. Saved as `speakerCardBg`. |
| CTA Button BG | Color control in the inspector. block.json default: #7c3aed. Saved as `ctaBg`. |
What the front-end script actually does
- The view script reads HTML data attributes: data-opts.
When this is the right block
- Promote a live webinar or online event with date, speakers, agenda topics, countdown timer, and CTA — that is the job of Webinar Section, not a generic content block.
- Use it when you need the editor control labeled “Show Badge”, which exists on this block’s inspector.
- It matches pages about webinar, event, live.
- 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 Webinar Section block in WordPress?
Install Blockenberg from WordPress.org, edit a page in the block editor, click +, and search for “Webinar Section”. It sits under Marketing. After insert, open Content and set “Show Badge”, “Badge Text”, “Show Subtext”, “Show Date/Time”.
What makes Webinar Section different from other Blockenberg blocks?
Promote a live webinar or online event with date, speakers, agenda topics, countdown timer, and CTA. Inspector labels on this block include “Show Badge”, “Badge Text”, “Show Subtext”, “Show Date/Time”.
Is the Webinar Section Gutenberg block free?
Yes. Webinar Section ships inside Blockenberg. Get the plugin from WordPress.org — no paid add-on is required for this block.
Can I style Webinar Section 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: Content, Layout).
Related marketing blocks
Coming Soon
Launch countdown page section with logo, heading, subtitle, live countdown timer, optional email capture field, social links, and background controls.
CTA with Countdown
Urgency-driven CTA section with a live countdown timer, headline, and call-to-action buttons.
Launch Waitlist
Product or service launch section with live countdown timer, email waitlist form, feature teasers, and social proof. For pre-launch landing pages.
Offer Card
Special offer and deal card with urgency badge, original/sale price, includes list, CTA, and optional countdown timer.
Ticket Stub
Stylized event ticket card with tear-off stub showing seat, row, section, barcode, and key event details.
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.
Get Blockenberg
Install Blockenberg from WordPress.org, then insert Webinar Section from the Gutenberg inserter.