Five New Optimizely Certifications are Here! Validate your expertise and advance your career with our latest certification exams. Click here to find out more
Five New Optimizely Certifications are Here! Validate your expertise and advance your career with our latest certification exams. Click here to find out more
Dec 11, 2018
Jan 07, 2022
CMS UI
Closed, Acceptance tests pass
Provides a built in and simple HTML attribute to make elements editable in On-Page Edit:
data-epi-edit="YourProperty"
It should be easy for front-end developers to use, so it should "just work" - meaning it does not have any specific behavior to learn about. It's equivalent to setting these properties, and setting these properties to any other value will be ignored:
As with any data-epi attributes, they should preferably not be rendered in View mode (when the visitor sees the site). One way to consistently render this attribute is to look at the global `epi.beta.isEditable` property.
To make an element editable in On-Page Edit when rendered by a client-side framework (e.g. React, Angular, Vue, etc), it was necessary to add three attributes:
<span data-epi-property-name="YourProperty" data-epi-property-render="none" data-epi-property-edittype="floating">{your JS framework decides how the value is actually rendered}</span>
It's now enough with one simple attribute:
<span data-epi-edit="YourProperty">{your JS framework decides how the value is actually rendered}</span>
Read more here: https://world.episerver.com/documentation/developer-guides/CMS/editing/on-page-editing-with-client-side-rendering/.