On page editing not appearing

Peter Newsham

Vote:

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 - http://joelabrahamsson.com/episerver-editing-delight-challenge-mvc-solution/

As an example, in a block property I have:

[CultureSpecific] [AutoPopulateLanguageBranch]
[Editable(true)]
[UIHint(UIHint.Textarea)]
[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:

 x.MainTitleText)>@Model.MainTitleText

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?

Peter.

#121251

May 05, 2015 17:23

Henrik Fransas

Vote:

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

#121258

May 05, 2015 19:53

Dejan Caric

Vote:

@Peter,

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>

While

<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...

#121291

May 06, 2015 11:52

Peter Newsham

Vote:

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> 
<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> 
</div>

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

    public class HomePageController : PageController<HomePage>
    {
        [HttpGet]
        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,

Peter.

#121315

May 06, 2015 17:01

valdis

Vote:

Anything changes if you remove UIHint?

#121341

May 07, 2015 2:01

Peter Newsham

Vote:

No, the HTML output is exactly the same.

#121408

May 08, 2015 17:09

Try our conversational search powered by Generative AI!

On page editing not appearing

x.MainTitleText)>@Model.MainTitleText