Skip to main content
RapidDev - Software Development Agency
bubble-tutorial

How to add dynamic data anywhere in a text field using keyboard shortcuts: Step-

Bubble's editor includes keyboard shortcuts that speed up inserting dynamic data into text fields, navigating the visual editor, and managing expressions efficiently. This tutorial covers the essential keyboard shortcuts for inserting dynamic data, navigating between elements and pages, using expression shortcuts in text fields, and customizing your editor workflow for maximum productivity.

What you'll learn

  • How to use keyboard shortcuts to insert dynamic data in Bubble text fields
  • How to navigate the Bubble editor quickly with shortcuts
  • How to use expression shortcuts for faster formula building
Book a free consultation
4.9Clutch rating
600+Happy partners
17+Countries served
190+Team members
Beginner7 min read10-15 minAll Bubble plansMarch 2026RapidDev Engineering Team
TL;DR

Bubble's editor includes keyboard shortcuts that speed up inserting dynamic data into text fields, navigating the visual editor, and managing expressions efficiently. This tutorial covers the essential keyboard shortcuts for inserting dynamic data, navigating between elements and pages, using expression shortcuts in text fields, and customizing your editor workflow for maximum productivity.

Overview: Keyboard Shortcuts and Dynamic Data in Bubble

This tutorial helps you become faster in the Bubble editor by mastering keyboard shortcuts for dynamic data insertion and general navigation. Whether you are building expressions in text fields, jumping between pages, or duplicating elements, these shortcuts will significantly reduce the time you spend on repetitive editor tasks.

Prerequisites

  • A Bubble app with at least one page containing text elements or inputs
  • Basic familiarity with Bubble's dynamic data expressions
  • A desktop computer with a keyboard (shortcuts do not work on tablets)

Step-by-step guide

1

Insert dynamic data into a text field using the shortcut

Click on any text element or input that supports dynamic data. When you see the text editor, type a dynamic expression by clicking the Insert dynamic data button or pressing the keyboard shortcut. In Bubble, dynamic data appears as colored tags within text fields. To insert dynamic data, click inside the text field where you want the dynamic value, then click Insert dynamic data (the blue link that appears). This opens the expression composer where you can select data sources like Current User, Current Page data, or Do a Search for. The expression composer supports typing to filter options — start typing the name of a field and the list narrows automatically.

Pro tip: When building long expressions, type the first few letters of each field name to quickly filter the dropdown options instead of scrolling through the entire list.

Expected result: Dynamic data tags appear inline within your text, showing live values from your database when previewed.

2

Use copy and paste for expressions between elements

To copy an expression from one element to another, right-click the element and select Copy expression (or use Cmd/Ctrl+C when the expression editor is active). Navigate to the target element and paste with Cmd/Ctrl+V. This works for text fields, conditional expressions, and data sources. If the pasted expression references elements that do not exist on the destination page, Bubble will show red errors — you will need to update those references manually. This shortcut saves significant time when building similar dynamic text across multiple elements.

Expected result: Expressions are copied between elements without retyping, and any broken references are flagged for correction.

3

Navigate the editor quickly with keyboard shortcuts

The Bubble editor supports several navigation shortcuts. Use Cmd/Ctrl+Z to undo and Cmd/Ctrl+Shift+Z to redo. Press Cmd/Ctrl+E to open the Search Tool, which lets you find any element, workflow, or data type across your entire app by name. Use Cmd/Ctrl+Click on an element to select it directly even if it is nested inside groups. To duplicate an element, select it and press Cmd/Ctrl+D. To delete, press the Delete or Backspace key. Hold Shift while clicking to multi-select elements for bulk operations like alignment or group creation.

Pro tip: Cmd/Ctrl+E (Search Tool) is the fastest way to find anything in a complex app — it searches across elements, workflows, Data Types, and Option Sets.

Expected result: You can navigate, search, duplicate, and modify elements in the editor without relying solely on mouse clicks.

4

Build complex expressions using chained operators

