6 votes

Layout Editor

The Layout Editor is used to construct modular site content in a flexible WYSIWYG editor based on Umbraco Macros functionality.


After installing the package you need to create a new Data Type based on LayoutEditor via the Umbraco backoffice.

In the next step add LayoutEditor Data Type as a property in your Document Type.

Then add yours Macros to Layout Editor.


To render layout in the backoffice properly (same as in the front-end), add your stylesheet link to the "/Partials/LayoutEditor/Component.cshtml" partial.

In the end plug Layout Editor property in a template by adding @using JMMJ.LayoutEditor.Helpers and insert the code below:

@Html.LayoutEditor(Model.Content, "propertyAlias")

More at: GitHub


Project owner



JMMJ has 101 karma points

Project Compatibility

This project is compatible with the following versions as reported by community members who have downloaded this package:
Untested or doesn't work on Umbraco Cloud
7.9.x (untested)
7.8.x (untested)
7.7.x (100%)
7.6.x (100%)
7.5.x (100%)
7.4.x (100%)
7.3.x (untested)
7.2.x (untested)
7.1.x (untested)
7.0.x (untested)
6.1.x (untested)
6.0.x (untested)

You must login before you can report on package compatibility.

Project Information

  • Project owner: JMMJ
  • Created: 11/01/2018
  • Current version 1.0.3
  • .net Version 4.6.1
  • License MIT
  • Downloads: 70

External resources