Submitted by thunder3 on Sat, 02/21/2009 - 09:41
Currently, a good design choice is to use div tags with background images instead of actual img tags. Unfortunately, this doesn't gel very well with Sitecore, as it is much easier for a content author to do an upload of a new image, rather than doing a detach/attach operation on an individual image which already exists in the CMS. This essentially means that when the image is changed, a more technical person has to crack open the CSS file on the server and modify the path to the new image.
This is not an optimal situation, so I threw together a Layout for the frame, and then a Sublayout to parse through the Media Library and output CSS class definitions for each image in the Media Library in the following form:
.imagename {
background:url(/pathtoimage) 0 0 no-repeat;
39px;
40px;
}
Now our designers are happy too! However, the important part I learnt from this process was the following:
In order to 'finish the process', I made the Layout change the response type to "text/css" (because I'm a completionist like that, apparently). Much to my surprise, Sitecore changed the extension of the emitted item to have the .css extension without me having to do anything.
Clever, Sitecore....very clever.
