[XB] Page Builder: Visual Constructor for Custom & Landing Page

[XB] Page Builder: Visual Constructor for Custom & Landing Page 1.1.1

No permission to buy ($55.00)
Compatible XF 2.x versions
  1. 2.3
Additional requirements
https://xenbaker.com/products/xb-core-library.379/
License
Single Use License (may be used on one website)
Updates duration
6 months ($45 renewal) / $75 - 1 year ($55 yearly renewal)
Untitled.webp

1792233092488.webp
1792231315009.webp
1793057021619.webp

Turn XenForo into more than just a forum with a visual drag-and-drop page builder for custom pages, landing pages, and structured website content.

Page Builder lets you create responsive pages without coding or editing templates. Design layouts using rows, columns, and reusable content blocks, including images, galleries, FAQs, testimonials, tabs, statistics, comparison tables, discussion threads, widgets, and more.

Bring CMS-like content management to your XenForo community with multilingual pages, scheduled publishing, SEO settings, access permissions, custom styling, and reusable layouts.

​

Demo page examples are included as XML files in the add-on archive under the examples folder.


Features:​

Visual Page & Layout Builder​

  • 🧱 Drag-and-Drop Page Builder: Create custom layouts using rows, columns, and content blocks on a responsive 12-column grid.
  • 🖱️ Visual Layout Editing: Reorder rows, move columns between rows, and rearrange blocks between columns with automatic saving.
  • 📱 Responsive Layouts: Configure separate column widths for narrow screens and adjust layouts for mobile devices.
  • 📐 Column Alignment: Align content vertically, stretch columns to equal heights, use automatic equal widths, and add dividers.
  • 📋 Page & Content Duplication: Duplicate entire pages, rows, or blocks with their settings, translations, and attachments. Copied pages start disabled with unique URLs.
  • 🌐 Reusable Global Blocks: Share content across multiple pages and update it from one location without editing every page individually.
  • 🔄 Independent Block Placements: Customize anchors, CSS classes, appearance, visibility, and audience criteria for individual placements of shared blocks.
  • ✂️ Detach Global Blocks: Convert a shared block placement into an independent editable copy.
  • ⚓ Section Anchors: Create direct links to individual rows and content blocks.

Content Blocks​

  • 📅 Event Cards: Announce online, in-person, or hybrid events with three layouts, visitor time zones, translated programmes, automatic event status updates, and calendar downloads.
  • 📝 BB Code & HTML: Create formatted content with XenForo's editor, attachments, embedded images, and link previews, or write custom HTML.
  • 🚀 Calls to Action: Create promotional sections with headings, descriptions, buttons, and icons.
  • 🎯 Feature Cards: Highlight products, services, benefits, or community features using configurable cards.
  • 🔘 Flexible Buttons: Add up to 10 buttons to a call to action, with individual links, icons, styles, and translated labels.
  • 🎨 Native XenForo Buttons: Use Default, Primary, Call to action, Link, Plain, or Alternative button styles that follow the active forum style.
  • 🖼️ Image Blocks: Upload GIF, JPEG, PNG, or WebP images with translated captions, alternative text, alignment, sizing, and mobile visibility controls.
  • 🏞️ Image Galleries: Display up to 20 uploaded images using Grid, Mosaic, Filmstrip, or Cover layouts, with XenForo lightbox integration.
  • 🎬 XenForo Media Gallery: Display images, videos, audio, and embedded media from selected categories, albums, or individual media items.
  • 🎞️ Media Gallery Layouts: Choose Grid, Mosaic, Cards, List, Strip, Slider, or Showcase with responsive controls, metadata, and navigation.
  • 🎨 Illustration Presets: Add decorative compositions using nine configurable presets with adjustable colors, proportions, framing, and mobile behavior.
  • ❓ FAQ Blocks: Build collapsible frequently asked questions with formatted answers, attachments, translations, and optional expanded states.
  • 📑 Tabbed Content: Organize BB code content into tabs with translated labels, configurable navigation, and responsive layouts.
  • 📊 Statistics Blocks: Display custom statistics or live XenForo member, thread, and message totals using cards or horizontal layouts.
  • 👥 Community Team: Present selected members or automatically display staff using responsive profile cards or compact lists.
  • 📘 Instruction Steps: Create numbered guides and step-by-step instructions using vertical lists or responsive cards.
  • 🗺️ Roadmaps: Display up to 30 milestones with Planned, In progress, and Completed statuses using timelines, columns, lists, or cards.
  • 📐 Comparison Tables: Compare products, plans, features, or services using tables and responsive cards with highlighted columns.
  • ⏳ Countdown Timers: Display event deadlines using Tiles, Compact, Minimal, Hero, Split, or Flip layouts.
  • 🧵 Thread Listings: Display selected forum discussions with configurable layouts, sorting, metadata, and density.
  • 📦 Featured Resources: Display XenForo Resource Manager resources in horizontal strips, grids, or lists with category filters.
  • 🧩 XenForo Widgets: Embed existing forum widgets directly inside page columns, including widgets without assigned display positions.
  • 🎨 Icon Picker: Select Font Awesome icons for buttons and feature cards.
  • 📦 Block Containers: Display content with or without standard XenForo block containers.

