Tiki Essentials    Customizing Tiki Themes    Using the CSS Assistant

Using the CSS Assistant

Related topics... Adding Custom CSS Styles Using the Theme Generator Which CSS Style to Edit

Page translation

Human Translations English Machine Translations العربية * Català * Česky * Dansk * Deutsch * Español * Greek * فارسي * Finnish * Français * Galego * עברית * Hrvatski * Indonesian * Italiano * 日本語 * 한국어 * Magyar * Lithuanian * Nederlands * Norwegian * Polish * Portuguese * Romanian * Русский * Slovenčina * Slovenščina * Albanian * Svenska * Turkish * Українська * Tiếng Việt *

Tagged as

theme css

Enter the code shown above:

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

Tiki Essentials    Customizing Tiki Themes    Using the CSS Assistant