We use cookies to improve our service. Learn more.

Reference / Components

Title Component

Display multiple properties in different styles

The Title Component is available in both Apps and Pages, but configuration options may differ slightly.

In Apps

The Title component has three different properties:

  1. Title
  2. Details
  3. Image

You can choose to display all or only one of these.

Image

You can configure the image property to display either an image from a URL or an address on a map.

Appearance

The title can be displayed in three different ways - FullCard or Profile. We can also select a Size and we have three options to choose from:

  • Fixed Height
  • 3:2
  • 3:1

Actions

We can also add an Action to our Title Component, so when a user clicks on it, an Action is triggered. Under the General settings of the component, we can select a default action from the dropdown or create a Custom action.

In Pages

The Title component in Glide Pages provides extra functionalities that make it even more powerful.

Data

When displaying data, you can choose from a TitleSubtitleImage, and Emphasis. You can write Custom Values or select columns from your Data Source.

Design

We can apply settings to the Size, Image Style, or Background. These three options will have an effect on the text Size, the image we select, or the background of the component.

  • Size will influence the text size. We can choose from Small, Medium, Large, or XLarge.
  • The Image Style offers two options, Rounded or Circle.
  • And Background has six options, CardAccentDarkWhiteImage, or None.

If we select Image we have three other extra settings:

Background Image: Here's where we select our background image, we can either select an image from our Database or insert a custom value. Background Effect: We have three choices, Darken, Lighten, or None With Blur: If we set the checkbox to true, a blur will be added to our image

Actions

We can add as many Actions as we want, the first two actions will be displayed in a Button Bar, and the following will be displayed under a drop-down menu as displayed in the following image.

Updated 2 days ago
Was this helpful?