How to Add a Banner in Umbraco 8

This tutorial will go over how to add and format a banner on your Smartly Done Website.

Step 1: On the page you want to add a banner, click the down arrow and select the 3 dots by “Components,” and click “Banners.”

Step 2: Label the component “Banner” or another relevant title so you know what this component is.

Step 3: Scroll down to the Content section and click “Add content.”

Step 4: Set a name for your banner.

We recommend giving this a good descriptive name for what will be on your banner, or you can use the header text that you add to your banner. (This just helps you organize it well so it's easy to come back and edit it later.)

Step 5: Either select a background color for your banner or choose an image to use as the background.

Selecting Background Color:
Select the color you want to as the background.

Setting a Background Image:
Scroll down to the “Content” section and click the plus sign next to “Image.” Select the image and click submit.

Step 6: Set the banner style and text alignment. You can also add a color overlay, this works well for banners using background images and makes it easier to read any text on the banner.

Note: Adding a color overlay only works if you picked a background color for your banner.

Step 7: Scroll down and set a Heading. You can also add a “Secondary Heading” (this appears above your main heading) and other “text” (which appears below your headings).

If you want to add a button to your banner that links to another page, just click “Add” next to “Buttons.” Then click “Add Link” and select the page you want to link your banner to. Click “Submit.”