Online Store

Rendering custom HTML in the editor

You can choose how your custom HTML block is displayed while you work: either as plain code or fully rendered right inside the editor.

Rendering in the editor lets you see the real result immediately, adjust layout visually, and test interactive elements before publishing the site.

If something goes wrong, you can pause rendering, fix the code, and resume keeping the editor safe and responsive.

Enabling the rendering

Here’s how to do this:

  1. In the editor, add a Custom block and add an HTML Embed widget, or add an HTML embed block.
  2. Paste your HTML code into the code field.
  3. In the Rendering dropdown, choose the Website and Editor option. This option runs the code directly inside the editor.
  4. Click Submit to apply the changes.

After submitting:

  • The code will render inside the editor.
  • A banner will appear at the bottom of the screen indicating that custom code is running.
  • You can continue editing your layout normally while the code is active.

Here’s a video of the process
 

 


Pausing and resuming custom code

When rendering is active, a Rendering custom code banner appears at the bottom of the editor. It shows that custom code is running and includes Pause or Resume buttons.

If the editor becomes unresponsive (for example, the page stops scrolling) after activating rendering, it means the code is affecting the layout. In this case, click Pause. The editor will switch back to showing code instead of running it in this block. You can now review, edit, or remove your code.

When ready, click Resume to render everything again.

Ready to use your new knowledge – Go to Editor!

Was this article helpful?
0 out of 0 found this helpful