Interactive Community Blocks​

  • 💬 Embedded Discussions: Display an existing XenForo thread and its replies directly inside a custom page.
  • 🧵 Discussion Layouts: Choose a full discussion with pagination or a compact view of recent replies, with an optional opening post.
  • ✏️ Native Thread Replies: Allow members to reply using XenForo's editor, attachments, quoting, and reactions while respecting forum permissions.
  • ⭐ Testimonials: Display up to 12 testimonials as responsive cards or a compact list.
  • 👤 Testimonial Authors: Use forum members with their current avatars or custom authors with uploaded images and fallback initials.
  • 🌍 Translated Testimonials: Translate quotes, captions, and author names while preserving translations when items are reordered.
  • 🔗 Testimonial Sources: Optionally associate testimonials with existing forum posts and respect their visibility.
  • ❤️ Page Reactions & Likes: Add XenForo reaction panels to entire pages or individual content blocks.
  • 👍 Like-Only Mode: Restrict a reaction panel to Like or allow all active XenForo reactions.
  • 🎨 Seven Reaction Layouts: Choose Compact Footer, Separate Card, Inline Bar, Reaction Chips, Expanded Picker, Centered Prompt, or Community.
  • 👥 Reaction Participants: Display recent members who reacted and open XenForo's native reaction list.
  • 🔄 Synchronized Reactions: Keep multiple reaction panels targeting the same page or block synchronized.

Block Appearance & Customization​

  • 🎨 Visual Appearance Controls: Customize block spacing, maximum width, alignment, surfaces, borders, corners, and shadows without writing CSS.
  • 📱 Mobile Appearance Overrides: Configure separate spacing, widths, and selected presentation settings for narrow screens.
  • 📋 Copy Block Appearance: Reuse container settings from another block or global block.
  • 🖌️ Typography Controls: Adjust content typography and readable text widths.
  • 🚀 CTA Layout Options: Control content width, heading alignment, description width, button placement, and responsive behavior.
  • 🖼️ Image Presentation: Configure image proportions, fitting, focal points, links, and corner radius.
  • 📊 Statistics Appearance: Adjust number sizes, icons, responsive columns, and optional count-up animations.
  • ❓ FAQ Appearance: Customize density, separators, and toggle positions.
  • 📑 Tab Styles: Choose native tabs, pill navigation, or vertical navigation.
  • 🧵 Thread & Resource Layouts: Customize listing density, metadata, cards, sorting, and category selection.
  • 🎨 Visual Layout Selectors: Choose display styles using labeled cards with miniature previews.
  • 👁️ Live Block Previews: Preview unsaved changes, including global blocks, with automatic or manual updates.
  • 📱 Mobile Preview: Check block presentation at a 375 px viewport width.
  • 🌍 Language Preview: Preview translated content with fallback to the master language.

