Aludra
| 开发者 | rhand |
|---|---|
| 更新时间 | 2026年10月21日 10:50 |
| PHP版本: | 7.4 及以上 |
| WordPress版本: | 7.1 |
| 版权: | GPL v3 or later |
| 版权网址: | 版权信息 |
详情介绍:
Aludra is a page builder for the WordPress block editor — not a separate editing app bolted on top of it. 34 native blocks, 21 ready-made sections and 8 whole page layouts, built and edited in the editor you already have. No shortcodes, no proprietary markup, and nothing that turns into a wall of broken tags the day you switch it off.
A theme gives you the palette, the type, the header and the footer; Aludra gives you everything between them — the bands a page is actually made of: heroes, stat rails, trust bars, feature grids, pricing tiers, comparison tables, FAQs, reviews, contact sections and CTA bands.
That holds whatever the site is for. The same sections build a portfolio, a services site, a one-page launch, or a straightforward online presence for a business — the bands are the same, the copy is not.
You rarely start from an empty block. You pick a section — a hero that already has its eyebrow, heading, lead and buttons, in the right style variation — drop it in and replace the copy. Or you pick a whole page pattern and delete the parts you do not need.
What you get
- 21 section patterns — one page band each, grouped into Heroes, Proof, Features & Services, Layout and Convert. Every content block has one
- 8 page patterns — homepage, landing, service, services overview, pricing, about, team and contact, offered when you create a new page
- 34 blocks — grouped into six inserter categories that follow the order a page gets built in, and individually enable/disable-able under Settings → Aludra
- 13 more patterns — five pre-configured carousels and eight mega menu layouts for menu template parts
安装:
- Upload the plugin files to the
/wp-content/plugins/aludradirectory, or install the plugin through the WordPress plugins screen directly. - Activate the plugin through the 'Plugins' screen in WordPress.
- Blocks will be automatically available in the Gutenberg editor.
- For Mega Menu: Place inside a Navigation block to use the mega menu functionality.
- For Carousel: Add a Carousel block, then add Slide blocks inside it.
屏幕截图:
常见问题:
Does this plugin work with any theme?
Yes. Aludra is a theme-neutral block library and works with any WordPress theme — FSE, block, or classic. It is used across the Imagewize block themes (Elayne, Aviendha), and blocks reference theme color presets with fallbacks so they render correctly everywhere.
How do I build the blocks from source?
Each block has isolated dependencies and must be built separately:
cd blocks/carousel && npm install && npm run build
cd blocks/mega-menu && npm install && npm run build
cd blocks/slide && npm install && npm run build
For development mode with watch: cd blocks/[block-name] && npm start
Are the build files included?
Yes, the build/ directories are committed to the repository for Packagist distribution, so users get working blocks without needing to run build commands.
Can I customize the carousel settings?
Yes, the carousel block uses Slick Carousel which is highly customizable. You can extend the block to add additional Slick settings through the block attributes.
Does the Mega Menu work with keyboard navigation?
Yes, the mega menu block includes full keyboard navigation support, outside-click dismissal, and proper focus management for accessibility.
What is the WordPress Interactivity API?
It's WordPress's official frontend reactivity system. The mega menu block uses it for modern, reactive user interactions without heavy JavaScript frameworks.
What blocks are included, and how are they built?
Mega Menu Block
- Create dropdown mega menus with rich content
- Can only be placed inside a core/navigation block
- Uses WordPress Interactivity API for frontend state management
- Features click/keyboard navigation, outside-click dismissal, and focus management
- Supports template part integration for complex menu layouts
- Server-side rendering for dynamic content Carousel Block
- Build beautiful, responsive image and content carousels
- Powered by Slick Carousel library (1.8.1)
- Parent block that only accepts Slide blocks as children
- Assets loaded conditionally only when carousel is present on page
- Fully customizable carousel settings Slide Block
- Individual slides for use within Carousel blocks
- Uses InnerBlocks to accept any block content
- Can only exist inside Carousel parent (enforced via parent constraint)
- Flexible content options - images, text, buttons, or any WordPress blocks FAQ Tabs Block
- Interactive FAQ section with vertical tab navigation and dynamic content display
- Inline-editable questions via RichText, responsive mobile accordion layout
- Three display modes: tabs (desktop tabs / mobile accordion), accordion (stacked everywhere), and native (real / elements — no JavaScript, and browser find-in-page can expand a closed answer)
- Parent of the FAQ Tab Answer block FAQ Tab Answer Block
- Individual answer child block for FAQ Tabs, with InnerBlocks for rich content
- Editable question (tab label) and answer title
- Only valid inside the FAQ Tabs block Search Overlay Trigger Block
- Search icon that opens a full-screen search overlay with smooth animations
- Customizable overlay, search-bar, and close-button colors
- Auto-focus, body scroll lock, and multiple close methods (X, backdrop, Escape) Feature Cards Block
- Responsive grid of feature highlight cards with SVG icons and a section header
- Icons resolved via the reusable aludra/icon binding
- Theme color presets with fallbacks, so it renders correctly on any theme Icon Grid Block
- Auto-fit grid of icon + text items with an eyebrow, title, and lead
- Icons resolved via the aludra/icon binding
- Theme color presets with fallbacks Trust Bar Block
- Inline bar of trust-signal items (icon + text) that wraps on mobile
- Icons resolved via the aludra/icon binding
- Theme color presets with fallbacks Pricing Tiers Block
- Three-column pricing comparison table with featured tier highlighting
- Built from InnerBlocks so every price, feature, and button is fully editable
- Two styles: separate cards (default) or a single bordered spec sheet split by internal hairlines, with the featured tier marked by a thin accent bar Testimonial Grid Block
- Grid of customer testimonials with metrics
- Automatically becomes a Slick Carousel on larger sets (4+ cards on desktop, 2+ on mobile), otherwise renders as a static grid
- Shares the same Slick Carousel assets as the Carousel block — no duplicate library loaded CTA Columns Block
- Dual call-to-action cards with headings, descriptions, and buttons
- Color variant control via the block inspector
- Optional "Reveal on scroll" entrance animation, fading and sliding the section into view Feature List Grid Block
- Two-column grid of features with checkmarks and hover effects Contact Section Block
- Dark contact section with an intro, a two-column info/details grid, and a Contact Form 7 form card
- Contact details (email, response time, location) rendered via the aludra/icon binding
- Theme color presets with fallbacks, so it renders correctly on any theme Hero Banner Block
- Dark full-width hero with an eyebrow badge, heading, lead text, and dual CTA buttons
- Theme color presets with fallbacks, so it renders correctly on any theme Load Waterfall Block
- Animated network load-time waterfall panel with an LCP marker, for hero sections that need to show off site speed
- Site URL, badge, row labels, and the LCP label are editable via RichText; row timing/positions are fixed to match the reference design
- Respects prefers-reduced-motion Stat Rail Block
- Full-width band of big-number stats with captions, for the seam between a hero and the rest of the page
- Equal-width columns via CSS grid, so the layout isn't locked to a fixed item count
- Dark band by default, with a "Light band" style for light-ground themes — both draw their colors from the active palette
- Built from InnerBlocks — add or remove stat items freely; parent of the Stat Item block Stat Item Block
- Single big-number stat with a caption, used inside Stat Rail
- Optional "highlight" toggle to render the number in the theme's accent color
- Number and caption colors set independently from the theme palette, or a custom value
- The number can render as a heading (H1-H6) where the rail is a real section of the page, or as plain text (the default)
- Only valid inside the Stat Rail block Spine Section Block
- Page section with a sticky label/heading/aside column on the left and its content on the right
- Wraps any block as its content — nested Aludra section blocks have their own page shell suppressed so both columns align
- Collapses to a single stacked column (sticky disabled) below 860px
- Optional tinted background, and a tunable sticky offset via the --aludra-spine-top custom property Key Features
- Theme Neutral - Works with any WordPress theme; uses theme color presets with fallbacks
- Performance Optimized - Conditional asset loading (Slick Carousel only loads when needed)
- WordPress Interactivity API - Modern reactive frontend for mega menu
- Parent-Child Relationships - Carousel → Slide hierarchy enforced for better UX
- Dynamic Block Discovery - Automatically discovers and registers all blocks at runtime
- Translation Ready - Full internationalization support with text domain
- Follows WordPress block development best practices
- Each block has isolated dependencies for independent versioning
- Block metadata in block.json is single source of truth
- Build tooling via @wordpress/scripts (Webpack, Babel, etc.)
- Server-side rendering support (mega-menu)
- WordPress 6.9 or higher
- PHP 7.4 or higher
- Works with any WordPress theme (FSE, block, or classic)
src/block.json- Block metadata and configurationsrc/index.js- Registration entry pointsrc/edit.js- React editor componentsrc/save.jsx- Frontend output markupsrc/view.js- Frontend interactivity (optional)src/render.php- Server-side rendering (optional)src/editor.scss- Editor-only stylessrc/style.scss- Frontend + editor styles
更新日志:
2.39.1
- Changed: development tooling only — blocks now build from a shared npm workspace; no change to the blocks themselves
- Added: Free Shipping Progress block — a progress bar toward free shipping that updates as the WooCommerce cart changes
- Added: Sticky Add to Cart block — a product bar that appears when the add to cart form scrolls out of view
- Fixed: a stray hidden file no longer ships in the zip, as WordPress.org requires
- Fixed: the translation template now covers all translatable strings, and the Dutch translation file is repaired
- Added: WordPress.org directory assets — plugin icon and banners
- Changed: new fireworks logo and plugin icon, a nod to the Nightflowers of The Wheel of Time; credits updated
- Removed: the SVG and WebP upload filter. Core has handled WebP since 5.8, and enabling SVG uploads site-wide without sanitization was a security risk
- Changed: the carousel patterns, team pattern and two mega menu patterns now use bundled SVG placeholder images instead of linking to external image hosts
- Fixed: the Hero Carousel and Portfolio Showcase patterns no longer trigger a block-validation (deprecation migration) notice in the editor
- Changed: the carousel patterns now live in
patterns/carousel-*.phplike the other patterns; slugs and titles are unchanged
- Added: store patterns for WooCommerce sites — a store hero, shop categories, newest products, a brand story, star-rated testimonials and a full store homepage. They appear in their own "Aludra: Store" category, and only when WooCommerce is active.
- Fixed: text contrast in dark style variations (store patterns, CTA banner button, night hero accents, stat rail highlight), and the Testimonial Grid layout with three cards on wide screens.
- Fixed: five mega menu patterns and the About page pattern no longer trigger block-validation warnings on WordPress 7.1.
- Fixed: a Carousel or Testimonial Grid that came from a pattern, template or template part rather than being saved in the page itself showed as an unstyled, non-sliding list.
- Fixed: a Split Section or CTA Columns block with Reveal on Scroll turned on stayed invisible when it came from a pattern, template or template part rather than being saved in the page itself.
- Fixed: a Carousel in rail mode inside a Spine Section or Split Section stuck out past the edge of the screen on laptop and tablet widths, giving the whole page a horizontal scrollbar.
- Fixed: Spine Section, Split Section, and Comparison Table used a different gutter token than the rest of the section blocks, leaving their content edges misaligned with neighbouring sections between roughly 768px and 1366px.
- Fixed: CTA Columns block (
aludra/cta-columns) — the "Light Gray" background option had no matching CSS rule, so selecting it had no visible effect on the frontend.
- Added: Photo Grid block (
aludra/photo-grid) — heading, follow line, and a tight square photo grid for an Instagram-style feed section. Fully static and theme-neutral: authors drop in their own photos viacore/image, no API key or live connection to maintain. - Added: Instagram Embed block (
aludra/instagram-embed) — a live feed of a public Instagram profile via Instagram's own public embed iframe (instagram.com/username/embed). No developer app or API key needed, unlike the official oEmbed route Meta locked down in October 2020. The rendered markup ships only a "Load Instagram feed" button and a profile-link fallback; the iframe itself is only injected client-side after a visitor clicks it, so nothing loads from instagram.com — and no consent question is raised — until they opt in. This is an unofficial, undocumented endpoint: it could change or stop working without notice, so keep a plain profile link as a fallback. - Fixed: Settings → Aludra no longer silently disables blocks introduced by an update. The screen read the saved
aludra_enabledoption without merging in the defaults, so a block added after you last saved that screen showed up unchecked — and because saving writes "off" for every box not submitted, toggling one unrelated block then disabled those blocks for real, removing them from the inserter. Block registration always read a missing entry as enabled, so only the admin screen was affected; if this caught you, just re-enable them there.
- Security: Bumped the
@imwz/wp-pattern-sentineldev dependency to 1.1.1, which pulls in ajs-yamlfix for GHSA-5p4m-2wfm-xmqj, a quadratic CPU consumption (DoS) bug in!!omapYAML resolution.js-yamlis only used by sentinel's--trellisauto-discovery ofwordpress_sites.yml; nothing in this plugin's own runtime is affected. Older entries are trimmed to keep this section within the 5000-character limit WordPress.org enforces. The complete history is in CHANGELOG.md: https://github.com/imagewize/aludra/blob/main/CHANGELOG.md