Using the CSS Assistant

The Tiki CSS Assistant, introduced in Tiki 7, makes it easy to customize your site's styles in a simple WYSIWYG (what you see is what you get) environment.

1. On the Customization tab of the Admin: Look & Feel page, click the CSS Assistant link.
   
   

   Enabling the CSS Assistant
2. Tiki displays the CSS Selection window.
   
   

   The CSS Selection window
   
   

    Note

   You can click-and-drag the frame to move the CSS Selection window anywhere on the screen.
3. Click an element on the Tiki page. In this example, we will customize the title for modules.
   
   

   Selecting the module title.
4. Tiki automatically adds the correct CSS element in the Selector field:
   #module_1 h3.box-title .moduletitle
5. In the CSS Styles area, type:
   

   font-style:italic;
   font-family:serif;
   background:yellow;

   
   Tiki immediately changes the format of the module title to match the custom CSS
   
   

   The new style
   
   

    Note

   If Tiki does not display the new formatting, verify that you have entered valid CSS coding.
6. If you are finished modifying the CSS, click the Copy to Custom CSS button in the CSS Selection window.
   Tiki automatically adds (copies) the customized CSS to the Custom CSS area on the Look & Feel page.
   
   

   Your custom CSS
7. Click Apply