Skip to main content

Display Text

The Display Text node is one of the most fundamental and frequently used nodes in AI Flow. It displays text content, instructions, messages, or formatted information to users. Supporting both plain text and Markdown formatting, this versatile node is essential for creating clear, engaging user experiences in your workflows.

Display Text


Basic Usage

Use the Display Text node to show any text-based content to users, from simple messages to richly formatted instructions with headings, lists, and emphasis.


Inputs

Input (Green Port)

Content Source: Accepts text from previous nodes to display dynamically.

  • Connects to output from other nodes (Text nodes, AI outputs, API responses, etc.)
  • Displays whatever text is passed through this connection
  • Can be combined with static content in the Input field
  • Optional - you can use the node without connecting any input if you only want to show static content

Outputs

Output (Green Port)

Text Content: Passes the displayed text to subsequent nodes.

  • Outputs the same text that was displayed
  • Can be used as input for other nodes
  • Useful for chaining text processing or validation

Output (Red Port)

Flow Control: Continues execution to the next node in the workflow.

  • Triggers the next node after display
  • Standard flow progression connection
  • Used to connect to any subsequent node

Configuration

Input Field

Text Content Area: Large text box where you enter the content to display to users.

Features:

  • Supports plain text
  • Supports Markdown formatting
  • Supports variable interpolation using labels (e.g., {{LABEL_NAME}})
  • Multi-line content with scrolling
  • Rich text formatting options

Markdown Support:

### Headings (H3)
#### Subheadings (H4)

**Bold text**
*Italic text*

- Bullet points
- List items

1. Numbered lists
2. Sequential items

[Links](https://example.com)

> Blockquotes for emphasis

Example Content:

Lorem ipsum dolor sit amet, consectetur adipiscing elit. 
Praesent rutrum, massa vel feugiat scelerisque, ipsum
elit viverra orci, vitae laoreet eros risus sit amet
sem. Praesent purus

Example Workflows

Simple Welcome Message

Scenario: Display a welcome message at the start of a learning module.

Display Text Example

Steps to Create the Flow:

  1. Add a Start Node.

  2. Add and connect a Display Text node:

    i. Configure the Input field:

    ### Welcome to Biology 101

    In this lesson, we'll explore the fascinating world of cells.

    **Learning Objectives:**
    - Understand cell structure
    - Identify cell components
    - Explain cell functions

    ii. Connect nodes:

    • Start output (red) → Display Text input (red)
  3. Add next node (e.g., Display HTML, Form, etc.)

    • Display Text output (red) → Next node input (red)

Preview:

The user sees a formatted welcome message with a heading, introductory text, and a bulleted list of learning objectives.

Result: Clean, professional presentation that sets expectations and provides context for the learning experience.


Dynamic Content Display

Scenario: Show content generated from a previous node or user input.

Flow Structure:

[Start] → [Text Input: User enters name] 
→ [Create Text Label: Store as "NAME"]
→ [Display Text: "Welcome, {{NAME}}!"]

Steps:

  1. Add Text Input node for user to enter their name

  2. Add Create Text Label node:

    • Label Name: NAME
    • Connect Text Input output to Create Text Label input
  3. Add Display Text node:

    • Input field: ### Welcome, {{NAME}}! \n\nLet's begin your personalized learning journey.
    • Connect Create Text Label output → Display Text input

Result: Personalized greeting that dynamically includes the user's name.


Instructions with Formatting

Scenario: Provide detailed assignment instructions with clear formatting.

Content Example:

### Assignment Instructions

Please complete the following tasks:

1. **Research Phase**
- Read the provided articles
- Take notes on key concepts
- Identify 3 main themes

2. **Writing Phase**
- Draft your response (500-750 words)
- Include citations
- Use academic tone

3. **Submission**
- Review your work
- Submit by the deadline

> **Important:** Late submissions will receive a 10% penalty per day.

Need help? Contact your instructor.

Result: Clear, hierarchical instructions that are easy to follow and visually organized.


Content Formatting Guide

Headings

### Main Heading (H3)
#### Subheading (H4)
##### Smaller Heading (H5)

Text Emphasis

**Bold text** for important information
*Italic text* for emphasis or terms
***Bold and italic*** for maximum emphasis

Lists

Unordered:

- Item one
- Item two
- Nested item
- Another nested item
- Item three

Ordered:

1. First step
2. Second step
3. Third step
[Link text](https://example.com)
[Visit our website](https://aiflow.com)

Blockquotes

> Important note or callout
> Can span multiple lines

Line Breaks

First paragraph with content.

Second paragraph after line break.

  • Start Node: Often followed by Display Text for initial instructions
  • Display HTML: For more complex formatting with iframes, videos, etc.
  • Create Text Label: Store text as variables for Display Text
  • Text Input: Collect user text to display later
  • AI General Prompt: Generate content to display
  • Form: Alternative for structured content display
  • Show Button: Follow Display Text with interactive buttons
  • Progress Checkpoint: Mark completion after displaying content

Summary

The Display Text node is a versatile, essential component for creating clear, engaging user experiences:

Simple: Easy to configure and use
Flexible: Supports Markdown and variables
Fast: Instant loading, no processing overhead
Responsive: Works on all devices
Accessible: Clear content presentation

Master this fundamental node to build effective, user-friendly workflows in AI Flow.