OpenMirai
Website Builder and Pages

Add Element IDs And Event Actions In The Web Editor

Learn how to use the Element ID and Actions area in the Web Editor to assign a unique element ID, understand validation messages, and add or review event-based actions for a selected block.

This guide explains how to use Element ID and Actions inside the Admin Web Editor.

Use it when you want to:

  • give a selected block a unique element ID
  • check whether an ID is valid or already in use
  • attach event-based actions to a block
  • review or reopen existing actions for editing

Before You Start

Open the Web Editor from System > Platform Customization.

Then open a page and select the block you want to work with from the canvas or the Outline panel.

After that, use the right-side panel and open Element ID and Actions.

What Element ID And Actions Are For

This area lets you manage two things for the selected block:

  • a unique element ID
  • actions that run when a page event happens

An event can be something like a click, input change, submit action, mouse action, focus change, page load, or scroll.

This tool is especially useful when you want to give important blocks stable IDs and attach interaction behavior to them in one place.

Use The Element ID Field

Use the element ID field when you want to give the selected block a clear unique name inside the page.

This can make advanced editing and interaction setup easier to manage later.

After you type the ID, OpenMirai saves it when you press Enter or when you leave the input field.

Understand ID Validation Messages

OpenMirai checks the element ID before accepting it.

The editor can warn you when:

  • the format is not valid
  • the same ID is already being used by another element

When the ID is valid, OpenMirai can show a green success indicator.

When the ID is invalid or duplicated, OpenMirai can show a red error indicator and a message explaining the problem.

Add A New Event Action

The Element ID and Actions area can include an add button marked with +.

Use it when you want to attach a new event-based action to the selected block.

When you open it, OpenMirai can show an event list with options such as:

  • click
  • input
  • submit
  • keyboard events
  • mouse events
  • focus
  • blur
  • load
  • scroll

Choose the event that matches the type of interaction you want to set up.

Review Existing Action Badges

If the selected block already has actions, OpenMirai can show them as badges in the same area.

These badges help you review what already exists before adding more actions.

A badge can show:

  • the event label
  • a shortened preview of the action code
  • a hint when the action is linked to a known page script function

Open An Existing Action For Editing

Select an existing action badge when you want to review or change that action.

OpenMirai then opens the editing flow for that specific action.

This helps you update the existing setup instead of recreating it from the beginning.

What Happens When No Actions Exist Yet

If no event actions are attached to the selected block yet, OpenMirai can show an empty actions message.

This is normal and simply means the block does not have any actions yet.

When To Use Element ID And Actions

Use this area when:

  • the selected block needs a stable unique ID
  • the block should respond to a page event
  • you want to review or update event-based behavior already attached to that block

What To Do Next

  • enter a valid unique ID if the block needs one
  • add or review the actions attached to the selected block
  • continue with the action editing flow if you need to change the event behavior
  • save the page after confirming the interaction setup is correct