1. Knowledge Base
  2. >
  3. Change Section Background in Express Editor

Change Section Background in Express Editor

This content only applies to Gator Website Builder hosting plans which are accessible by going to app.gator.com.

For more articles, check out the HostGator Gator Website Builder category
or directly access the Gator Knowledge Base.


How-to Change Background Color

To add a pop of color to different areas of your site and make it uniquely your own, you can change the background for each section.

  1. Begin by launching your website editor by choosing Edit site.
    builder-edit-wb
  2. Navigate to the desired page, and then click on the section you want to edit and click the background tab.
    builder-image-background
  3. Under the Background tab, you can edit the background using the following format: Color, Image, and Video.
  4. When the Color tab is chosen, your design colors will be generated. You can click any of these color swatches to automatically update the color of the selected background and text for legibility.
    builder-color-tab
  5. Apart from the color swatches, you can also toggle it on or off for the Pattern option. This will allow you to select different patterns and combine them with the color of your choice.
    builder-color-pattern

How-to Change Background Image

  1. Once you're logged in to your express editor, select the section you want to edit. Then click on Background.
  2. Click on the Image tab, and you can upload your image from your local computer or search from the stock photos library.
    builder-
  3. To upload, click the Select button. Here is an example walkthrough, it will show you how-to upload and use the stock photos:
    builder-image-background-upload

    Note: You can do the same steps in uploading an image from your computer. To do that, click on the Upload Image button.

  4. After uploading an image, there is also an option for you to add Animation. To do so, click on the drop-down to select.
    builder-section-background-image-animation
  5. To add Overlay, toggle it on and select the color of your choice and adjust the opacity to match your preference.
    builder-section-background-overlay

How-to Change Background Video

  1. Select the section you want to edit. Then click on Background.
  2. Select Video tab.
  3. Under the Video option, you can select one of the 6 stock videos by clicking on the thumbnail.
  4. Toggle it on to use Overlay to add additional color to the video, and after selecting the color,  there's an option to adjust the opacity. 
    builder-background-video