London Dev Meetup Rescheduled! Due to unavoidable reasons, the event has been moved to 21st May. Speakers remain the same—any changes will be communicated. Seats are limited—register here to secure your spot!

Linh Nguyen
Nov 17, 2021
  6461
(4 votes)

Improve user experience with ContentArea and ContentReference

In EPiServer.CMS.UI 12.1.0, several user experience improvements were made.

Easily navigate to the selected item in ContentReference properties

The Edit/View command is added to the selected item, so now users can easily go to that item. If the selected item is a block, it also has the Quick Edit command.

The Edit/View command is available even if the ContentReference property is readonly

Display restriction information for ContentReference and ContentArea

You can see which content types you are allowed or disallowed to add to the current ContentArea or ContentReference, the same way ContentReferenceList has.

The old message is removed when there is no restriction.
"You can add these content types
All"

Change button text from ... to Select [Type]

The button text now explicitly indicates which content type you can select.

 

Widen the input field for ContentReference properties

ContentReference input field becomes wider. Currently it only applies for main content area. In dialogs, it still keeps the old length.

 

Nov 17, 2021

Comments

Scott Reed
Scott Reed Nov 18, 2021 08:09 AM

Looks good, the only thing is some big sites I've worked on have nearly 100 content types, so if the "Exceptions" list is everything it's going to get VERY messy

Linh Nguyen
Linh Nguyen Nov 18, 2021 07:29 PM

Hi Scott!
Thanks for your feedback. I think it's a good point and I think we can introduce a setting option to make customers be able to turn the restriction info on or off.

Scott Reed
Scott Reed Nov 18, 2021 07:31 PM

Yes or maybe you can show the first x number and click to expand or show in an overlay or something to see the full list.

Trí Lâm
Trí Lâm Jan 29, 2024 02:28 PM

Hi Linh!
I was looking for a way to disable the "Display restriction information for ContentArea" feature on Epi-Documentation. Is this feature available yet?

Linh Nguyen
Linh Nguyen Jan 29, 2024 07:20 PM

@Trí Lâm We don't have such feature. Can you explain why you want to disable the restriction information in Content Area?

Trí Lâm
Trí Lâm Jan 31, 2024 11:11 AM

The restriction information takes up too much space, so we want to hide it. It should be shown in the field descriptions.

Linh Nguyen
Linh Nguyen Feb 2, 2024 02:46 PM

I sent the feedback to our Product team. We have a draft version of how it should be. Hope that it can be released soon.

Trí Lâm
Trí Lâm Feb 7, 2024 09:40 AM

Looks good. Thank you, for your support !

Linh Nguyen
Linh Nguyen Feb 7, 2024 01:07 PM

Trí Lâm I am implementing the new design, so if everything goes well, it can be released in a month or two.
I understand it can be very annoying for the properties with many restrictions. If you cannot wait for our release, a hack that you can do is to change the css for the restriction info area like below (Note: I haven't tested it, but I think/and hope it will not break anything)

.epi-content-area-header-block,  .epi-content-reference-header-block {
    display: none;
}


Trí Lâm
Trí Lâm Mar 20, 2024 12:59 PM

Thank you, Linh!

Please login to comment.
Latest blogs
Meet the Newest OMVPs – Winter 2025 Cohort

We're excited to officially welcome the latest winter cohort of Optimizely Most Valuable Professionals (OMVPs) - a group of passionate tech...

Satata Satez | May 14, 2025

Helper method to encode query string properly

When using Url.ContentUrl() in Optimizely 12, encodes spaces as + in the query string. If you want to encode the spaces as %20, use the below helpe...

sunylcumar | May 13, 2025

Get ContentReference from GUID

Optimizely CMS 12 provides a Utility function to retrieve Content Reference from a Guid by ussing the below static method. var contentReference =...

sunylcumar | May 13, 2025

Creating a Dropdownlist in Optimizely CMS: Populate ISelectionFactory with values from another block's properties

Create a Block to hold selection options using EPiServer.Cms.Shell.UI.ObjectEditing.EditorDescriptors; using EPiServer.PlugIn; using EPiServer.Shel...

sunylcumar | May 12, 2025