Page Appearance & Languages​

  • 🌍 Multilingual Pages: Translate page titles, meta descriptions, and supported block content into configured XenForo languages.
  • 🔄 Language Fallback: Display master-language content when a translation is unavailable.
  • 🖥️ Full-Width Pages: Remove the standard page width limit for landing pages and custom layouts.
  • 👁️ Page Visibility Controls: Independently hide the site header, navigation, subnavigation, mobile menu, and footer.
  • 🧭 Breadcrumb & Notice Controls: Optionally hide breadcrumbs and notices on individual pages.
  • 🎨 Page Style Override: Force a selected XenForo style for an individual page regardless of the visitor's preferred style.
  • 🖌️ Section Backgrounds: Configure full-width row backgrounds, Hero, Content, or Page background styles, and vertical spacing.
  • 📐 Page Appearance Presets: Choose Default, Compact Sections, or Sequential Blocks to control how content sections are presented.
  • ⚙️ XenForo Style Properties: Customize Page Builder appearance independently for each forum style.
  • 🎨 Custom CSS: Assign CSS classes to pages, rows, columns, and blocks, or write page-specific CSS with optional validation.

Publishing, SEO & Page Management​

  • 🔗 SEO-Friendly URLs: Give custom pages readable URLs such as custom-pages/community-guide/.
  • 📚 Public Page Directory: Display selected published pages at custom-pages/ with descriptions and document icons.
  • ↕️ Page Ordering: Reorder pages in the ACP and use the same order in the public directory.
  • 👁️ Content Visibility: Enable or disable entire pages, individual rows, or blocks without deleting them.
  • 📅 Scheduled Publishing: Configure start and end dates for pages and rows.
  • 🔒 Audience Restrictions: Control page and block access through XenForo user criteria.
  • 🔍 SEO Meta Descriptions: Set custom meta descriptions for individual pages.
  • 🔗 Canonical URLs: Configure canonical URLs for search engines.
  • 🌐 Social Media Previews: Set translated social sharing titles and descriptions with a dedicated preview image.
  • 🚫 Noindex Control: Prevent selected pages from being indexed by search engines.
  • 🗺️ Sitemap Controls: Independently control inclusion in XenForo's sitemap.
  • 🔎 Search Visibility: Choose whether custom pages appear in XenForo search results.
  • 📦 ZIP Export & Import: Transfer pages with supported images, attachments, and content references.
  • 📄 XML Export & Import: Export individual pages or complete page collections without bundled files.
  • 🛡️ Safe Imports: Imported pages start disabled until reviewed and published.

XenForo Integration:​

  • 🔗 Page Embedding: Embed custom pages inside forum messages using their URLs or XenForo's native embed BB code.
  • 📐 Responsive Page Embeds: Display embedded pages inside automatically resizing iframes with optional expandable previews.
  • 🔒 Embed Permissions: Respect the current visitor's access permissions when displaying embedded pages.
  • 👤 Online Activity: Show accessible custom pages in XenForo member activity displays.
  • 🎯 User Criteria: Control access to entire pages and individual content blocks.
  • 🛡️ Restricted Page Access: Grant selected user groups permission to view disabled, scheduled, or otherwise restricted pages while preserving row and block restrictions.
  • 🔎 Search Integration: Index supported static page content and translations in XenForo search, including a dedicated Search Pages tab.
  • 🗺️ Sitemap Integration: Include published guest-accessible pages with canonical URLs and modification dates.
  • 🧩 Widget Integration: Reuse compatible XenForo widgets inside custom page layouts.
  • 📎 Attachments: Use XenForo attachments in BB code and FAQ content.
  • 🔌 Extensible Block Types: Allow compatible add-ons to register additional content block types.
  • 📦 Resource Manager Integration: Display featured resources when XenForo Resource Manager is installed.
  • 🎬 Media Gallery Integration: Display media, albums, and category content when XenForo Media Gallery is installed.

Requirements:​


Useful for:​

  • 🚀 Landing Pages: Create promotional pages for community launches, products, memberships, and special offers.
  • 🏠 Custom Homepages: Build structured community entry pages that highlight important content and navigation.
  • 📘 Documentation & Help Centers: Publish organized instructions, FAQs, guides, and reference pages outside regular discussions.
  • 📢 Marketing Campaigns: Create dedicated campaign pages with calls to action, testimonials, countdowns, and conversion-focused layouts.
  • 💰 Membership & Pricing Pages: Present upgrade benefits, compare plans, and guide visitors toward purchasing.
  • 🏢 About & Team Pages: Introduce your community, staff, contributors, or organization through custom layouts.
  • 📅 Events & Announcements: Publish scheduled event pages, registration information, and promotional content.
  • 🌍 International Communities: Maintain localized landing pages and informational content using shared layouts.
  • 🏗️ CMS-Like Websites: Extend XenForo with structured website pages and reusable content without installing a separate CMS.
  • 🧩 No-Code Page Creation: Let administrators build and maintain custom pages without editing XenForo templates or writing HTML.

