Design guidelines

In order for a theme to provide the most consistent rendering of output from modules and blocks, a number of styles are required in the stylesheets of a theme. PostNuke .8x mostly uses standard html tags and tries to keep custom css clases to a mimimum. This means the required styles are mostly for standard tags.

Styles for standard html tags

• body - The body tag should be styled to provide the overall look and feel to standard text.
• div, p - Division and paragraph tags should be styled to provide look and feel to standard content holders if differing from the main body style.
• a - Anchor tags should be to styled if differing from the main body style.
• h1 - h6 - All header levels should have suitable styling.
• ul, ol, li, dl, dd, dt - Unordered, ordered and definition lists should be styled.
• a img - A style is recommended for linked images. This is most commonly going to be at least a style of "border: 0px;" to remove any border on these images.
• input, select, textarea - styles should be provided for form controls if the browser defaults are not suitable for the theme.
• table, tr, td, th, thead, tbody, tfoot, caption - table styles should be provided for tables of the class pn-datatable.
• blockquotes - a style should be provided for blockquotes. Also consider adding a style for nested blockquotes.

Classes to control block and module output

The theme engine will automatically wrap the dynamically generated parts of a page in some standard classes. This allows a theme to provide styling specific to individual blocks and the modules.

The module output is wrapped using the following markup

Each block is wrapped using the following markup

Standards Support

Lastly a few css guidelines; css should also validate, Font sizes should be relative, limit the use of css hacks unless necessary (since these might break on a browser upgrade e.g. IE7).

Markup should be valid xhtml; with a doctype of at least xhtml 1.0 transitional but recommended to be xhtml 1.0 strict. Layout should be tableless and css based. Markup should be semantically correct e.g. use header tags for headers e.g. (note: block titles are currently recommend to be h4).

Compatability with modules designed for PostNuke .7x

For backwards compatability (.7x non core modules) style pn-normal (optional depending on main body style), pn-title (same as h2), pn-pagetitle (same as h1) and pn-sub (slighty smaller than pn-normal).

Theme preview images

All themes should provide three preview images for use by the theme switcher.

---

Theme Authoring Index Page
CategoryDeveloperDocs
CategoryKnowledgeBase