Setting up TimeBlocks PRO is incredibly fast. Follow these steps to map your data and activate the interactive superpowers:
Step 1: Place the Element
Drag the TimeBlocks PRO element onto your page. Make sure your container has "Fit height to content" checked so the timeline can dynamically stretch when tasks stack up!

Step 2: Map your Data (The Left Column & The Tasks)

In group_ids, pass the unique identifiers for your rows (e.g., Search for Users:each item's Unique ID).

In item_group_ids, pass the corresponding row ID for each task (e.g., Search for Tasks:each item's User ID). ⚠️ Crucial: These must match exactly for the tasks to fall into the correct rows!

Fill in the rest of the item fields (item_ids, item_titles, item_starts, item_ends).

Step 3: Master the Interactions (Drag, Drop & Click)
TimeBlocks PRO uses industry-standard Calendar UX:

🖱️ Single Click / Click & Hold: Used strictly for interacting with the block (Dragging to a new row or Resizing the edges).

🖱️🖱️ Double Click: Used to open details. When a user double-clicks a block, the plugin triggers the "Task Clicked" workflow and exposes the Task ID in the element's State.

Step 4: Save Changes to your Database (Drag & Drop Workflow)

Go to your Workflows and add the Event: A TimeBlocks PRO Task Moved or Resized.

Add an Action: Data -> Make changes to a thing.

The "Thing to change" will be the task where Unique ID = This TimeBlocks PRO's dragged_task_id.

Update its Start Date with This TimeBlocks PRO's new_start_date and its End Date with new_end_date.

Update its Owner/Row with This TimeBlocks PRO's new_group_id.

(Optional: Set allow_overlap to "No" to automatically block users from dropping tasks into occupied slots!)