=== Section Blocks – Landing Page Sections for the Block Editor === Contributors: technoleet, nazmul111 Tags: blocks, gutenberg blocks, landing page, pricing table, page builder Requires at least: 6.6 Tested up to: 7.1 Requires PHP: 7.4 Stable tag: 1.3.1 License: GPL-2.0-or-later License URI: https://www.gnu.org/licenses/gpl-2.0.html 25 ready-made blocks for the block editor: hero, pricing, FAQ, testimonials, icon boxes, logo clouds and more. Free, lightweight, no account needed. == Description == Build beautiful landing pages in the WordPress block editor — no page builder needed. Pick a section, change the text, publish. Every block follows your theme's colors and fonts and looks great on desktop and mobile. https://youtu.be/IVlSIj16_A4 **Why Section Blocks** * 25 blocks: 13 complete page sections + 12 design elements * 100% free: no locked features, no account, no upsell nags in the editor * Works with any theme and follows its colors, fonts and spacing * Responsive and accessible: keyboard friendly, reduced-motion aware * Lightweight: each block only loads its own CSS and JS on pages that use it * Per-block Responsive Visibility (hide on desktop, tablet or mobile) and Custom CSS * Built-in FAQ schema for search engines = Sections = **Hero Section** — Eye-catching hero with background image, overlay, heading, subtitle and call-to-action button. **Features Section** — Showcase features in a 3–6 column responsive grid with icons and an optional side image. **Services Section** — Service cards with icons or images, 2–4 columns, hover effects and buttons. **Steps Timeline** — Multi-step processes in vertical, horizontal or zigzag layouts with connectors and scroll animations. **Video CTA Section** — Video call to action for YouTube, Vimeo or self-hosted video. **Testimonials Section** — Customer quotes with star ratings and photos, as a grid or carousel. **Pricing Tables** — Plan comparison with feature lists, monthly/yearly toggle and a highlighted plan. **Team Members** — Team grids in Card, Overlay, Minimal or Professional styles with social links. **FAQ / Accordion** — Accessible accordion with search, categories and FAQ schema. **Gallery Portfolio** — Masonry or grid galleries with filterable categories and a lightbox. **Newsletter Signup** — Email capture with Mailchimp, a custom API or WordPress storage, privacy consent and spam protection. **Call to Action** — Conversion sections with solid, gradient or image backgrounds and two buttons. **Advanced Container** — A layout container for any blocks: boxed, wide or full width, with color, gradient or image backgrounds. = Elements = **Advanced Heading** — Heading with eyebrow text, subheading, decorative separator and optional gradient text. **Icon Box** — Icon, title and text in several styles; the whole box can be a link. **Button Group** — Several buttons side by side with styles, icons, alignment and stacking on mobile. **Icon List** — Checklists and feature lists with custom icons, columns and dividers. **Image Box** — Image with title and text as a card, overlay or side-by-side layout. **Star Rating** — Accessible star ratings with half stars and an optional label. **Logo Cloud** — Partner and client logos in a grid or an infinite scrolling marquee with a Pause button (static for visitors who prefer reduced motion). **Callout** — Info, success, warning, tip and danger notices with icons. **Social Share** — Share links for X, Facebook, LinkedIn, WhatsApp, Reddit and email. No tracking, no external scripts. **Author Box** — Author bio from the post author or custom details, with avatar and links. **Promo Banner** — Image banner with badge, heading, text and button for offers and announcements. **Shape Divider** — Wave, curve, tilt, zigzag and other SVG dividers between sections. == Installation == 1. Upload the plugin files to `/wp-content/plugins/section-blocks`, or install directly through the WordPress plugins screen. 2. Activate the plugin through the 'Plugins' screen in WordPress. 3. In the block editor, open the inserter and find the blocks under "Section Blocks" and "Section Blocks – Elements". 4. For newsletter features, configure settings under **Settings > Newsletter Settings**. == Frequently Asked Questions == = How many blocks are included? = 25: 13 page sections (Hero, Features, Services, Steps Timeline, Video CTA, Testimonials, Pricing Tables, Team Members, FAQ, Gallery Portfolio, Newsletter Signup, Call to Action, Advanced Container) and 12 design elements (Advanced Heading, Icon Box, Button Group, Icon List, Image Box, Star Rating, Logo Cloud, Callout, Social Share, Author Box, Promo Banner, Shape Divider). = How do I configure newsletter integrations? = Go to **Settings > Newsletter Settings** in your WordPress admin to configure your Mailchimp API key, custom API endpoint, reCAPTCHA settings, and view the subscriber list. = Are the blocks responsive? = Yes. All blocks are built mobile-first and automatically adapt to different screen sizes. = Can I customize colors and typography? = Yes. Every block has extensive customization options for colors, typography, spacing, and layout in the block editor sidebar. = Do the blocks work with any WordPress theme? = Yes. The blocks are designed to work with any properly coded WordPress theme that supports the block editor. = Is the plugin accessible? = Yes. All blocks include proper ARIA labels, semantic HTML markup, and follow WordPress accessibility guidelines. = Does the Newsletter block store subscriber data? = When using the default WordPress storage option, email addresses are stored in your WordPress database. You can view and manage them under Settings > Newsletter Settings. An uninstall routine removes this data when the plugin is deleted. = Can I use Mailchimp for newsletters? = Yes. Enter your Mailchimp API key and list ID under Settings > Newsletter Settings, then select "Mailchimp" as the integration type in the Newsletter Signup block settings. == Screenshots == 1. A complete landing page built only with Section Blocks: hero, features, pricing, testimonials, FAQ and call to action. 2. Every section is responsive and looks polished on desktop and mobile. 3. All blocks live in their own "Section Blocks" inserter category, so adding a section takes one click. 4. Edit text right on the canvas and style each section from the block sidebar, including Responsive Visibility and Custom CSS. 5. Pricing Tables with a monthly/yearly billing toggle and a highlighted plan. 6. Testimonials and the FAQ Accordion, which adds FAQ schema for search engines. == Upgrade Notice == = 1.3.0 = Adds 12 new design element blocks (25 blocks in total) and renames the plugin to "Section Blocks – Landing Page Sections for the Block Editor". = 1.2.9 = Fixes Features Section columns, Pricing Tables on phones and with wide/full alignment, and Custom CSS that could be overridden by default block styles. = 1.2.8 = Security update: restricts per-block Custom CSS to administrators and editors, and fixes output escaping. Now requires WordPress 6.6 or later. == Changelog == = 1.3.1 = * Change: The plugin author is now Technoleet. = 1.3.0 = * New: 12 element blocks — Advanced Heading, Icon Box, Button Group, Icon List, Image Box, Star Rating, Logo Cloud, Callout, Social Share, Author Box, Promo Banner and Shape Divider. 25 blocks in total. * New: "Section Blocks – Elements" category in the block inserter. * New: Promo video on the plugin page. * Change: The plugin is now called "Section Blocks – Landing Page Sections for the Block Editor". * Fix: A button whose link is not a valid URL now renders as a plain button instead of an empty link. = 1.2.9 = * Fix: Features Section now shows the chosen number of columns (3–6) on desktop and tablet. It was always a single column. * Fix: Pricing Tables and Newsletter Signup now respect wide/full alignment, anchors, additional CSS classes, Responsive Visibility and Custom CSS. * Fix: Pricing Tables now stack into a single column on phones instead of squeezing three columns. * Fix: Per-block Custom CSS now overrides the block's default styles, even when other Section Blocks appear further down the page. * Improvement: Removed the misleading "Tablet Preview" / "Mobile Preview" label from the Hero Section in the editor. * Updated screenshots. = 1.2.8 = * Security: Per-block Custom CSS can now only be added or changed by users who can post unfiltered HTML (administrators and editors). Enforced on save; CSS an administrator already added is kept when other users edit the post. * Security: Escaped output in all block templates, including a fix for unescaped attributes in the FAQ / Accordion block. * Fix: Duplicating or copy-pasting a block no longer makes the copy share the original's custom CSS. * Fix: Custom CSS is now printed as a stylesheet in the page head instead of inside the content. * Improvement: Responsive visibility and custom CSS settings are registered on the server, so they are always available in the editor. * Improvement: Groundwork for upcoming blocks (shared components, separate Elements and Interactive inserter categories). * Change: Requires WordPress 6.6 or later. = 1.2.7 = * Added: Advanced Container block — dynamic structural container with width modes (boxed/wide/full), max-width control, and background options (color, gradient, image with overlay opacity); supports inner blocks, anchor, spacing, and align controls * Added: Responsive Visibility extension — per-block Hide on Desktop/Tablet/Mobile toggles (Inspector) that inject sb-hide-desktop/tablet/mobile classes via render_block_data and editor hooks * Added: Per-block Custom CSS — scoped CSS field per block instance using sbBlockId + selector placeholder; inline