Beginner's Guide

CUSTOMIZING EXISTING TEMPLATES
If you are reading this chapter, I assume you have already created a template style, figured out how to
work with all of the available template options, but would still like to have more possibilities. Welcome to
the world of HTML and CSS! I'll also assume that you know these two abbreviations. If not, have a look
at wikipedia for HyperText Markup Language (HTML)
72
and Cascading Styles Sheets (CSS)
73
.
In Joomla it is possible to edit all CSS used by the template within the Joomla template manager. Go
to Extensions - Template Manager - Templates and click on the link beez_20 Details. There, you will be able to
make changes in the beez2 template as well as access all modifiable files (Figure 3).
Figure 3: Beez2: Customize Template
The editable CSS files are the files that are located in the file system in the folder htdocs/templates/
[template_name]/css. Click on the linked name of the CSS file and a form will open, in which you can edit
the file content by using the CodeMirror editor. Besides the CSS files, you can also edit the three main
template files:
Main page
htdocs/templates/[template_name]/index.php
Error page
If an error occurs while opening a Joomla site, this template is used for the page.
htdocs/templates/[template_name]/error.php
Joomla! 2.5 - Beginner’s Guide
Monday, 30 January 2012! Page 194
72
http://en.wikipedia.org/wiki/Html
73
http://en.wikipedia.org/wiki/CSS