Try our conversational search powered by Generative AI!

Eric
Apr 25, 2016
  4035
(4 votes)

Change DisplayName (MetaData) for Image property for standard Image Dialog using EditorDescriptor

This is a very simple way of changing the “Name” for a property when showed for the editors. We had a scenario were the editors would like to know the size of images when choosing what image to use for a specific image property.

The property it self was just an ordinary ContentReference:

[UIHint(UIHint.Image)]
public virtual ContentReference Eric { get; set; }

Nothing fancy with that just that we had  validation on the pages saying that the image needed to be in a specific format like: 500px x 340px. This worked totally fine but the editor forgot the size and often picked the wrong size from the asset pane.  To fix this we created a new EditorDescriptor inheriting from the ImageReferenceEditorDescriptor. By doing so we got the same dialog for selecting images but was able to change MetaData.

 

[EditorDescriptorRegistration(UIHint = "MyImage", TargetType = typeof(ContentReference))]
public class MyImageDescriptor : ImageReferenceEditorDescriptor
{
      public override void ModifyMetadata(ExtendedMetadata metadata, IEnumerable<Attribute> attributes)
      {
          metadata.DisplayName = string.Format("{0}<br/>{1}", metadata.DisplayName, "500 x 340px");
          base.ModifyMetadata(metadata, attributes);
      }
}

 

The new property would look like:

[UIHint("MyImage")]
public virtual ContentReference Eric { get; set; }

Doing this will result in a heading can contain more information then just the “Name” set in the model.

image

This is just an example, but what we did was that we extended this a little to handle different scenarios depending on the parent data. For instance if we used an image on an articlepage we had styleguides with one size and other sizes on newspage.

Lets say you have a validation attribute with information about the size of the image. You could then get the attribute by calling: metadata.Parent.Attributes and use that in your EditorDescriptor.

Apr 25, 2016

Comments

Please login to comment.
Latest blogs
New Series: Building a .NET Core headless site on Optimizely Graph and SaaS CMS

Welcome to this new multi-post series where you can follow along as I indulge in yet another crazy experiment: Can we make our beloved Alloy site r...

Allan Thraen | Jun 14, 2024 | Syndicated blog

Inspect In Index is finally back

EPiCode.InspectInIndex was released 9 years ago . The Search and Navigation addon is now finally upgraded to support Optimizely CMS 12....

Haakon Peder Haugsten | Jun 14, 2024

Change the IP HTTP Header used for geo-lookup in Application Insights

.

Johan Kronberg | Jun 10, 2024 | Syndicated blog

Copying property values

In this article I’d like to show simple Edit Mode extension for copying property values to other language versions. In one of my previous blogposts...

Grzegorz Wiecheć | Jun 8, 2024 | Syndicated blog

Auto-translate with OpenAI GPT-4o in Optimizely CMS

Improvements for Episerver.Labs.LanguageManager! It's now possible to auto-translate both a page and its children at the same time! Additionally, m...

Tomas Hensrud Gulla | Jun 7, 2024 | Syndicated blog

Upgrade To Optimizely CMS 12 Issue: List item fields have become Required

There are many funny details to be aware of when upgrading from Episerver CMS 11 to Optimizely CMS 12. One of them that might feel a bit confusing ...

Allan Thraen | Jun 7, 2024 | Syndicated blog