It’s All About the Widgets
I broke up my CSS into two widgets – one for all users, and one just for Agents, since Zendesk offers added functionality for Agents that’s not present for everyone else. The bulk of my CSS was applied to the Everyone stylesheet, and then I just tweaked the Admin stylesheet to account for the differing interface elements.
The trickiest aspect to this customization was that I needed more “hooks” (unique identifiers) to attach CSS rules to than I was provided. I applied a handful of scripts that used Prototype’s
update method we changed the content of a handful of the navigational links, and then with
insert we added a few new links (back to the main site, for example). This was all relatively painless, and so far has worked without issue.
Something to Keep in Mind
Also, the presented experience varies widely from user to user, with the forms that are being filled out and the different potential use cases for the application, so make sure to test as many of those paths as possible. Submit forms as an anonymous user, then have an Agent interact with that ticket, and make sure that all of the presented experiences are what you would expect. This does mean that you’ll clutter up your help desk a bit, but you can always go back in and remove the extraneous content before you deploy the site.
Customing Zendesk was largely an easy and pleasant experience. Getting all of the pieces in place was simple, and load times weren’t noticeably hampered by our customization. Furthermore, when we had questions, Zendesk’s support crew were quick to respond with informative answers that solved our problems quickly. Feel free to check out our support site and let us know what you think!