Home arrow How to... J!
Altering a (Free) Template

Remember our "keep moving" motto !

Once you've chosen a template that fits what you're looking for, there are usually TWO main things to do for appearance.

  • Change the header information
  • AND, get your modules positions right.


Change the header information:

The header picture and site name of your chosen template can be positioned/fixed in a variety of ways. So, we'll firstly just look at one way of changing them that should cover most possibilities:

  • We'll presume that the header picture/graphic is just one "block" and that the site name is part of the picture.
  • You need to know two things - 1/ The file name of the header picture/graphic, and 2/ its dimensions
  • First, try going to the front end of your site and opposite click on the header location that needs customising. Then choose properties, (if it appears in your opposite-click options)
  • If it does, write down the file name WITH it's file type, eg, "header_pic1.gif", then the file dimensions, eg, "750 pixels wide, 78 pixels high"
  • IF "properties" doesn't appear as an option in your opposite-click list, then you'll need to go and use media manager <path> or Xplorer and look for a preview in order to recognise the picture. It should be in the "images" folder inside the particular template folder you have set as being the default.
  • Once you recognise it, again, you need to write down the name and dimensions details as mentioned above.
  • NOW you should have the file name of the header picture and its dimensions



How to create a new header picture:

  • If you are a complete novice with making or editing graphics, go to downloads>graphics and download the free graphics program entitled "IrfanView" as well as the video package which will show you how to use it.
  • If you're not a complete novice then you should have a program already installed on your computer, if not, go and download "The Gimp". This is a very good Open Source graphics editing program which does require at least intermediate knowledge to use. (Download The Gimp here )
  • The aim now is to download a picture from the internet which you can legally use, and resize/cut it out to the domensions you noted. Then add your site name to it. Next save the result as the same file name and if possible in the same extension format.


Now replace the other Header Picture:

  • Upload your new header picture to the same location using "your ftp program" or "joomlaXplorer" and overwrite the original. If your extension is now different, you will need to go to site>template manager>site templates and look in the template index file until you see the file name in the html code. Change the extension and then save it. If you cannot find it there, it may be in the stylesheet. Navigate to the .css file for your template at site>template manager>site templates, open it and search there and change it.

Now, go back to the front end of your site, hit refresh and all going well you'll find your new image has replaced the old one, and as long as you got the dimensions correct and your site name the right size, color and position, then you're done !