Help â€ē Hints bar

Hints bar

The built-in guide that tells you what every button and field does — without leaving the page.

💡 New to programleaf? Start here.

Every page in the app has a Hints bar — a thin strip just below the toolbar. Hover over any button, toggle, or input field and the bar instantly tells you what it does. You never need to guess or search the docs just to find out what a control does.

What is the Hints bar?

The Hints bar is a narrow strip that sits directly below the toolbar on every main page in programleaf. It works like a permanent tooltip — but instead of appearing in a bubble over a control, it displays in a fixed area so it never covers your work.

When nothing is being hovered, the bar shows its default message:

"Hover over key items such as buttons and fields to see what they do."

The moment you hover over a control, that message is replaced by a specific, context-aware description of exactly what that control does in the current state.

💡
Tip

The Hints bar is especially useful when a button changes its behavior depending on the current state — for example, the Publish button shows a different hint when a program is already published versus when it is a draft.

Where it appears

The Hints bar is available on every main working page:

PageWhat the hints cover
DashboardProgram and catalog card actions — publish, customize, live control, transfer, QR code, delete, and more
Create pageItem fields, section toggles, AI method options, and the toolbar buttons
EditorToolbar actions (undo, redo, draft, AI, save), item controls (insert, move, swap, delete, drag), and every form field
Design pageColor pickers, font selectors, banner upload, section resets, and the save button
InvitationsRecipient fields, compose area, AI draft, send, resend, copy link, and delete actions
Live controlLive toggle, highlight buttons, announcements, soft lock, view/edit links, and the Test Mode indicator
Catalog editorAdding outlines, drag to reorder, per-outline actions (edit, design, view, remove, delete)

How to use it

  1. Open any page in the app — the Hints bar appears as a thin strip directly below the toolbar.
  2. Hover your mouse over any button, toggle, or input field.
  3. The Hints bar updates instantly with a description of what that control does.
  4. Move the mouse away and the bar returns to its default prompt.
â„šī¸
Note

On mobile and touch devices the Hints bar shows its default message. Hover-based hints are only active on desktop (pointer devices). The bar still occupies its space so the layout is consistent.

Showing and hiding

If you find the Hints bar takes up space you'd rather use for content, you can collapse it:

  1. Click the ✕ button on the right side of the Hints bar.
  2. The bar collapses to a small tab. Your work area expands slightly.
  3. To restore the bar, click the tab that remains.
â„šī¸
Note

Your preference is saved in your browser's local storage. The bar stays collapsed across sessions and page navigations until you explicitly re-open it. It is independent per device and browser.

💡
Tip

Keep the Hints bar open while you are learning programleaf. Once you are confident with the controls, collapse it for a cleaner workspace.

Example hints by page

Below are examples of what the Hints bar shows for common controls. These are the actual hint texts you will see in the app.

Dashboard

ControlHint text
Publish button (unpublished)"Publish — make this outline accessible via its code"
Publish button (published)"Unpublish — make this outline private (draft)"
Go Live button"Open the Live Control panel to manage this outline in real time"
Customize button"Open the editor to modify this outline's content and settings"
Delete button"Permanently delete this outline — this cannot be undone"
Transfer button"Transfer ownership of this outline to another account"
QR code button"Show the QR code that guests can scan to access this outline"

Editor toolbar

ControlHint text
Undo button"Undo the last change (Ctrl+Z)"
Redo button"Redo the last undone change (Ctrl+Y)"
Draft button"Draft view — hide the editor controls and read the outline as plain text"
AI button"Get AI suggestions to reorder, improve, or restructure your outline"
Save button"Save your outline"

Editor form fields

FieldHint text
Title field"Enter the name of your event"
Description field"Briefly describe what this event is about"
Venue field"Where is this event taking place?"
Start time field"When your event starts. Live Control's full guest capacity activates 6 hours before this time — outside that window the session runs in Test mode with a 5-viewer cap."
End time field"When your event ends. The live window stays open for 4 hours after this time to cover overruns."

Live control

ControlHint text
Go Live toggle (offline)"Click to start a live session — guests will see updates in real-time and you can highlight items and send announcements"
Go Live toggle (live)"Click to stop the live broadcast — attendees will lose the live view"
Highlight button (unhighlighted)"Highlight this item so guests can see where you are in the program"
Highlight button (highlighted)"Unhighlight — remove the live indicator for this item"
Announce button"Send a message to all guests. Use for schedule changes, timing updates, or special notes."
Test mode pill"You are outside your event's live window — viewer cap is 5. Full capacity activates within 6 hours of your event start time."
Soft lock (unlocked)"Click to lock item editing and prevent accidental changes while running your program"
Soft lock (locked)"Click to enable editing of items"
💡
Tip

State-dependent hints are one of the most useful features. Rather than showing a static label, the hint tells you what will happen if you click right now — so you always know the consequence before you act.