J1.5:Customising the JA Purity template/customisations/Adding or changing a header colour scheme
The original JA Purity template was provided from JoomlArt.com as a zip but the latest files have been installed along with Joomla.
The relevant files, styles.css, vdot2.gif, opaque.png, icon-search.gif and header-mask.png are in the following directories:
templates/ja_purity styles/ header/XXXXXX ( XXXXXX is replaced with a color such as green or blue ) styles.css images/ vdot2.gif opaque.png icon-search.gif header-mask.png
If you've been following the tutorial you can download a tutorial version of the template that installs to the following directory:
templates/my_japurity styles/ header/XXXXXX ( XXXXXX is replaced with a color such as green or blue ) styles.css images/ vdot2.gif opaque.png icon-search.gif header-mask.png
- To add a color scheme first create a directory styles/header, named for your new color scheme such as white or grey.
- Copy the contents of one of the other colors scheme directories such as blue to your new directory
- Normally you'd be able to edit the CSS in the Joomla Administration area but that isn't an option in this case. So you'll need to edit the file directly in your choice of plain text editors such as VI or Notepad. Edit the style.css file to match your new color scheme. For instance the following changes will make a readable set of colors for a grey scheme:
- Change all instances of #006699 to #CCCCCC
- Change all instances of #C3DFED to #444444
- Change all instances of #1E7CAB to #BBBBBB
- Modify the header-mask.png to match your color scheme in your favorite graphic editor. You'll want to use a gradient tool from transparent to foreground color.
- Modify the other graphics, vdot2.gif and icon-search.gif for readability in your new scheme
Remember to refresh. reload, etc. to get the colors to show up.