Try our conversational search powered by Generative AI!

On page editing not appearing


I’ve been asked to add “on page editing” to an EpiServer 7.5 MVC site we’ve created, but to date I’ve been unable to get the infamous blue editing box to appear.

An old post by Joel Abrahamsson looked promising, but this hasn’t got it working either -

As an example, in a block property I have:       

[CultureSpecific] [AutoPopulateLanguageBranch]
[Display(Name = "Main title text", Description = "The title text that appears in caps which is transparent")]
public virtual string MainTitleText { get; set; }

And then in the view:


The only thing that I can think of that may be stopping this from working is I added some CSS to fix an issue in the editor whereby the banner around the blocks wasn’t being rendered correctly.

.content-block-edit-resize,.content-block-edit-resize div.epi-injected-minSize {    overflow:hidden !important}

I'm just wondering if anyone else has experienced this issue / has any ideas on how to get it working?


May 05, 2015 17:23

You do not need to use editattribute since you write out the same property

change that to

<h1> @html.ProperyFor(m => m.MainTitleText)</h1>

it can be problem with the css, first change to properyfor and then try to deactivate the Css

May 05, 2015 19:53


It's hard to tell. The code you posted seems fine, and that css line doesn't break AlloyTech website :)
Can you send us your Index action?

For H1 element, I would recommend you to use @Html.EditAttributes approach.

<h1 @Html.EditAttributes(x => x.MainTitleText)>@Model.MainTitleText</h1>

Generates the following HTML:

<h1 data-epi-property-name="MainTitleText" data-epi-use-mvc="True">Test</h1>


<h1>@Html.PropertyFor(x => x.MainTitleText)</h1>

generates the following HTML:

<h1><div class="epi-editContainer" data-epi-property-name="MainTitleText" data-epi-use-mvc="True">Test</div></h1>

DIV inside H1 is invalid html, and may break your design since different browsers handle invalid html differently.
For example, some of them will open and close h1 element, and then render div below h1...

May 06, 2015 11:52

Thank you both for your replies.

I’ve tried stripping out all of the css which adds classes for EpiServer, but this then just causes all of the editable boxes to appear at the top again so that’s a no-go.

I’ve tried your recommended way @Dejan, and am getting:

<div class="content-block-edit-resize" data-epi-property-name="Header" data-epi-use-mvc="True data-epi-property-rendersettings=" {"cssClass":"content-block-edit-resize"}" style="min-height: 266px;"> 
data-epi-block-Id="8096" data-epi-block-Info="{"missingrenderer":false}" data-epi-content-name="NavigatIon block" class="epi-injected-minSize"></div> 
<div data-epi-block-id="7" data-epi-block-info="{"missingrenderer":false}" data-epi-content-name="Home Page Header Content" class= "epi-injected-minSize"> <h1>WELCOME</h1> </div> 

I’ve tried to keep things minimal to test this. The page controller is simply:

    public class HomePageController : PageController<HomePage>
        public ActionResult Index(HomePage currentPage)
            return View(PageContext.Page as HomePage);

And home page view:

@model HomePage


@Html.PropertyFor(m => m.Header, new { CssClass = "content-block-edit-resize" })


@Html.PropertyFor(m => m.PageContent, new { CssClass = "content-block-edit-resize" })


@Html.PropertyFor(m => m.Footer, new { CssClass = "content-block-edit-resize " })

I've just setup alloy on a VM (the project I'm having issues with was created purely from NuGet packages), and noticed it contains a preview controller which my project doesn't. Could this have any impact on this?

Many thanks,


May 06, 2015 17:01

Anything changes if you remove UIHint?

May 07, 2015 2:01

No, the HTML output is exactly the same.

May 08, 2015 17:09
This thread is locked and should be used for reference only. Please use the Episerver CMS 7 and earlier versions forum to open new discussions.
* You are NOT allowed to include any hyperlinks in the post because your account hasn't associated to your company. User profile should be updated.