Summit 7 Blogs

Sitecore XSLT: making reusable and strategic look sexy and one-off

Sitecore provides wonderfully flexible options for creating public-facing renderings of web content. With a little planning, “one-off” solutions can become powerful, reusable components that clients use over and over again – and users need never know of the content's boring, strategically sound double life.

In a recent project, the client wanted to create an eye-catching, one-off web site for a college recruitment event. Unlike anything we had implemented before, the one and only firm requirement was a flashy, single page site modeled on what turned out to be the jQuery PageScroller plugin.

However, the large amount of content needed – a set of 20 or more FAQs, a fact sheet, a section with details of dozens of events, one with over 30 biographies, another with a handful of videos, probably more to come later – didn’t exactly lend itself to a single page design.

We put our heads together and decided that if we were doing one slick jQuery plugin we might as well do three or four. Breaking longer sections into a series of tabs would make perfect sense. Presenting the bios as a series of thumbnails driving modal windows would be elegant. Displaying FAQs as accordioned panels would be neat.

Of course, given Photoshop and a text editor, we could create packaged, one-off solutions of this type all day long: paste in the content, and hand off the finished product to the client like a brochure to the printer. And then, next time the client wanted a slightly different combination of these features, we could repeat the whole process again. And again.

But we (with the help of Sitecore) delivered something more than a mere design solution: a content management solution.

It turned out that most of the content wasn’t yet written, and the client needed the ability to add to and change these components long after our initial engagement was over. Not only that, but the content should be displayed both on this new web site and on seventeen existing web sites. And this is why we love Sitecore: for its power, and the relative simplicity with which these seemingly nightmarish requirements can be fulfilled.

Above all else, Sitecore is a formidable content management system for public-facing sites. Implemented correctly, Sitecore components empower subject matter experts and marketers (rather than advanced Sitecore users) to take charge of their web presences: adding jQuery tabs, creating new accordions, firing modal windows, and so on, and so on, as easily as filling out a simple form – and all without recourse to or awareness of a single line of code.

Not only were we able to deliver a strikingly different “one-off” web site, but a content strategy that allowed the client to display the same content on their existing Sitecore web sites as well.  Without creating a single new template, we used XSLT to transform simple content pages into a set of tabs, modal windows and accordions.

Next time the client wants a tabbed layout, they simply add the “tabbed” XSLT rendering to a page, and point it to the items (anywhere in the Sitecore content tree) that should be rendered as tabs: an instant wow factor, and not a developer in sight.

There is a long running debate in Sitecore circles around the relative merits of XSLT renderings versus .NET controls.  In this particular case, XSLT made perfect sense. I and the other designer on the team were able to accomplish the functionality described here without the need for .NET programming. Although visually complex, the recursive logic driving the tabbed, modal window and accordion components is simple, and any benefits deriving from converting these components to.NET controls would be minimal in this case. A sensible path for more logically complex renderings would hold open the possibility of “promoting” the XSLT rendering to a .NET control. Where programmatic creation of placeholders is needed, for example, a .NET control is a necessity. In this case, we were able to achieve the required functionality without a .NET language. An awareness of the presentational and content management capabilities of Sitecore allowed us to create a site that is simultaneously design-first and content-first.