Changing the background and header banners are 2 ways that you can quickly and easily update the look of your website, and instantly make it look more professional and branded to your business.

Our tutorial, how to change your website background, shows you how to upload a background image across your site.

Another question that has been asked of us, however, was how to change the background of the banner at the top of the page. Let's look at an example.

We've taken an existing Weebly template and made the background blue. You can see that the banner at the top works independently to the rest of the background.

What if you don't want your banner to be a big rectangle at the top? You don't have to be constrained by that design aesthetic, although it is a neat and common choice for many business owners.

When creating the image that you want to place in your banner, remember if it doesn't have a background, and you want to retain the transparency, you need to create it as a PNG file.

When you are ready to start making your changes, click on the Edit Image button. This will open the banner editor and bring up a toolbar with your editing tools.

Here is where you can make changes to any image by changing its opacity, or rotating it. Have a play around and you will see that you have plenty of options to work with. 

You an also add more images or text with the buttons on the left. Images and text boxes can easily be dragged and moved around, and layered on top of each other. 

So, you've clicked Edit Image, and you're in the editable banner area. To get rid of the default image in the template, simply click the cross in the corner. You are left with a blank area to insert your own, newly created image.

We insert our dummy logo, but as you can see, the white rectangle is still sitting there on the banner.

The secret here is to change the colour of the background. When you are in the banner editor, and you have inserted your new image, take a look at the toolbar. It changes again, to give you the option to make edits to the background colour and opacity.

We selected a transparent background, and we're done. Have a play around with the tools here, as you can change not only the colour, but also add gradients or patterns. Using these options could really start bringing your website design to life, or at least give you a starting point to add your own style and stamp onto the design.