texteditor

---

The texteditor property provides a rich text input or Markdown input field in PageBuilder admin interface. It allows users to add HTML content, formatted text, or Markdown depending on the configuration.

Use this property for body content, descriptions, blocks of text, or formatted user inputs.

texteditor Definition

{
  "code": "body_content",
  "prompt": "Body Content",
  "type": "texteditor",
  "required": true,
  "markdown": true,
  "placeholder": "Enter content here..."
}

Supported Fields

Field	Type	Required	Description
code	string	Yes	Unique key used in l.settings:instance.
prompt	string	Yes	Label shown in the admin interface.
type	string	Yes	Must be "texteditor".
required	boolean	No	If true, the user must input content.
placeholder	string	No	Hint text shown before entry.
markdown	boolean	No	Enables Markdown mode instead of rich text.
preview_property_selector	string	Nos	Used to target preview DOM nodes.
visibility_conditions	object	No	Used for conditional UI logic.

Field Behavior: markdown

• If markdown: true is present, the text editor switches to raw Markdown input mode.
• If omitted or false, it uses a standard WYSIWYG HTML editor.

Mode	Behavior
markdown: true	Displays a raw Markdown editor (no formatting toolbar).
markdown: false (default)	Displays a WYSIWYG editor (buttons for formatting).

l.settings:instance Structure

:body_content:value=<p>This is rich text</p>

The value will always render HTML regardless if the markdown field is enabled.

Template Usage

<div class="content-area">
  &mvte:instance:body_content:value;
</div>

JavaScript Access

<script>
  var instance = <mvt:eval expr="miva_json_encode( l.settings:instance, '' )" />;
  var content = instance.body_content.value;
</script>

defaults Definition

Set default editor content inside the defaults block:

"defaults": {
  "body_content": {
    "value": "<p>Welcome to our store!</p>"
  }
}

Best Practices

• Use placeholder to guide users with sample text.
• Use required: true to ensure users add meaningful content.
• Specify markdown: true only if users are familiar with Markdown formatting.
• For large amounts of body text or content management, prefer texteditor over basic text or textarea inputs.

---

Complete Example

{
  "code": "hero_subheading",
  "prompt": "Hero Subheading",
  "type": "texteditor",
  "required": true,
  "markdown": false,
  "placeholder": "Enter subheading content..."
}

Output

:hero_subheading:value=<p>Catchy tagline goes here</p>

Template

<div class="hero-subheading">
  &mvte:instance:hero_subheading:value;
</div>