Beaver Builder

Bread crumbs / Will Be / Placed / Here / When Available

Inline editing

Inline Editing lets you update text directly on your page without opening a separate settings window. It gives you a real-time “what you see is what you get” editing experience.

How to Use Inline Editing

  1. Hover and Click
    Move your cursor over the text or module you want to edit. When you see the text highlight or an editing outline, click to start typing.
  2. Edit in Place
    Your cursor changes to an editing cursor. Type directly into the page to update content — just like working in a word processor.
  3. Use the Toolbar
    Once you start typing, a small editing toolbar appears above or near the text. Use it to format content (bold, italic, underline, etc.).
  4. Click Outside to Save
    When you click outside the text area, your edits are automatically saved and the module returns to its normal view.

Tip: For the best view, pin the settings panel to one side of your screen. Use the drag handle to move it left or right until you see a vertical blue bar.

Editing Toolbar Options

For Text Editor Modules

  • Bold
  • Italic
  • Strikethrough
  • Underline
  • Add or edit links
  • Align text (left, center, right)

For Heading Modules

  • Bold
  • Italic
  • Strikethrough
  • Underline

When to Use Inline Editing

  • To make quick updates to text or numbers.
  • To see changes live as you type.
  • To avoid opening the full module settings window.

Modules That Support Inline Editing

  • Button: Edit the button label directly.
  • Callout: Update headings, body text, or call-to-action text.
  • Number Counter: Change the number or description inline.
  • Heading: Edit text and apply basic formatting.

Disabling Inline Editing

Developers can disable inline editing across the site by using the WordPress filter:
fl_inline_editing_enabled