[NEW PLUGIN] DashMaster - The Ultimate Drag & Drop Dashboard Builder (Free & Pro)

Showcase Plugins
1

Hey Bubblers! :waving_hand:

Meet DashMaster! :bar_chart::sparkles:

We’ve built a ridiculously lightweight GridStack and Chart.js integration that lets you generate premium, customizable dashboards using simple Bubble workflows.

:green_circle: DashMaster FREE:

  • End-User Customization: Your users can drag, resize, and delete widgets to build their perfect workspace.
  • Auto-Saving: Automatically extracts the exact X/Y/W/H coordinates into a clean JSON to save to your database.
  • Read-Only Mode: Lock the grid with a simple Yes/No toggle for admin-defined static dashboards.
  • Built-in Widgets: Beautiful KPI Cards, dynamic Bar/Line/Doughnut Charts, and Custom HTML blocks.
  • (Note: Free version is limited to 5 widgets per dashboard and includes a small watermark).

:fire: DashMaster PRO (The Game Changer): For serious apps, we removed all limits and added features that will blow your mind:

  • :infinity: Unlimited Widgets & White-labeled.
  • :puzzle_piece: The “Holy Grail” Native Injection: Design a Group or Reusable Element in Bubble (with your own Repeating Groups and Workflows). DashMaster Pro will physically transplant it inside a resizable dashboard widget! All your Bubble workflows stay 100% intact!
  • :date: Interactive FullCalendar: A fully responsive calendar where clicking dates or events triggers Bubble workflows.
  • :clipboard: Drag & Drop Kanban: Built-in SortableJS boards. Drag cards between columns and let DashMaster update your database automatically.
  • :hourglass_not_done: Activity Feeds: Beautiful vertical CSS timelines generated from simple JSON.
  • :computer_mouse: Widget Click Sensors: Turn any widget into a giant button to trigger popups or navigation.

I’ve spent weeks optimizing the “Wait-and-Render” engine to ensure zero flickering on page load. It feels completely native.

:link: Check it out PRO Version: HERE

:link: Check it out Free Version: HERE

I can’t wait to see the insane SaaS dashboards you all build with this. Drop any questions or feature requests below! :backhand_index_pointing_down:

2

3. Native Bubble Injection (The Holy Grail)

Draw a Group on your Bubble page and give it an ID Attribute (e.g., my_custom_group).

In your workflow, use the Add Native Widget action and type my_custom_group in the bubble_html_id field. The plugin will physically move your group inside the draggable widget!

The above is from the documentation. Could you explain what this is. Why put an empty group into the widget?

Also, is it that we need to have page loaded, then workflows triggered to add different sections everytime the dashboard is viewed, or is that for the ‘building’ of the dashboard?

Is the idea that I as a developer will use this to build a dashboard or for my app users to build their own dashboards?

Where is data coming from for the different elements as it mentions calendars, charts and a whole lot more, but no details explaining how data is loaded for them. Is the data part of the JSON that is the dashboard?

3

Hey there! Thanks for the great questions. You’ve hit on the exact core concepts of how DashMaster works. Let me try to explain:

1. The “Empty Group” Misconception (Native Injection)

You are not putting an empty group into the widget. You are putting a fully functional group into it!

Imagine you build a complex Bubble Group on your page. Inside this group, you place a Bubble Repeating Group, some native Bubble buttons, dropdowns, and text elements. You give that master Group the ID my_custom_group. When you run the Add Native Widget action, DashMaster literally transplants your entire master group (and everything inside it) into the draggable widget.

Why is this the Holy Grail? Because you get the best of both worlds: The gorgeous drag-and-drop grid of DashMaster, while keeping 100% of your native Bubble workflows, database bindings, and repeating groups working perfectly inside the widget.

2. When do the workflows run? (Page Load vs. Building)

Yes, you trigger these workflows every time the dashboard is viewed (e.g., On Page Load).

The plugin is a visual rendering engine. When the page loads, you run Initialize Dashboard, then you queue up your widgets (Add KPI, Add Chart, etc.), and finally, you hit Render Dashboard to draw them on the screen. Because our engine is highly optimized, this happens in milliseconds with zero flickering. It feels completely native to the user.

3. Who is this for? Developer or End-User?

BOTH!

  • Use Case A (End-User Personalization): You define the widgets, but you let your users drag, drop, resize, and delete them. The plugin generates a Layout JSON that you save to the Current User’s database. Next time they log in, the dashboard loads their specific layout.

  • Use Case B (Developer Speed): You just want to build a static dashboard for your app quickly. You use DashMaster to design the layout, save the JSON, and then initialize the plugin with Read-Only Mode = Yes. Now, the users can look at it, but they can’t drag or move anything.

4. Where does the DATA come from?

This is a crucial distinction: The Layout JSON does NOT contain your database data. The current_layout_json generated by the plugin only stores the coordinates (X, Y, Width, Height, and Widget ID) of the blocks so it remembers where things are placed.

The actual data is injected dynamically via your Bubble workflows every time the page loads. For example, when you use the Add Calendar Widget action, there is an input field called events_json. You simply use Bubble’s dynamic data: Search for Meetings:format as text to feed your live database data directly into the widget.

This separation means your layout is saved instantly, but your charts and calendars always show real-time, up-to-date data directly from your Bubble database every time the page loads!

Let me know if that clears things up! You can also try the plugin in the demo page or check the editor page in both plugins links :rocket: