atomsite.net

The AtomPub server for .NET

Alter an Individual Collection’s Layout and Appearance

Posted in AtomSite, Website by JarrettV on 7/21/2009 9:38:46 AM - CST

I've received multiple questions on how to alter the appearance of one collection from another if they both use the blog plugin.  The blog plugin provides multiple views on a collection such as:

ChangePageTemplate
  • Blog Entry (with expanded approval and commenting features)
  • Blog Listing (which supports view by year, month, day, category, author, contributor, etc.)
  • Blog Home
  • Windows Live Writer Manifest
  • Site Map

So, for example, when both the blog collection and page collection use the same plugin, they also use the same view.  This means that they ultimately use the same core markup for display in the browser.  However, through composition and the usage of YUI Grids, you can make one collection look very different from the other collection even if they are using the same views.

Let's take this very site, http://atomsite.net and dissect how it makes the info pages look different from the blog pages without changing the core markup.

  1. First, within the service.config file, change the YUI Grid Template for the page as seen in the picture to the right. The default value is yui-t6 but for the BlogEntry and BlogListing pages in the info collection, I've changed it to yui-t2.  This makes the side bar show up on the left side and makes it smaller.
  2. Next, change the widgets that show up in the sidebar.  For the Info Collection, I've put a table of contents index entry in the sidebar for easy navigation of the documentation.  I've also moved the search widget to below the content.
  3. Finally, tweak the CSS to get the perfect look by using the yui-t2 class selector.

TemplateCssSelector

If you need even further control over the markup, AtomSite supports having different themes across collections. 

In a future release (hopefully AtomSite 1.3), we'll add the doc and template settings to AtomSite Manager so they are easy to change. 

Learn About YUI Grids Learn More About Themes

Comments

Gravatar
Posted by Bigliz on 8/3/2009 5:40:14 AM - CST
nice

Add Comment

Login using
Google Yahoo flickr AOL
and more
Or provide your details
Please enter your name. Please enter a valid email. Please enter a valid website.
Please supply a comment.
4.5 (2)
on 8/3/2009 7:59:11 AM - CST

Recent Entries

© Copyright 2010 Powered by AtomSite 1.3.1.0