Styling wikitext headings

Following good semantic principles, when the wiki configuration option "Display page name as page title" is activated, the page title is given an h1 heading size. This means h1 is reserved for the page title, and assigning ~nc~!~/nc~ Heading One actually makes an HTML h2 heading, and so on down through the heading sizes. (This is when the normal wiki editor, not the WYSIWYG editor is being used.)

On the other hand, if "Display page name as page title" is not activated, then there's no reserved h1 heading, and assigning ~nc~!~/nc~ actually creates an HTML h1 heading. The page author is expected to keep the layout semantic, in this case.

There's a problem about specifying the CSS styles for headings, though, because there isn't consistency about what ''.wikitext h1" and ".wikitext h2," etc. apply to. It varies by one size depending on whether "Display page name as page title" is activated.

To be sure that the headings have the same appearance with both page title settings, as of Tiki 6 these selectors can be used:

.wikitext h1 {}
.wikitext h2 {}
.wikitext h3 {}
.wikitext h4 {}
.wikitext h5 {}
.wikitext h6 {}

.wikitext.nopagetitle h1 {} /* should have properties to display the same as .wikitext h2 */
.wikitext.nopagetitle h2 {} /*   "   h3  */
.wikitext.nopagetitle h3 {} /*   "   h4  */
.wikitext.nopagetitle h4 {} /*   "   h5  */
.wikitext.nopagetitle h5 {} /*   "   h6  */

See the strasa.css file in Tiki 6 for an example.

Page last modified on Sunday 17 of October, 2010 11:35:17 GMT

Switch Theme


Subscribe to Tiki Newsletters!

Delivered fresh to your email inbox!
Newsletter subscribe icon
Don't miss major announcements and other big news!
Contribute to Tiki

Site Config