Link
The Link widget allows you to create clickable elements — such as text or images — that navigate users to either an external URL or a different page within your app.
Common Use Cases
Redirecting to external websites or resources
Navigating between pages within the same container
Creating calls-to-action like “Read More” or “Visit Profile”
Linking visual elements (e.g., images or icons) to different views or URLs
Widget Properties
When a Link widget is added to a page, the Panel Tab includes additional controls:
"Select Source Type"
Determines how the link destination is defined.
Options:
External Link: Displays an External Link text field to enter a full URL.
Change Page in Container: Displays two additional fields:
Container Name: Select the container that houses the target page.
Target: Choose the specific page within that container to navigate to.
"Don’t Use Field Value as Text"
A checkbox to control whether the displayed text comes from the field value or a custom entry.
When checked, the link does not display the field value.
"Show Text"
If “Don’t Use Field Value as Text” is enabled, this field lets you enter the text that should be shown instead.
Step-by-Step Guide to Use the Link Widget
Step 1: Add the Widget
Open the Widgets Panel, navigate to the Fields & Headers section, and click & drop the Link widget onto your page where you want the clickable element to appear.
Step 2: Configure Main Settings
Click on the widget to open its settings. Adjust the basic appearance and behavior — such as layout alignment, styling, or attaching the link to a specific element (text or image).
Step 3: Set Widget Properties
In the Panel Tab, configure the link’s behavior:
Under Select Source Type, choose between:
External Link: Enter a URL in the “External Link” field.
Change Page in Container: Set both Container Name and Target Page.
Use Don’t Use Field Value as Text if you want to override the default text.
Use Show Text to define the custom text that should appear.
Step 4: Preview or Finalize
Click the Run/Preview icon to test how the link behaves in runtime. Make sure it navigates correctly and displays the expected text or element.
Last updated