PHPackages                             outerweb/filament-layout-builder - PHPackages - PHPackages  [Skip to content](#main-content)[PHPackages](/)[Directory](/)[Categories](/categories)[Trending](/trending)[Leaderboard](/leaderboard)[Changelog](/changelog)[Analyze](/analyze)[Collections](/collections)[Log in](/login)[Sign up](/register)

1. [Directory](/)
2. /
3. [Utility & Helpers](/categories/utility)
4. /
5. outerweb/filament-layout-builder

ActiveLibrary[Utility & Helpers](/categories/utility)

outerweb/filament-layout-builder
================================

Layout builder for Laravel Filament

v2.1.0(3mo ago)13481[2 PRs](https://github.com/outer-web/filament-layout-builder/pulls)MITPHPPHP ^8.4CI passing

Since Mar 3Pushed 1mo agoCompare

[ Source](https://github.com/outer-web/filament-layout-builder)[ Packagist](https://packagist.org/packages/outerweb/filament-layout-builder)[ Docs](https://github.com/outerweb/filament-layout-builder)[ GitHub Sponsors](https://github.com/outer-web)[ RSS](/packages/outerweb-filament-layout-builder/feed)WikiDiscussions main Synced 1mo ago

READMEChangelogDependencies (13)Versions (15)Used By (0)

[![Filament Layout Builder](./docs/images/github-banner.png)](./docs/images/github-banner.png)

Filament Layout Builder
=======================

[](#filament-layout-builder)

[![Latest Version on Packagist](https://camo.githubusercontent.com/223e95e1fe965655dc11e47ff8f172e565d6db680fc471545363190c410e7615/68747470733a2f2f696d672e736869656c64732e696f2f7061636b61676973742f762f6f757465727765622f66696c616d656e742d6c61796f75742d6275696c6465722e7376673f7374796c653d666c61742d737175617265)](https://packagist.org/packages/outerweb/filament-layout-builder)[![GitHub Tests Action Status](https://camo.githubusercontent.com/29c4929904b1fd2a23c17f295662b892895f47076f85e14a03a50ccc099ece66/68747470733a2f2f696d672e736869656c64732e696f2f6769746875622f616374696f6e732f776f726b666c6f772f7374617475732f6f757465727765622f66696c616d656e742d6c61796f75742d6275696c6465722f72756e2d74657374732e796d6c3f6272616e63683d6d61696e266c6162656c3d7465737473267374796c653d666c61742d737175617265)](https://github.com/outer-web/filament-layout-builder/actions?query=workflow%3Arun-tests+branch%3Amain)[![GitHub Code Style Action Status](https://camo.githubusercontent.com/94a4242ad20fe5fa627bde556c164d2089e947425be42c65c76203946c65cad2/68747470733a2f2f696d672e736869656c64732e696f2f6769746875622f616374696f6e732f776f726b666c6f772f7374617475732f6f757465727765622f66696c616d656e742d6c61796f75742d6275696c6465722f6669782d7068702d636f64652d7374796c652d6973737565732e796d6c3f6272616e63683d6d61696e266c6162656c3d636f64652532307374796c65267374796c653d666c61742d737175617265)](https://github.com/outer-web/filament-layout-builder/actions?query=workflow%3A%22Fix+PHP+code+style+issues%22+branch%3Amain)[![Total Downloads](https://camo.githubusercontent.com/7e54275baff6ebfdb2c3e8b746e8c4a1dc07a51222ab4a98ecbeeab0b22689f9/68747470733a2f2f696d672e736869656c64732e696f2f7061636b61676973742f64742f6f757465727765622f66696c616d656e742d6c61796f75742d6275696c6465722e7376673f7374796c653d666c61742d737175617265)](https://packagist.org/packages/outerweb/filament-layout-builder)

This Filament plugins adds a LayoutBuilder Form Component to build layouts using custom building blocks.

Table of Contents
-----------------

[](#table-of-contents)

- [Installation](#installation)
- [Usage](#usage)
- [Changelog](#changelog)
- [License](#license)

Installation
------------

[](#installation)

You can install the package via composer:

```
composer require outerweb/filament-layout-builder
```

Add the plugin to your panel:

```
use Outerweb\FilamentLayoutBuilder\LayoutBuilderPlugin;

public function panel(Panel $panel): Panel
{
    return $panel
        // ...
        ->plugins([
            // ...
            LayoutBuilderPlugin::make(),
        ]);
}
```

Usage
-----

[](#usage)

### Creating LayoutBuilder Blocks

[](#creating-layoutbuilder-blocks)

You can easily create a LayoutBuilder block by running the following command:

```
php artisan make:filament-layout-builder-block
```

This will generate the following:

- A View Component class in `App\Views\Components\LayoutBuilder`
- A Blade view file in `resources/views/components/layout-builder`

#### The View Component class

[](#the-view-component-class)

The generated View Component class will look like this:

```