Episerver

PropertyList with Updated Image Support

Propertylist Resized
Covid 19
COVID-19: Digital Insights For Enterprise Action

Access Perficient’s latest insights into how you can leverage digital technologies to not only respond to the pandemic, but drive your operations forward and deliver experiences your customers need.

Get Informed

I recently encountered a challenge with an existing solution to using images in a PropertyList in Episerver. The implementation initially being used was based on the solution created by Grzegorz Wiecheć, which didn’t work for us. The use case for my project involved multiple images per item in the list, and sometimes the image property name was different. We were importing some of the data from an external service, so we couldn’t change the names. The original solution required the property to be named “Image” and it only handled one image per item. If you had more than one image property on the list item, or it wasn’t named “Image,” the CollectionEditor in Episerver would show the ContentReference ID instead of the image. This was less than ideal.
Well, necessity is the mother of invention. We needed a solution, so I got inventing. Using the original approach as a foundation for a new solution, I took a custom formatter and a new Dojo Widget. With a little bit of creativity, it evolved into an updated CollectionEditor widget that supports multiple images. Best of all, there are no hard-coded property names and no limits on how many images can be used.
Try the original approach if you only need one image on a property in a PropertyList, and plan on naming it “Image” each time. However, for added flexibility that isn’t dependent on the property name, check out my post for a solution. To warn you, it’s a bit long. There are several parts to the solution and I try to break it down for better understanding. Nonetheless, I think it’s a very useful update to an already great idea.
Check out my post about Updated Image Support in PropertyList, and leave a comment below to share additional helpful information.

About the Author

More from this Author

Leave a Reply

This site uses Akismet to reduce spam. Learn how your comment data is processed.

Subscribe to the Weekly Blog Digest:

Sign Up