This post if really just for Sydney Uni web masters. If your not one then feel free to tune out now.
You may have noticed that the University recently launched it's new brand. One of the most prominent aspects of the brand's launch was the transition of the University's website into the new template.
An important feature of the new template is the addition of a new style of "banner". We call them "featured links" (see Figure 2).
Featured links are design to replace Banners (see Figure 1) and have several advantages over the old style banners:
- They conform to our new brand
- They don't use a custom font
- They don't use gradients
- Allow more than 2 lines of text
- Less reliance on using photoshop to create them
- You can build them yourself! Don't need to ask DPM to make them for you.
Creating a featured link is very simple all you have to do is make a link with a specific "class" and give it an appropriate "id". Check out the code below.
<a href="http://sydney.edu.au" class="featured-link" id="my_unique_id">My featured link</a>
Then in your featured-links.css CSS file found in your sites "styles" folder simple add a CSS reference for your new featured link. e.g.
a#my_unique_id.featured-link { background-image: url(../../images/content/featured_links/my_unique_id.gif); }
The image you link to in the CSS needs to be 40x40 pixels in size.
Now all you have to do is add the HTML anchor link to a text field in an un-bordered feature pane in the CMS. Simple isn't it? Ok maybe the process could be easier. Where working on it so watch this space.
You might be thinking "Oh what! I have to replace all my banners with featured links?". The short answer is yes. The longer answer is yes because style of banners doesn't conform to the University's new brand. But don't worry to much we don't expect you have all the banner replaced overnight. These things take time, so what we have done is used CSS to make banners render in a similar way to featured links (see Figure 3). They don't look 100% like featured links but they are close and a good temporary fix.