how to hide <SharePoint:EncodedLiteral> & <SharePointPortalControls> in edit mode

Question

I have the following inside an aspx page layout inside SharePoint web application:-

<div>
    <b>
    <SharePoint:EncodedLiteral runat="server" text="<%$Resources:cms,enterwiki_pagerating%>" EncodeMethod="HtmlEncode"/></b>
    <div>
    <SharePointPortalControls:AverageRatingFieldControl FieldName="5a14d1ab-1513-48c7-97b3-657a5ba6c742" runat="server"/></div>
</div>

but is there a way to hide the above when users are in Edit mode? i tried adding the following:-

ControlMode="Display"

inside the above but did not work, such as :-

<SharePoint:EncodedLiteral runat="server" ControlMode="Display" text="<%$Resources:cms,enterwiki_pagerating%>" EncodeMethod="HtmlEncode"/></b>
        <div>
        <SharePointPortalControls:AverageRatingFieldControl ControlMode="Display" FieldName="5a14d1ab-1513-48c7-97b3-657a5ba6c742" runat="server"/></div>

can anyone advice on this please?

Answer 1

Try putting your controls into an EditModePanel and setting the PageDisplayMode to display

    <PublishingWebControls:EditModePanel PageDisplayMode="Display" runat="server">
       tags go here
    </PublishingWebControls:EditModePanel>

This should make them only show up outside of edit mode.