Have a look at this excellent blog post by Jake Jones:
https://jakejon.es/blog/adding-a-telephone-link-option-to-the-episerver-link-editor
There would be a lot of customization required to achieve this. It's purely the href attribute of an anchor element we have control over here (you can see in my example we're just prepending tel:
and doing some validation). This means you'd have to persist your button styling option in the href, and then do some custom implementation when it comes to creating the anchor element to split it back out.
Where exactly do you need this? For example, is it just in rich-text fields? Or on blocks?
Edit: I missed the subject 🤦♂️
I feel, although not really supported this is a good use case for a PropertyList (https://world.episerver.com/documentation/developer-guides/CMS/Content/Properties/generic-propertylist/)
I'm not sure what ButtonType
is in your solution, but I'm assuming it's an enum and you've got an EnumSelectionFactory (see here: https://world.episerver.com/blogs/Linus-Ekstrom/Dates/2014/5/Enum-properties-for-EPiServer-75/). You then want your button link model to look something like this (note the JsonConverter on the Url property):
public class ButtonLink
{
[Required]
[Display(
Order = 10,
Name = "Type")]
[EditorDescriptor(EditorDescriptorType = typeof(EnumEditorDescriptor<ButtonType>))]
public ButtonType ButtonType { get; set; }
[Required]
[Display(
Order = 20,
Name = "Link")]
[JsonConverter(typeof(UrlConverter))]
public Url Link { get; set; }
}
You also need to create a very simple PropertyList:
[PropertyDefinitionTypePlugIn]
public class ButtonLinkPropertyList : PropertyList<ButtonLink>
{
protected override ButtonLink ParseItem(string value)
{
return JsonConvert.DeserializeObject<ButtonLink>(value);
}
}
You can then use this wherever you need a collection of links where the button type should be definable:
[EditorDescriptor(EditorDescriptorType = typeof(CollectionEditorDescriptor<ButtonLink>))]
public virtual IList<ButtonLink> ButtonLinks { get; set; }
Hi there,
I have been asked to add a new option to the LinkItemCollection called "Button Style" to allow our editors to choose a predefined button color for links when they are creating content.
I am wondering what other EpiServer Developers would recommend on how best to approach this?
Would you try to create a customized version of LinkItemCollection? Or is there another/better way?
Here is a mockup of what the expected functionality would look like: