What is a page header image?

Some of our website designs can have header images on them; header images are widescreen images that can have text/links/buttons overlaid on top of the image. You can put header images on any page of your website.

How do I add a page header image to my website?

Please note that only some of the designs will support a header image; designs that can take header images will be shown with header images in the screenshot. When you are editing the pages of your website, you will also notice that these designs have a Header images heading, underneath the content editor for the page.

To add a header image to a page on your website:

  1. Go to Website > Pages.
  2. Click on a page to edit.
  3. Scroll below the content box to the where it says Header images.
  4. Click the Add button on the right.
  5. Click Choose file.
  6. Select an image from the files on your computer - Please note: Image files should ideally be a minimum of 2000 pixels wide.
  7. You can then add Overlay content - Just type in any headings/links/buttons etc. that you want to appear on the image. (Hint: To create a button link on the image > Highlight the words you want to link > Click the link icon > Add in the web address > Click the Advanced tab > In the box labelled Stylesheet classes, type the word button > Click OK to save).
  8. You can then edit the Overlay background opacity by adjusting the number in the box to make the image darker or lighter; this will make your text easier to read. The higher the number, the darker the image.
  9. Click Add.
  10. You can then begin the process again to add another image, if you want a Header image slideshow.

How do I edit a header image on my website?

  1. Go to Website > Pages.
  2. Click on the page you need.
  3. Scroll below the content box to the where it says Header images.
  4. You will see any header images listed.
  5. Scroll down to the appropriate image and select Edit in the right hand Options column.
  6. Edit the Image/Overlay content/Overlay background opacity.
  7. Click Update to save.

How do I re-order the header images on my website?

  1. Go to Website > Pages.
  2. Click on the page you need.
  3. Scroll below the content box to the where it says Header images.
  4. You will see any header images listed.
  5. On the left hand side of each image, there is a move icon; hover over it then click and drag the image to re-order it.

How do I delete a header image on my website?

  1. Go to Website > Pages.
  2. Click on the page you need.
  3. Scroll below the content box to the where it says Header images.
  4. You will see any header images listed.
  5. Scroll down to the appropriate image and select Delete in the right hand Options column.
  6. Click Delete to confirm.

How do I edit the settings for my header images?

  1. Go to Website > Pages.
  2. Click on the page you need.
  3. Scroll below the content box to the where it says Header images.
  4. Click on Settings on the right.
  5. You can then edit the height of your images, the transition interval, and the transition speed of the images in the slideshow.
  6. Click Update to save.
  7. Find out how to edit the global website settings for your header images here.
Did this answer your question?