Marketing · Gutenberg
Coming Soon block for WordPress
Launch countdown page section with logo, heading, subtitle, live countdown timer, optional email capture field, social links, and background controls.
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
Launch countdown page section with logo, heading, subtitle, live countdown timer, optional email capture field, social links, and background controls.
Inspector panels on this block: Content, Social Links, Sizing. Those titles come from index.js, not from a shared template.
Where to find it
Gutenberg inserter → Marketing → search “Coming Soon” (block name `blockenberg/coming-soon` in block.json). Style it in the sidebar after insert.
How to use Coming Soon block for WordPress
- Install Blockenberg. Install from WordPress.org and activate the plugin.
- Insert the block. Edit a page, click +, search for “Coming Soon”, insert it. Category: Marketing.
- Configure inspector controls that exist on this block. Open Content. Set “Show Logo”, “Logo Width (px)”, “Show Eyebrow”, “Eyebrow Text”.
- 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 Logo | On/off toggle in the inspector. Off by default. Saved as `showLogo`. |
| Logo Width (px) | Numeric range control in the inspector. Range 60–300. block.json default: 160. Saved as `logoWidth`. |
| Show Eyebrow | On/off toggle in the inspector. On by default. Saved as `showEyebrow`. |
| Eyebrow Text | Text field in the inspector. block.json default: Something big is coming. Saved as `eyebrow`. |
| Show Countdown | On/off toggle in the inspector. On by default. Saved as `showCountdown`. |
| Launch Date (YYYY-MM-DD) | Text field in the inspector. Saved as `launchDate`. |
| Show Email Form | On/off toggle in the inspector. On by default. Saved as `showEmail`. |
| Email Placeholder | Text field in the inspector. block.json default: Enter your email address. Saved as `emailPlaceholder`. |
| Button Label | Text field in the inspector. block.json default: Notify Me. Saved as `emailBtnLabel`. |
| Form Action URL | Text field in the inspector. block.json default: #. Saved as `emailAction`. |
| Show Social Links | On/off toggle in the inspector. On by default. Saved as `showSocials`. |
| Platform | Text field in the inspector. |
| URL | Text field in the inspector. |
| Max Width (px) | Numeric range control in the inspector. Range 400–1000. block.json default: 700. Saved as `maxWidth`. |
| Padding Top (px) | Numeric range control in the inspector. Range 0–300. block.json default: 120. Saved as `paddingTop`. |
| Padding Bottom (px) | Numeric range control in the inspector. Range 0–300. block.json default: 120. Saved as `paddingBottom`. |
| Heading | Shared Blockenberg typography popover (family, size, weight, spacing). Saved as `typoHeading`. |
| Body | Shared Blockenberg typography popover (family, size, weight, spacing). Saved as `typoBody`. |
| Eyebrow | Shared Blockenberg typography popover (family, size, weight, spacing). Saved as `typoEyebrow`. |
| Colors — Background | Color control in the inspector. block.json default: #0f172a. Saved as `bgColor`. |
| Heading | Color control in the inspector. block.json default: #ffffff. Saved as `headingColor`. |
| Body Text | Color control in the inspector. block.json default: #94a3b8. Saved as `textColor`. |
| Eyebrow BG | Color control in the inspector. block.json default: rgba(255,255,255,.08). Saved as `eyebrowBg`. |
| Eyebrow Text | Color control in the inspector. block.json default: #c4b5fd. Saved as `eyebrowColor`. |
| Timer Box BG | Color control in the inspector. block.json default: rgba(255,255,255,.07). Saved as `timerBg`. |
| Timer Number | Color control in the inspector. block.json default: #ffffff. Saved as `timerColor`. |
| Button Background | Color control in the inspector. block.json default: #7c3aed. Saved as `btnBg`. |
| Button Text | Color control in the inspector. block.json default: #ffffff. Saved as `btnColor`. |
| Accent | Color control in the inspector. block.json default: #7c3aed. Saved as `accentColor`. |
What the front-end script actually does
- The view script reads HTML data attributes: data-opts.
When this is the right block
- Launch countdown page section with logo, heading, subtitle, live countdown timer, optional email capture field, social links, and background controls — that is the job of Coming Soon, not a generic content block.
- Use it when you need the editor control labeled “Show Logo”, which exists on this block’s inspector.
- It matches pages about coming soon, launch, countdown.
- 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 Coming Soon block in WordPress?
Install Blockenberg from WordPress.org, edit a page in the block editor, click +, and search for “Coming Soon”. It sits under Marketing. After insert, open Content and set “Show Logo”, “Logo Width (px)”, “Show Eyebrow”, “Eyebrow Text”.
What makes Coming Soon different from other Blockenberg blocks?
Launch countdown page section with logo, heading, subtitle, live countdown timer, optional email capture field, social links, and background controls. Inspector labels on this block include “Show Logo”, “Logo Width (px)”, “Show Eyebrow”, “Eyebrow Text”.
Is the Coming Soon Gutenberg block free?
Yes. Coming Soon ships inside Blockenberg. Get the plugin from WordPress.org — no paid add-on is required for this block.
Can I style Coming Soon 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, Social Links, Sizing).
Related marketing blocks
Launch Waitlist
Product or service launch section with live countdown timer, email waitlist form, feature teasers, and social proof. For pre-launch landing pages.
CTA with Countdown
Urgency-driven CTA section with a live countdown timer, headline, and call-to-action buttons.
Feature Announcement
Announce new product features, improvements, or updates with version badge, highlights list, and CTA.
Offer Card
Special offer and deal card with urgency badge, original/sale price, includes list, CTA, and optional countdown timer.
Webinar Section
Promote a live webinar or online event with date, speakers, agenda topics, countdown timer, and CTA.
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 Coming Soon from the Gutenberg inserter.