Icons… What web content management system developer doesn’t like icons. I mean, icons sometimes form our biggest challenge. It’s something that brings up our up-most creativity while providing active support to content editors doing their job efficiently. It’s something that’s even measurable. But at the same time, it’s often so difficult to pick the right icon.
Why icons?
Icons provide visual aid to users of the system. Whether it be developers who have to distinguish certain pieces of the solution based on an icon, so that they can quickly identify what they’re dealing with? Or content editors who actively work with content and need to distinguish content pages, rather based on their icon than on their display name?
Kentico offers out-of-the-box support for icons, but it’s not that advanced as it is with other web content management systems. Sitecore for example offers built-in support for icon selection. For both system developers and content editors. Kentico limits this support to developers and even so far that it’s not even a pleasure to take the challenge of picking the right icon.
In case you don’t recall all possible icon classes, you have to open an external web page, identify an appropriate icon, copy the icon class and paste it back into the Kentico UI. If you ask me, this has to be more straight forward and I cannot explain why Kentico hasn’t offered better UX for this yet.
Luckily, we’re developers on a mission and we tend to do stuff that’s not on the road map. We like to extend software given to us for better usability. Kentico allows us developers to bring in functionality that’s not accounted for. In order to provide better UX for icon selection, we don’t have to do much. After identifying the right FormControls, we have to write partial classes which add additional UI elements and allow icon selection through user-friendly dialog’s. Just like we’re used to do.
At EXLRT, we have created an extension to the Kentico CMS platform which supports selecting an icon from the Bootstrap glyph-icon set very easily. Without tampering with the platform itself. The extension module does not alter any core functionality nor does it override anything that comes out-of-the-box with Kentico. Making it more future proof against product updates.
This extension follows the provided out-of-the-box support for using icons on the following objects:
Page types
Page templates
Web parts
UI elements
Some impressions:
In the page type application additional UI elements have been added next to the icon class input field
Clicking ‘Select’ will open a dialog with our currently chosen icon class. Selecting another icon and confirming that by clicking ‘Save & Close’ will reflect the change in the icon class input field.
You can download the import package with support for the latest versions of Kentico on the Kentico marketplace. The source code included in the package has not been compiled, so you’re free to take a look and change to your needs.
In case you need support for earlier versions or anything else related to this implementation, don’t hesitate to contact me.
Important
This extension will not work with website projects. Only web application installations are supported. ASP.NET Website projects by nature don’t support the concept of partial classes which we use for adding the desired functionality. As mentioned earlier, feel free to use the provided code and make it work for any of your website-type projects. Also feel, free to share your ideas on this! I would love to see this functionality for all project types that Kentico supports.
This website uses cookies to provide a better user experience, personalization of content and ads, as well as the integration of social media and analysis of traffic on the internet. By clicking on 'Accept', you consent to the placing of these cookies.
