Step 1: Enable ID Attribute
First, you need to be able to assign IDs to elements in Bubble.

Go to your app's editor and navigate to the Settings tab.

In the General sub-tab, scroll down to the "General appearance" section.

Make sure the checkbox for "Expose the option to add an ID attribute to HTML elements" is checked.

Step 2: Assign IDs to Your Elements

Now, give unique names to the group and button you want to control.

Main Group: Select the group containing all the inputs and elements you want to disable (e.g., your main form group). In the Property Editor, scroll all the way to the bottom and find the "ID Attribute" field.

Give it a simple, unique name like form_group (no spaces, no special characters).

Trigger Button: Select the button that starts the workflow (e.g., your "Save" or "Submit" button). Go to its "ID Attribute" field and give it a unique name like submit_button.

Step 3: Set Up The Workflow

The plugin works in two parts: a "disable" action at the beginning of your workflow and an "enable" action at the end.

Start the Loader (Disable):

In the workflow triggered by your button, make the very first action the plugin action: "Loader & Disable Elements".

Fill out the fields and set the Action dropdown to disable. This will immediately lock the group and show the loader.

Run Your Logic:

Place all your other workflow actions after the "disable" step. This could be creating data, running an API call, etc.

Stop the Loader (Enable):

Make the very last action in your workflow the plugin action again: "Loader & Disable Elements".

Use the exact same IDs as the first step, but this time, set the Action dropdown to enable. This hides the loader and makes everything interactive again.

Step 4: Action Fields Explained

Main Element ID: Enter the ID of the group you want to disable (e.g., form_group). Do not include the '#' symbol.

Button ID: Enter the ID of the button that triggers the workflow (e.g., submit_button). Do not include the '#' symbol.

Action:

disable: Use this at the start of a workflow to show the loader.

enable: Use this at the end of a workflow to hide the loader.

Mode (Only works on disable):

none: (Default) Disables the group and replaces the button's text with a clean three-dot loading animation.

loader: Disables the group and button, and places a semi-transparent overlay with a spinning loader on top of the entire group.

Loader Color (Only for loader mode): Choose a custom color for the spinning loader. Leave it blank for the default gray.