Replace URL field display with clickable label (“Click here”) instead of long raw link

ytande
Tera Contributor

Hello,


I need to show a short clickable label (e.g., “Click here” or a document title) instead of the full raw URL for a URL-type field on platform forms (UI16 / Next Experience).

ytande_0-1768513491306.png


Constraints: keep the URL value intact in the field (DB), avoid Service Portal, prefer a native or supported approach.


Tried so far

- No built-in dictionary attribute like link_label found for URL fields.

Question

Is there a native, supported formatter (or a documented pattern) to display a clickable label for URL fields on platform forms?
If not, what is the recommended?
Any sample UI formatter/Now Component/Declarative action that the community recommends?

1 REPLY 1

Itallo Brandão
Giga Guru

Hi ytande,

You are correct that there is no native Dictionary Attribute (like link_label) for standard URL fields to mask the raw link.

Since you want to keep this purely native (UI16/Next Experience) and avoid custom Formatters (Jelly) or DOM manipulation, the standard architectural pattern to achieve this is using a Calculated HTML Field.

This approach satisfies all your constraints: it keeps the raw URL in the DB, works on Forms and Lists, and is fully supported.

Implementation Steps:

  1. Create a New Field:

    • Type: HTML

    • Label: Document Link (or whatever you prefer)

    • Name: u_url_display

  2. Configure Calculation:

    • Go to the Advanced View of the dictionary entry for this new field.

    • Check Calculated.

    • Calculation Script:

      JavaScript
       
      (function calculatedFieldValue(current) {
          // Check if the source URL is empty
          if (gs.nil(current.u_your_raw_url_field)) return "";
      
          // Return a clickable HTML anchor tag
          return '<a href="' + current.u_your_raw_url_field + '" target="_blank">Click here</a>';
      })(current);
  3. Form/List Layout:

    • Add this new HTML field to your Form and List view.

    • (Optional) Remove or hide the original raw URL field from the view.

Why this is the recommended path: Unlike UI Macros (which only work on Forms) or Field Styles (which only work on Lists), an HTML field renders correctly in both views natively.

If this response helps you solve the issue, please mark it as Accepted Solution.
This helps the community grow and assists others in finding valid answers faster.

Best regards,
Brandão.