LogoLogo
9.0.x
9.0.x
  • Overview
    • About Varbase
    • Roadmap
    • Release Cycle and Supported Versions
    • How to Get Support
  • Developers
    • Getting Started
    • Installing Varbase
      • Requirements
      • Installing Varbase with DDEV
      • Installing Varbase with Lando
    • Understanding Varbase
      • Basic Concepts
      • Core Components
        • Varbase Core
          • Varbase Admin
          • Varbase Page
          • Varbase Security
          • Varbase Webform
          • Varbase Default Content
          • Varbase Tour
        • Varbase Media
        • Varbase Editor
        • Varbase Email
        • Varbase SEO
        • Varbase Workflow
        • Varbase Layout Builder
          • Varbase Landing page (Layout Builder)
          • Varbase Heading Block
          • Varbase Rich Text Block
          • Varbase HTML Code Block
          • Varbase Media (Image/Video) Block
          • Varbase Gallery Block
        • Varbase Total Control Dashboard
        • Vartheme Claro
        • Vartheme BS4
      • Optional Components
        • Varbase API
        • Varbase Internationalization
        • Varbase Media Hero Slider
        • Varbase Carousels
        • Varbase Blog
        • Varbase Search
        • Varbase Social Single Sign-On
        • Varbase Media Twitter
        • Varbase Media Instagram
        • Varbase Content Planner
        • Varbase Bootstrap Paragraphs
          • Varbase Bootstrap Paragraphs Text and Image
        • Varbase Landing Page (Paragraphs)
      • Additional Components
        • Varbase Media Header
        • Varbase FAQs
        • Varbase Reports
        • Varbase Commerce
        • Varbase YouTube Import
      • Development Components
        • Varbase Development
        • Varbase Style Guide
        • Reroute Email
        • Varbase Updates Helper
    • Configuring a Varbase Site
      • Navigation
        • Defining Active Menu Trail Using Menu Position
      • Using View Modes Inventory
      • Content Moderation and Workflows
      • URL Aliases in Varbase/Drupal
        • Configuring URL Aliases
        • Managing URL Aliases
      • Managing URL Patterns for Multilingual Websites
      • Managing Date and Time Formats to Display Across the Site
      • Using Varbase Layout Builder
        • Creating a Landing Page With Varbase Layout Builder
        • Activating Varbase Layout Builder for Content Types
      • Configuring Pathologic When Going Live
      • Configuring SEO Features
        • Disallow Oembed Media Links
      • Configuring Security Features
        • Spam Protection
        • Password Policies
        • Other Security Kits
        • Flood Contorl
        • Enable HTTP Password Authentication
      • Configuring JSON:API Features
      • Configure Varbase Media Hero Slider
      • Configuring Varbase Media Header
      • Configuring Varbase Mailer Settings
        • Configure Symfony Mailer
        • Configure Swift Mailer
        • Switch From Swift Mailer to Symfony Mailer
      • Entity Definition Update Manager Class
      • Module Installer Factory Class
    • Theme Development with Varbase
      • Understanding The Vartheme Base Theme
      • Creating Your Own Theme
      • Local Tasks and Moderation Sidebar
      • Add Preloaded Fonts in Vartheme
      • Switch From Node SASS to Dart SASS for Old Sub-Themes
    • Launching a Varbase Site to Production
    • Updating a Varbase Site
      • Understanding Varbase Updater Package
      • Handling Patches When Updating
      • Handling Configuration Updates
      • Updating Varbase to work with Composer 2.0
      • Updating Drush to the Latest Stable Version
      • Version Update Guides
        • Updating Varbase ~9.0 to Drupal 10
        • Switch from CKEditor 4 to CKEditor 5 in Varbase ~9.1.0
        • Updating from Varbase 8.x to 9.x
    • Varbase Patches
    • Frequently Asked Questions (FAQs)
    • Extending Varbase
      • Overriding Varbase
      • Creating Your Own Feature
      • Creating A Sub Profile From Varbase
        • Varbase Sub Profile Generator
        • Varbase Sub Profile Basic Template
        • Varbase Sub Profile Basic Project Template
      • Install Needed YARN and Gulp Tools
      • Compiling Provided Component Styles
      • Check Standards/Practice Coding And Linting
  • Content Designers
    • Terminology
    • Accessing the Administration Area
      • Website Environments
    • User Management
      • Allow Email/Username Login & Registration
      • Default Roles and Site Personas
        • Edit Roles' Permissions
        • Managing Roles
      • Add User
      • Edit User
      • Masquerading as another user
    • Dashboard
      • Reports
    • Content Structure
      • EntityQueues
      • Menu Management
        • Add Menu Items
        • Update Menu Items
        • Adding a Page to the Menu
      • Taxonomies
        • Manage Vocabulary
        • Edit Vocabulary
        • List Terms
        • Add Terms
        • Reorder and Edit Terms
      • Webforms
        • Setting up Emails Handler Conditions
        • Setting up Confirmations Message Settings Types
    • Content Management
      • Create Content
        • Add a Basic page
        • Add a Landing page
        • Add Blog
        • Add Media
          • Image
          • Remote video
          • Video
      • Modify Content
      • Delete Content
      • Preview Content
      • Bulk Edit Content
      • Content Moderation
      • Publish Content
      • URL Alias
    • About Layout Builder
      • Section
      • Custom Blocks
        • Heading Block
        • Basic Block
        • Media Block(Image/Video)
        • Rich-Text Editor “WYSIWYG”
      • Managing Blocks
    • Search Engine Optimization
      • XML Sitemap
      • Meta Tags in Varbase
      • URL Redirects
      • Domain Redirects
      • Prevent a Single Content From Being Indexed
    • Site Configuration
      • System
        • Clearing Varbase Cache
        • Google analytics
        • Mail templates
      • User interface
      • Development
      • Varbase settings
      • Web services
    • Common Error Handling Tips
  • Contributing
    • Contributing to Documentation
