Date: Fri, 29 Mar 2024 03:29:04 -0600 (MDT) Message-ID: <390588017.2809.1711704544179@confluence-external-wiki> Subject: Exported From Confluence MIME-Version: 1.0 Content-Type: multipart/related; boundary="----=_Part_2808_379532807.1711704544179" ------=_Part_2808_379532807.1711704544179 Content-Type: text/html; charset=UTF-8 Content-Transfer-Encoding: quoted-printable Content-Location: file:///C:/exported.html
It is also important to remember to clear your browser cache before atte= mpting to view any changes you've made. This will ensure you don't get a co= mbination of old and new styles and images on your page, only the current c= orrect version.
Within the ROOT directory in your Yellowfin installation, there are two = custom directories used for restyling:
Yellowfin\appserver\webapps\ROOT\customcss
)Yellowfin\appserver\webapps\ROOT\customimages
)These directories should contain any customised versions of images and c= ss that are to be used in the place of Yellowfin original images. These fil= es are stored in custom directories so that the original files can remain i= ntact. It also means that when Yellowfin is updated they are not touched, a= s the custom directories are not modified during the update.
Once you have a tool to use, you need to:
ie.css
, as this is used for the widest range of styles throughout t=
he system, with smaller files used for specific functions or pages.=20
Generally, when heavily restyling Yellowfin, including styles, the use o= f a browser's developer tools is recommended. This allows you to investigat= e elements on a page - viewing the styles being used and testing out possib= le changes before any stylesheets are changed. Most browsers have built in = developer tools, as well as some well designed plugins. The following descr= ibes how to access developer tools in some common browsers, although it's n= ot an exhaustive list.
Browser |
Page Instructions |
Menu Instructions |
---|---|---|
Right-click anywhere on the page and select <= strong>Inspect Element from the menu |
Navigate to Settings > |
|
Right-click anywhere on the page and select <= strong>Inspect Element from the menu |
Navigate to Firefox Menu >= ; Web Developer > Inspect |
|
Press the F12 key |
Click on the Tools menu and select de= veloper tools |
|
Right-click anywhere on the page and select <= strong>Inspect Element from the menu |
Navigate to Opera > |
|
Right-click anywhere on the page and select <= strong>Inspect Element from the menu |
Navigate to Display > |
Note: these= instructions were correct for the latest version of each browser when writ= ten, if they don't work for you please reference the help of the particular= browser you are using.
Once you have tried out your changes using a set of developer tools list= ed above, you will need to make your changes to Yellowfin's CSS files. In o= rder to do this we recommend you make use of a text editor that has syntax = highlighting. If you don't have something already, a free tool we like to u= se is Notepad++.
All you need to do now is:
Ye=
llowfin\appserver\webapps\ROOT\customcss
)Note: your = replacement files, stored in the customcss directory do not have to be file= s 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 c= ustom styling into one css file if you wish, which only contains items you'= ve customised.