Using Background Images

There are two ways to do add a background image to  jumbotron or any element

1) Using Designer:

  1. Click on Section/Div/ Jumbotron or any element
  2. Right Click -> Change Design or Click on Design icon in the right side.
  3. Click on Background & Colors Panel
  4. Click on Image tab
  5. Now press + icon to add the uploaded images or paste any external URL (eg: unsplash).

This will automatically assign css class to the element and set the background image.

2) Using Code Editor:

  1. Click on the editor icon from top bar.
  2. Click on the CSS  tab in the code editor
  3.  Assign your css class and add the background image property.
  4.  Add the created class name to the particular element.

Eg: CSS Class to set the background Image

.bg-image{
 color: rgb(255, 255, 255);
 background-position: center center;
 background-size: cover;
 background-image: url("https://images.unsplash.com/photo-1516825295207-81549bdd014c?ixlib=rb-0.3.5&ixid=eyJhcHBfaWQiOjEyMDd9&s=c71b458b9cd9a1d5c410c52607277a95&auto=format&fit=crop&w=1650&q=80");
}