Powered by GitBook
On this page
  • Varbase Layout Builder Module
  • Used Varbase Components
  • Varbase Media Module
  • Sub Modules
  • Varbase Landing Page (Layout Builder) Module
  • Varbase Heading block Module
  • Varbase Rich text block Module
  • Varbase HTML code block Module
  • Varbase Media (image/video) block Module
  • Varbase Gallery block Module
  • Extra Layout Styling Options
  • Block Alignments
  • Edge to Edge Background
  • Container Width for Boxed Container Type
  1. Developers
  2. Understanding Varbase
  3. Core Components

Varbase Layout Builder

PreviousVarbase WorkflowNextVarbase Landing page (Layout Builder)

Last updated 1 year ago

Provides default configuration and enhancements to utilize Drupal core's Layout Builder.

Utilizing the module. Optimized for Varbase standard layouts and styling configurations. Having custom Layout options, and custom styling plugins.

Varbase Layout Builder Module

Varbase layout builder features are bundled through the Varbase Layout Builder module. GitHub: Drupal.org:

After building a project using the varbase-project template, you can see the code of the Varbase Layout Builder module in:

project_directory
|-- docroot
    |-- modules
        |-- contrib
            |-- varbase_layout_builder

Brings in the following core and contributed modules to your site:

Module

Purpose

Layout Builder

(in Drupal core)

Allows users to add and arrange blocks and content fields directly on the content.

Manage which fields & layouts are available in Layout Builder

Let site administrators place content entities as blocks.

Provides block form alter functions

A Form API element to select / add new media item.

This module is going to generate layouts with Bootstrap grid system.

Add UI styles support to blocks from Layout Builder module.

Open blocks in a modal in the Layout Builder UI.

Clean up Layout Builder layouts of non-existent blocks.

Allows to have separate layout overrides per translation.

Allows editors to add HTML attributes to Layout Builder components (blocks)

Alters the Layout Builder UI for better usability

Provides a library of layouts for content-editors to select from

Create reusable templates for single or multiple sections at the layout builder.

Add a plugins builder and a collection of reusable plugins to the Layout Builder module.

Add Bootstrap Grid support to Layout Builder module.

Used Varbase Components

Varbase Media Module

Manages type of media contents and entity browsers in the site.

Sub Modules

Varbase Landing Page (Layout Builder) Module

Having a Landing page (Layout Builder) content type and related configuration. To be used for building pages with custom sections and layouts to display content in a modern way.

Utilizing a number of block types to be used in layout builder displays.

Varbase Heading block Module

A heading block is used to add headings to your page or sections. Headings help structure your page making your content easier to read by humans and search engines.

Varbase Rich text block Module

A rich text block contains a title and a body with a rich text format.

Varbase HTML code block Module

An HTML Code block contains a title and a body with an HTML text format.

Varbase Media (image/video) block Module

A media block contains a title and media.

Varbase Gallery block Module

A gallery block contains a title and a gallery of images and videos.

Extra Layout Styling Options

Varbase Layout Builder add more layout settings. And more styling plugins.

Block Alignments

Vertical and horizontal alignments for all blocks in a section.

Edge to Edge Background

Having an edge to edge background for sections or boxed background.

Container Width for Boxed Container Type

Having more options for boxed container type. A number of width options of ( Wide, Medium, Narrow, or Tiny ).

Bootstrap Layout Builder
https://github.com/Vardot/varbase_layout_builder
https://www.drupal.org/project/varbase_layout_builder
Varbase Media
Varbase Landing page (Layout Builder)
Varbase Heading Block
Varbase Layout Builder
Varbase HTML Code Block
Varbase Media (Image/Video) Block
Varbase Gallery Block
Layout Builder Restrictions
Entity Blocks
Block Form Alter
Media Library Form API Element
Bootstrap Layouts
Layout Builder Blocks
Layout Builder Modal
Layout Builder Block Sanitizer
Layout Builder Asymmetric Translation
Layout Builder Component Attributes
Layout Builder UX
Layout Builder Library
Section Library
Bootstrap Styles
Bootstrap Layout Builder