Loading...
Joomla 3.0

How to Edit the CSS files in Joomla 3.0

You can edit your css files or your index.php files directly in Joomla 3.0 from the Template Manager.  In Joomla 3.0 the new frontend Joomla template is the Beez 3.   The process to find and edit the Beez 3 Template is the same as in previous version when you were editing Beez 2.

High level overview of how to find your css files in Joomla 3.0:

  1. Go to your Joomla 3.0Template Manager
  2. Go to the Templates in Template Manager
  3. Click to edit the Beez3 Joomla 3.0 Template
  4. Edit the Template CSS file or index.php file

1.  Go to your Joomla 3.0Template Manager

Your Template Manager controls all the Joomla 3.0 you install into your Joomla 3.0 installation.  You can edit, delete, customize, activate, deactivate, install and uninstall Joomla 3.0 templates from the Template Manager.

cmsmind joomla 3 template manager 1 How to Edit the CSS files in Joomla 3.0
Joomla 3.0 – Go to the Template Manager
  • Login to your Joomla 3.0 backend administrator
  • Click on ‘Extensions’, ‘Template Manager

2.  Go to the Templates in Template Manager

You can see all the Templates installed in your Joomla 3.0 installation.  In the Templates link you can edit all the css files, index.php file, error.php file and more.

cmsmind joomla 3 template manager edit css files How to Edit the CSS files in Joomla 3.0
Joomla 3.0 – Click on Templates in Template Manager
  • Click on ‘Templates

3.  Click to edit the Beez3 Joomla 3.0 Template

Here you can see a preview of what the Joomla 3.0 templates look like before activating on your site.  You can also see if the template is a Site or Administrator template.

cmsmind joomla 3 template manager edit css files 3 How to Edit the CSS files in Joomla 3.0
Joomla 3.0 Edit Beez3 Template CSS files
  • Since we are editing the Beez3 Template css files, click on ‘Beez3 Details and Files

4.  Edit the Template CSS file or index.php file

Here you will see all the Beez3 css files to edit.

cmsmind joomla 3 template manager edit css files 4 How to Edit the CSS files in Joomla 3.0
Joomla 3.0 Edit Beez 3 Template CSS and index.php files
  • To edit your default template style and colours, you can edit the template.css file.
  • To edit your website Frontpage or the –index.php file, you can click on ‘edit main page template
  • To edit your default error page or the error.php file, you can click on ‘edit error page template’
  • To edit your print preview page when users print your website, click on ‘edit print preview template’
  • Click on ‘Save & Close’
  • Click on ‘Close’

Hope this helps you.

Thanks,

Elaine

 How to Edit the CSS files in Joomla 3.0

Elaine

Elaine is the founder of CmsMind, an online blog providing Joomla and Wordpress tutorials. Elaine lives in Toronto and when she is not online, she is either Marathon and Triathlon training or travelling and racing somewhere in the world. Find her also at: Save Money, Premium Themes and Templates, and at Webhosting Tips.

More Posts - Website

Leave a Reply

Your email address will not be published. Required fields are marked *

Captcha Captcha Reload