FAQ:​

  • 🔗 How can I give a page a custom URL? Use XenForo's Route filters in the admin control panel under Setup > Route filters. For example, set Find route to custom-pages/community-guide/ and Replace with to guide/ to make the page available at /guide/.
  • ❓ Does every block support HTML and attachments? BB code and HTML content blocks support their respective editing modes. Specialized blocks have their own fields. Tabs accept BB code entered directly in the tab editor and do not support HTML or attachment uploads; instruction descriptions use plain text.
  • 📱 How do columns behave on mobile devices? Columns have separate widths for narrow screens and default to full width there. Choose a suitable column width for embedded widgets, whose layout remains controlled by their original templates and your XenForo style.
  • 📦 Which export format should I use to move a page to another site? Use a ZIP archive to include Image block files and attachments. XML does not include files. A FAQ answer containing only attachments cannot be transferred through XML if removing those references leaves it empty; the import is rejected. Copied pages and Image blocks receive independent image files.
  • 🔒 Can I delete a global block that is still in use? No. Remove or detach its page placements first. Each global block can appear only once on a page, and a global block cannot contain another global block.
  • 🔎 How are search results and translations updated? Page and block edits update the index automatically. Scheduled publication changes are processed by a task that runs every minute, subject to XenForo cron and job processing. Results use current visibility checks. Each page has one result across languages: full-text searches include translations, title-only searches use the master title, and displayed titles and snippets use the visitor's language with fallback. Existing pages can be indexed through XenForo's search index rebuild tool.
  • 🗺 Does excluding a page from the sitemap prevent search engines from indexing it? No. Use the separate noindex option to add the directive and exclude the page from the sitemap. Neither option restricts page access. Sitemap changes appear after XenForo rebuilds the sitemap.


Screenshots:​

Public Pages:​

pub_page_creator_studio.webp
A full-width landing page combining Hero sections, illustrations, feature cards and action buttons.​
pub_page_community_hub.webp
Introduce the community with a Hero section, feature cards, onboarding content, recent discussions and collapsible FAQs.​
pub_page_creator_community_guide.webp
Combine a welcome message, getting-started instructions, help links and community guidelines in a multi-column layout.​
pub_page_faq_countdown_timer.webp
Display collapsible answers, a live event countdown and a comparison table with a highlighted column.​

Page Management:​

admin_page_list.webp
Manage pages, toggle their availability and open export, duplicate and delete actions from the dropdown menu.​
admin_page_edit.webp
Configure page titles and descriptions by language, publication dates, search and sitemap inclusion, layout and custom CSS.​

Layout Builder:​

admin_page_builder.webp
Arrange rows, columns and content blocks, and select a block type from the Add block menu.​
admin_page_builder_row.webp
Set row alignment, width, background style, spacing, dividers, anchors and publication dates.​
admin_page_builder_column.webp
Choose separate column widths for desktop and narrow screens, with optional custom CSS classes.​

Content Editors:​

admin_page_builder_block_faq.webp
Create translated questions and answers, add attachments and choose whether the answer starts expanded.​
admin_page_builder_block_counter.webp
Configure statistics counters, value sources, translated labels, layout and optional number animations.​
admin_page_builder_block_instruction_steps.webp
Add translated step titles, descriptions and optional links, reorder steps and choose a vertical list or cards.​
admin_page_builder_block_comparsion_table.webp
Edit comparison columns, descriptions, buttons and feature values, reorder items and configure column highlighting and mobile layout.​
Author
Painbaker
Views
700
First release
Last update

Ratings

0.00 star(s) 0 ratings

More resources from Painbaker

Latest updates

  1. 1.1.1

    Added member checklists with five display styles, translated items and links and shared progress...
  2. 1.1.0

    🎉 More Blocks, Better Customization & Easier Page Building This major update expands Page...
Back
Top Bottom