BricksForge

The Bricksforge Panel is a core feature of Bricksforge, providing a powerful and flexible tool for working with JavaScript Events, GSAP Timelines, and more inside the builder.

Bricksforge Panel

Benefits
What are the benefits of using the Bricksforge Panel?

Events – You can easily listen to JavaScript events for any element in your project, including the document, window, and body. This gives you a lot of flexibility when it comes to adding custom functionality to your projects. You can also take advantage of Bricks-specific events, such as those related to the Slider element.
Event Actions – When an event is triggered, you can perform a variety of actions, including adding/removing classes, changing attributes, running a GSAP Timeline, and much more.
GSAP Animations – Create stunning GSAP Animations without writing any code. If you are a developer, you can also use custom animation objects to have full control over your animations.
Easy to use Despite its many powerful features, the Bricksforge Panel is easy to use and intuitive. You can quickly and easily create new events, actions, and animations, and manage them all from a single, easy-to-use interface.
If you want to add some custom functionality to your project, or you want to create stunning animations, the Bricksforge Panel is the perfect tool for this job.

How to use
After activating the extension, you will see a new icon in the top bar of the builder. Clicking on this icon will open the Bricksforge Panel.

Bricksforge Panel Icon

Alternatively, you can use the keyboard shortcut Ctrl + P to open the panel.

If you’ve previously opened the panel, it will stay open even after refreshing the page.

Panel Toolbar
The panel toolbar contains a number of useful buttons and options. On the left side, you see the navigation. Here, you can switch between the different tabs in the panel.

On the right side, you see the following buttons:

Save: Saves the current data.
Minimize / Maximize: Minimizes or maximizes the panel.
Focus Mode: The Focus Mode is an alternative design for the panel, which shows the controls on the left side. This is useful when you want to have more space for the preview, especially when creating animations.
Change Timeline Layout: Only available in the Timelines tab. This button allows you to change the layout of the timeline. With the new layout, the timeline will be displayed in a single row below all other columns.
Panel Settings

Clicking the “cog” icon, you will see the following options:

Grid Customization: You can customize the grid by changing the number of columns and the column width.
Horizontal Scroll: You can enable or disable the horizontal scroll. This is useful when you want to have more space for the columns on smaller screens.
Visible Bricks Panels: If enabled, the Bricksforge Panel will always leave space for the Bricks Panels.
Disable Float (Auto Adjust Builder Height): If enabled, the builder will not behave like a float element. The builder height will be adjusted automatically to fit the content. This way, you can always reach the bottom elements of the builder.
Save also Bricks Builder when saving: If enabled, the Bricks Builder will also be saved when you save the Bricksforge Panel. This saves you one click.