A heading element defines the titles of sections within a page. Heading elements help organize content and improve readability by providing structure to pages.
In this section, we’ll set up a heading element, the configuration options, and how it generally works.
Headings are important for structuring the page and guiding users through content on the page. They establish a hierarchy, making it easier to scan information.
You can customize the element properties and style of the heading using the element settings panel on the right side of the screen.
To add a heading element, click the +
icon and select Heading.
Place the heading wherever you want it on the page. Don’t worry if it’s not perfectly positioned initially; you can always move it later.
Learn more about how to add and remove an element from a page.
Now, you can configure the heading’s properties to make it function and look the way you want. This involves settings related to heading style.
Baserow has several heading levels that can be customized according to your requirements.
The heading levels, ranging from <h1>
to <h6>
, indicate different levels of importance and hierarchy.
The <h1>
tag represents the highest level of importance, typically used for the main title of the page, while <h6>
represents the lowest level of importance.
The heading element has a text field to enter the heading text and that can be changed by clicking on it.
You can enter static text here. However, if you’ve connected to a data source, all the fields from the data source will also become available. Select a field from the data source to fetch data dynamically.
The horizontal alignment property controls how heading elements are positioned on the page. You can use it to achieve different visual arrangements for your headings.
Here’s a breakdown of the available alignment options:
By adjusting the horizontal alignment property, you can create a more balanced and organized layout for the page.
You can easily modify the font color of headings in the Application Builder.
Navigate to the page where you can edit the heading you want to modify and select the heading element within the editor. Change the font color of a heading element using the Font property within a General tab.
Click on the color picker or input field next to the font color option.
Set the desired color of the heading using one of these methods:
Use a visual color picker tool to interactively choose a desired color.
Alternatively, you can inherit the default styles defined in the theme settings for a cohesive look.
Still need help? If you’re looking for something else, please feel free to make recommendations or ask us questions—we’re ready to assist you.