| Anchor | ||||
|---|---|---|---|---|
|
| Table of Contents | ||
|---|---|---|
|
Overview
Before you make any changes, remember to create a backup of the entire ROOT directory. Creating a zip of the ROOT directory will mean you can always restore your styling back to Yellowfin's default state. This is especially important if you are new to CSS. Do not skip this step.
...
Browser | Page Instructions | Menu Instructions |
|---|---|---|
Right-click anywhere on the page and select Inspect Element from the menu | Navigate to Settings > Tools > Developer tools | |
Right-click anywhere on the page and select Inspect Element from the menu | Navigate to Firefox Menu > Web Developer > Inspect | |
Press the F12 key | Click on the Tools menu and select developer tools | |
Right-click anywhere on the page and select Inspect Element from the menu | Navigate to Opera > Page > Developer Tools > Opera Dragonfly | |
Right-click anywhere on the page and select Inspect Element from the menu | Navigate to Display > Develop > Show Web Inspector |
Note: these instructions were correct for the latest version of each browser when written, if they don't work for you please reference the help of the particular browser you are using.
...
- Make the required changes to the CSS file(s)
- Save the file(s) to the custom css directory (
Yellowfin\appserver\webapps\ROOT\customcss) - Clear your browser cache
- Reload the page that's affected by the updates and review
Note: your replacement files, stored in the customcss directory do not have to be files of the same names as the original, as long as they have the correct class names Yellowfin will use them. This means that you can condense all your custom styling into one css file if you wish, which only contains items you've customised.