Hero - Softr Docs

The "Hero" area is a large area at the top of the page (usually full width) that is supposed to give the user a general idea of what the website is about. If you are offering a certain product, the Hero are is usually the place where you put the value proposition of your product, summarizing what problems the product solves, what value it delivers to its customers, how it differentiates itself as the preferred provider of this value, and so on.
Hero areas often contain images, videos, dynamic text, etc. Softr offers a variety of layouts for the Hero block to choose from. In this section, we'll review all the layouts to give you a better understanding of how they can be configured and applied.
First, let's examine the features that all or most of the layouts have in common. Afterwards, we'll investigate the specifics of each layout one by one.
As you can see in the above image, the Hero block usually has the following components:
Title
Subtitle
Image/Video
Buttons
Let's take a closer look at each component.
Title and Subtitle
The Title and Subtitle are simple text areas where you can add main and secondary text.
Image/Video
Next, you can add a an image or a video to accompany the text. Below the image/video field there is an option to switch the image position as well as an option to upload a background image for the whole Hero area.
Adding an image to the Hero block
Buttons
Lastly, you have the Button element, which is a regular button with Open page, Scroll to section, and Open external url actions. You can also add more buttons with Add button below.
Button actions
​

Header with sublinks, icons, and description

Hero with call to action

Last modified 7mo ago

Copy link

Contents

Title and Subtitle

Image/Video

Buttons