When inserting dynamic data, you can chain operators to transform values. After selecting a data source (e.g., Current Page Product's Price), click the :more... option to see available operators like :formatted as, :rounded to, :truncated to, and text operators like :find & replace, :truncated to, :append. For dates, use :formatted as to display dates in custom formats. For numbers, use :formatted as currency. Chain multiple operators by clicking each one sequentially — they apply left to right. For example: Current Page Product's Price:formatted as currency will display '$99.00' instead of '99'.

Expected result: Your dynamic expressions display formatted, transformed data exactly as intended in the preview.

5

Use the Element Tree for fast element selection

Open the Element Tree by clicking the icon in the left toolbar (it looks like a nested list). The Element Tree shows every element on the current page in a hierarchical view. Click any element name to select it instantly — this is much faster than clicking through nested groups in the visual editor. You can also drag elements within the Element Tree to reorder them or move them into different parent groups. Right-click an element in the tree to access options like Hide, Copy, Rename, or Start/edit workflow.

Expected result: You can find and select any element on the page instantly through the Element Tree, regardless of how deeply nested it is.

Complete working example

Workflow summary
1BUBBLE EDITOR KEYBOARD SHORTCUTS REFERENCE
2============================================
3
4GENERAL:
5 Cmd/Ctrl + Z Undo
6 Cmd/Ctrl + Shift + Z Redo
7 Cmd/Ctrl + S Save (auto-saves, but forces save)
8 Cmd/Ctrl + E Open Search Tool
9 Delete / Backspace Delete selected element
10
11ELEMENT OPERATIONS:
12 Cmd/Ctrl + C Copy element or expression
13 Cmd/Ctrl + V Paste element or expression
14 Cmd/Ctrl + D Duplicate element
15 Cmd/Ctrl + Click Select nested element directly
16 Shift + Click Multi-select elements
17 Arrow keys Nudge selected element by 1px
18 Shift + Arrow keys Nudge by 10px
19
20DYNAMIC DATA:
21 Click 'Insert dynamic data' in text field
22 Type to filter data source options
23 Chain operators with ':more...' button
24 Copy/paste expressions between elements
25
26NAVIGATION:
27 Element Tree Left toolbar icon (nested list)
28 Page dropdown Top-left of editor
29 Workflow tab Left sidebar
30 Data tab Left sidebar
31
32EXPRESSION OPERATORS:
33 :formatted as Format numbers/dates/currencies
34 :rounded to Round number to decimal places
35 :truncated to Limit text length
36 :find & replace Replace text within string
37 :filtered Filter a list
38 :sorted by Sort a list
39 :count Count items in a list
40 :first item Get first item from list
41 :last item Get last item from list

Common mistakes when adding dynamic data anywhere in a text field using keyboard shortcuts:

Why it's a problem: Pasting expressions that reference elements not present on the destination page

How to avoid: After pasting, check for red error indicators and update any broken references to point to the correct elements on the current page

Why it's a problem: Not using the Search Tool to find elements in complex apps

How to avoid: Use Cmd/Ctrl+E to open the Search Tool and type the element name — it searches across the entire app instantly

Why it's a problem: Building long expressions without testing intermediate results

How to avoid: Build expressions step by step, previewing the result after each operator addition using the Debugger

Best practices

  • Learn and use Cmd/Ctrl+E (Search Tool) — it is the single biggest time saver in the Bubble editor
  • Use the Element Tree for selecting deeply nested elements instead of clicking through groups
  • Type to filter when inserting dynamic data — do not scroll through long dropdown lists
  • Copy and paste expressions between similar elements to avoid retyping complex formulas
  • Use Cmd/Ctrl+Click to select elements that are hidden behind other elements
  • Chain formatting operators (:formatted as) to display data in user-friendly formats

Still stuck?

Copy one of these prompts to get a personalized, step-by-step explanation.

ChatGPT Prompt

I am working in the Bubble.io editor and want to be more productive. What are the most important keyboard shortcuts and tips for working with dynamic data expressions, navigating between elements, and building formulas quickly?

Bubble Prompt

Add a text element that displays a formatted greeting using dynamic data. Show 'Welcome back, [Current User's first name]! You have [Do a Search for Tasks where assigned_to = Current User and completed = no:count] pending tasks.' Format the task count as a number.

Frequently asked questions

Is there a shortcut to insert dynamic data without clicking the button?

In Bubble, you insert dynamic data by clicking the 'Insert dynamic data' link that appears in text fields. There is no single keyboard shortcut for this, but you can speed up the process by typing to filter the dropdown options once the expression composer opens.

Can I copy workflows between pages?

Yes. Right-click a workflow event in the Workflow tab, select Copy, navigate to another page, and paste. Be aware that references to page-specific elements may break and need to be reconnected.

What does Cmd/Ctrl+E do in the Bubble editor?

It opens the Search Tool, which lets you search for any element, workflow, Data Type, or Option Set across your entire app by name. It is the fastest way to find anything in a complex project.

Can I undo a deleted element?

Yes. Press Cmd/Ctrl+Z immediately after deleting to undo. Bubble maintains an undo history for the current editing session. If you close and reopen the editor, the undo history is lost.

Can RapidDev help optimize my Bubble editor workflow?

Yes. RapidDev can help structure your app for maximum editor efficiency, set up reusable components to minimize repetitive work, and train your team on advanced Bubble editor techniques.

How do I select an element that is hidden behind another element?

Use Cmd/Ctrl+Click to click through overlapping elements and select the one underneath. Alternatively, use the Element Tree in the left toolbar to click the exact element by name.

RapidDev

Talk to an Expert

Our team has built 600+ apps. Get personalized help with your project.

Book a free consultation

Need help with your project?

Our experts have built 600+ apps and can accelerate your development. Book a free consultation — no strings attached.

Book a free consultation

We put the rapid in RapidDev

Need a dedicated strategic tech and growth partner? Discover what RapidDev can do for your business! Book a call with our team to schedule a free, no-obligation consultation. We'll discuss your project and provide a custom quote at no cost.