OpenMirai
Website Builder and Pages

Add Images In The Web Editor With The Media Manager

Learn how to use the Web Editor media manager to add images by uploading a file or entering an image URL, follow upload progress, handle validation errors, and insert the selected image into your page.

This guide explains how to use the Media Manager in the Admin Web Editor.

Use it when you want to:

  • add an image to a page section
  • upload an image from your computer
  • insert an image from a direct URL
  • understand file rules before uploading
  • fix upload or URL validation problems

Before You Start

Open the Web Editor from System > Platform Customization.

Then open a page and select the image field, block setting, or media control that opens the Media Manager.

Understand What The Media Manager Does

The Media Manager is the image picker used inside the Web Editor.

When you open it from an image field or media control, it appears in a focused modal window so you can choose or upload an image without leaving the current page editor.

It lets you add an image in two ways:

  • upload an image file
  • enter an image URL

When an image is accepted, OpenMirai inserts it into the page area you were editing.

After a successful selection, the Media Manager closes automatically and returns you to the page editor.

If you close the Media Manager without choosing an image, the current page stays unchanged.

Use The Upload Tab

Open the Upload tab when you want to add an image file from your device.

The upload area supports both:

  • clicking the panel to choose a file
  • dragging and dropping a file into the upload area

While the file is dragged over the upload area, the drop zone can highlight so you know the file is ready to be dropped.

Check Supported File Types And Size

The upload area shows the supported image formats.

Supported formats include:

  • JPEG
  • PNG
  • GIF
  • WebP
  • SVG

The file size limit is 10 MB.

If the file type is not supported or the file is too large, OpenMirai shows an error message instead of uploading the image.

Follow Upload Progress

After you choose a valid file, OpenMirai starts uploading it right away.

During upload, the Media Manager can show:

  • an uploading label
  • a percentage value
  • a progress bar

While the upload is still running, upload actions are temporarily unavailable so the current upload is not interrupted.

If the upload succeeds, the selected image is inserted into the page automatically and the Media Manager closes.

Use The URL Tab

Open the URL tab when your image is already hosted online and you want to insert it by link.

In this tab:

  1. Enter the image URL.
  2. Wait for OpenMirai to validate it.
  3. Select Insert when the URL is accepted.

The Insert button only becomes available after the URL passes validation.

Fix URL Problems

If the URL field is empty, OpenMirai asks you to enter a URL.

If the URL format is not accepted, OpenMirai shows a validation message and keeps Insert unavailable.

This helps prevent broken image links from being added to the page.

Cancel Without Adding An Image

Use Cancel when you want to close the Media Manager without inserting anything.

This is useful when:

  • you opened the wrong media field
  • the image is not ready yet
  • you want to keep the current image as it is

What To Do If An Upload Fails

If OpenMirai cannot finish the upload, the Media Manager shows an error message.

When this happens:

  • check that the file is still under 10 MB
  • confirm that the file is one of the supported image formats
  • try the upload again
  • use the URL tab instead if the image is already hosted online

What To Do Next

  • review the inserted image in the page area where it was added
  • continue editing the block settings if you need to adjust related text or layout
  • save the page after confirming the image looks correct