All Collections
Design
Setting up your home page image banner
Setting up your home page image banner

How to add images, text and buttons to your home page banner

Cam Langsford avatar
Written by Cam Langsford
Updated over a week ago

There are two different ways you can set up the image banner of your home page.

The First Way: From your website on the Training Tilt's Platform

Login to Training Tilt and click on Website.

Make sure you click on the home page.

Go to Configure.

Click on Banner Settings.

Click on the Upload Image.

Select the image(s) you want to add and save.  Now make sure that the image(s) you want to be ON.

Finally, Save everything and reload to review the changes.

The Second Way: From the Platform Settings

Login to Training Tilt and click on Settings.

Next, go to platform settings.

Go to carousel and login images.

Scroll down to see all the images you can select.

If you don't see any images you want, select Add more images.

You can either click on the upload button and select the images you want to add.  You can also just drag the files (images) and drop them in the center and upload.

Once you've confirmed the image(s) you want to use, be sure to tick the Include in homepage banner box.

Finally, click Save carousel images to save everything.

Please note: 

The Carousel uses adaptive image resizing and and pans around the image to make it fit the carousel depending on the page size. For best results the subject of the image should be in the centre of the image with 25% background above and below the main subject of the image. As an indication a good size for an image is shown below, this swimming image is one of the default available images and works well because of the space above and below the swimmers.

The image is 850 x 565 pixels and 96dpi. Exact sizing is not required because the adaptive resizing will ensure most images fit inside the carousel but sometimes this can result in pixelization if the size or quality of the image is not high enough.

25% above and below the main subject of the image. Image size 850 x 565 pixels

Alternatively a cropped image will also work but is less flexible as the adaptive resizing has less height to work with when resizing. This image is 850 x 350 and achieves a similar result.

Did this answer your question?