Customising A Logo

ezguide
easy to follow step by step guides

Summary

Several of the designs in our design library give clients the option to replace part of the design with an image of their own, whether a logo or photograph. This guide explains how.

This guide is now out of date. Since the launch of our new Design Customiser section in the Administration Area of your website you can replace feature images with alternate images or your business logo without needing to follow the steps below.

 

The Basics

The following website styles as listed in your Style & Design library support the option of allowing you to replace the standard feature image with one of your own. The feature image is the one that appears on every page of your website.

In each case, there are just 4 simple steps to customising the design with your own image.

  1. Make sure you have switched your website to use the design of your choice, accepting that initially it will include the standard feature image
  2. Find the image you want to use in its place on your own computer, and rename it to logo.jpg (If you don't see the .jpg part in the image's filename on your computer, just rename the image to logo , without the extra bit on the end)
  3. Load your new feature image into your website image library
  4. Ask our support team to activate your new feature image for your design

We will now take your through these steps in a little more detail.

Switching the Design

Let's say you want to use Chequers colourMAX. If you are not currently using this, simply log in to your Administration area, using your personal password. Click the link on the left called Style & Design, then click the radio button or "blob" next to Chequers colourMAX. Now press  Save Changes  and when you click  Exit to Website  you will see your website displayed using the new design.

Loading the New Feature Image

Before the image can be displayed on your design, it needs to be loaded into your image library. Here are the steps for this:

  1. Log into your Administration area with your password
  2. Click the Photos & Images link on the left
  3. Click the button  Add an Image  at the top
  4. A section to add an image will now be revealed, so click BROWSE (sometimes this is a Choose File button on the left of the screen depending on your browser) to find and select the logo.jpg image on your computer. Also enter your own description - in this case, we've just put "My logo"
  5. Now just click Submit Image Our systems will resize your image appropriately down to the right size for the website design you're currently using, so don't worry about choosing a sizing option. (Please be aware that depending on your internet connection speed, and your feature image size on your computer, your image may take a while to upload and resize.)

     

  6. That's it, you should now see the image listed in your image library

Activating the New Feature Image

You will need to ask the customer support team to activate the new feature image. Just send them an email saying "Please activate the image logo.jpg in my current design". Once they have done that, you will immediately see your own feature image appear on your website in place of the standard image. For a few days you then also have the option to delete your own feature image (logo.jpg) from your image library and try a different one. You don't need to ask support for help each time, as the new image will immediately display. However after a few days, the image will be locked to prevent accidental deletion, and if you want to change it again after that, you will need to email support again.

Getting Extra Help

Hopefully this guide has given you the confidence to try customising a design with your own feature image, but many clients do ask for extra help. We will happily put you in touch with one of our design partners if you need, who will help you resize images if needed, and can use special tools to ensure the images look sharp and professional. As they are trained in our systems, the process is quick and costs are low. Just email our support team if you would like us to put you in touch with someone for this work.

Appendix - Resizing Your Image Yourself

If you are using a very high quality photograph, the chances are that your feature image is several or even 10s of MBs in size, and so could take a while to upload. We'd still recommend just allowing your feature image to upload as per our instruction above, and be patient.

However, another option is to resize your feature image before you upload it into your image library. To resize the image first see our guide Resizing images using picResize, and remember to name the new file you create logo.jpg.

You will need to resize your image to the appropriate dimensions for your design. Use the table below to see what you need.

Design Style Placement of Image Dimensions
Standard colourMAX * Top left of page 10 - 300 pixels wide
110 pixels high
Standard White / Black / Green / Ochre Top left of page 110 pixels wide
130 pixels high
Chequers colourMAX * Top right of page 167 pixels wide
Any height
Curvy colourMAX Top left of page 175 pixels wide
210 pixels high
Mobile colourMAX Top left of page 181 pixels wide
250 pixels high
Social colourMAX * Top of right hand column 269 pixels wide
Any height

When resizing images for the designs marked with an asterisk, you will generally find that all you need to do is set one dimension (e.g. the width in the case of Chequers) and the resizing software will adjust the other dimension accordingly, to avoid any ugly stretching or squashing. In other words you want the height and width to shrink in equal proportion. The other Standard design requires that the dimensions are exactly as specified for height and width, and it is likely you will need to crop or pad out the image. This requires more graphics software skills. Ask our support team if you need a designer to help you with this.

Once you have finished this step, you should have a new feature image, with a filename of logo.jpg sitting on your Desktop or in your My Pictures folder. Then you just need to upload it to your image library and then ask the customer support team to activate the image. Just send them an email saying "Please activate the image logo.jpg in my current design".