Text

Discover and learn how to customize the text component in Momen to elevate your text-based content.

Introduction

Explore the text component in your web app development journey with Momen. This tutorial will walk you through the attributes, data sources, and formatting options for text components, enabling you to tailor your text-based content effectively.

Application

The text component has a wide range of applications. Any place where text content needs to be displayed will use the text component.

Component Attributes

By modifying text attributes, such as fonts, sizes, and colors, you can achieve diverse text display styles, as depicted below:

Tips:

For single-line text display, it's advisable to set the text component's height to be 6 pixels larger than the font size of the text content.

If text doesn't appear smaller when adjusting font size, it may be due to the browser's font size limitations. Navigate to your browser's Settings > Appearance to customize the minimum font size.

Data Source for Text Component

Static Data: Data entered directly within the text component content.

External Data Sources

Utilize dynamic data sources by clicking the [+] sign, as shown below:

Data Concatenation

Momen allows for the concatenation of multiple data sources to be displayed. This function enables the consolidation of identical styles and positions, thus reducing the need for repetitive adjustments.

Combining Local and External Data

As illustrated, the "UserID" is entered directly as local data while "Logged in user/ID" is referenced as external data and can be concatenated for display.

Combining Other Data Sources

The result of combining dynamic data sources is similar to that of static data

Text Component Display Format

In addition to displaying the data of type "text", the text component also has the capability to display other types of data, such as ID, URL or name of file, image and audio/video, excluding file, image and audio/video formats. The display format of the data can also be modified.

How to Modify the Format

As shown in the figure below, after binding the time data, the time data is in blue and can be clicked. Click on the time data, a pop-up window will appear for you to select the time format to be displayed.

If you encounter any issues during the process, feel free to join our Discord community for assistance.

About Momen

Momen is a no-code web app builder, allows users to build fully customizable web apps, marketplaces, Social Networks, AI Apps, Enterprise SaaS, and much more. You can iterate and refine your projects in real-time, ensuring a seamless creation process. Meanwhile, Momen offers powerful API integration capabilities, allowing you to connect your projects to any service you need. With Momen, you can bring your ideas to life and build remarkable digital solutions and get your web app products to market faster than ever before.