How to change the site masthead logo

Changing the masthead logo image of your Pixaria website is very simple. To begin with though, you will need to have followed the instructions on how to create a new theme to put your customised files into.

Please note that these instructions are for Pixaria 2.0 and above.

Copy the required CSS template to your theme

Once you have set up your custom theme, the next step is to create a copy of the default primary CSS file 'resources/themes/Advance/css/pixaria.css' and place it into the 'templates' directory of your custom theme like this:

resources/themes/mytheme/css/pixaria.css

There are three CSS files for the front end of your website in Pixaria but to customise the masthead image, you only need to edit this file.

Edit the CSS template file

Once you have a working theme directory containing the required, CSS file, you should open it in a text editor and look for the text #masthead which defines the look and feel of the site header area.

#masthead /* Defines the background image and style of the main masthead */
    {
    height:82px;
    background-image:url('../images/masthead.jpg');
    width:100%;
    border:0px;
    margin:0px;
    padding:0px;
    }

The styles which apply to this part of the page include a URL for the masthead image and you can modify this to point to any image that you like though it's recommended that you put your custom image somewhere inside your own personal theme directory so you know where it is.

In this example, the logo file is called 'masthead.jpg' and is located in the directory resources/themes/mytheme/images/masthead.jpg. Here we're using a JPG file but you could also use a GIF image. PNG images can cause problems in Internet Explorer so it's probably best to avoid them.

Troubleshooting

If, after following these instructions, you have problems and can't see your changes take effect, check the following:

1. Your custom theme has been selected in the appearance settings control panel.
2. If template caching is on, that you have flushed the template cache.
3. The URL or path of your masthead image is correct (test it) and that the CSS has no mistakes in it.
4. That the location of your CSS template is correct (see above). If it isn't and Pixaria can't find it, it will use the default template instead which won't have your customisations in.

Go back to contents

Created: Thursday, May 3, 2007
Last edited: Saturday, May 31, 2008