7 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


Archived files


Source code

 Download package
version 1.0.3

NuGet install instructions for Umbraco 7.4.0-7.7.0

Install-Package JMMJ.LayoutEditor

Package owner



JMMJ has 106 karma points

Package Compatibility

This package is compatible with the following versions as reported by community members who have downloaded this package:

You must login before you can report on package compatibility.

Untested or doesn't work on Umbraco Cloud
Version 11.0.x (untested)
Version 10.1.x (untested)
Version 10.0.x (untested)
Version 9.5.x (untested)
Version 9.4.x (untested)
Version 9.3.x (untested)
Version 9.2.x (untested)
Version 9.1.x (untested)
Version 9.0.x (untested)
Version 8.18.x (untested)

Package Information

  • Package owner: JMMJ
  • Created: 11/01/2018
  • Current version 1.0.3
  • .NET version 4.6.1
  • License MIT
  • Downloads on Our: 383
  • Downloads on NuGet: 2.7K
  • Total downloads : 3.1K

External resources