How to convert a text based tracking number to a hyperlink

  • 1
  • Question
  • Updated 4 years ago

I have a table that contains shipping information which is uploaded from our SAP system.  The table contains tracking numbers from Fedex, UPS, etc. but the numbers are shown as text.  I am wondering if there is a way to convert them to be hyperlinks so they can be clicked on and directly sent to the shippers site.  This is typical functionality in a confirmation email that has tracking information embedded.   See snippet of the table below:

Photo of Jeffrey Lawler

Jeffrey Lawler

  • 1,464 Points 1k badge 2x thumb

Posted 4 years ago

  • 1
Photo of Emily Davis

Emily Davis, Employee

  • 3,578 Points 3k badge 2x thumb
Hi, Jeffrey,
This is pretty simple to achieve through a template in the table. You do lose the ability to edit fields if you use this method, but if that's not an issue, here is how you would do so (I am using a table on Account as an example):

1. On your table component, go to "Add Field(s)", then select "Template".

2. A new template will be added to your table.

Click this template field. In the Field Properties, you can give it a name to reflect the field you want to display. Also, be sure to check "Allow HTML".

3. For the Template, add this syntax:
<a href="myurl"></a>
For myurl, include whatever url you want to redirect to. This can be an absolute url (like or, if a url within Salesforce, you can use a relative url (everything after, such as /apex/skuid__ui?page=MyAccountDetailPage).

4. You can then a select a field from the field picker to insert into the body between the <a> tags. This is what will be displayed in the table.

5. You can also pass in field values as url parameters for the redirect if needed. In my example, I am linking to the account detail page and passing in the Salesforce Id of the Account, while displaying the external id to the user. One caveat: When using a field value in the url for the redirect, wrap this field value in triple curly braces ( {{{}}} ) rather than double ( {{}} ). This is my final template syntax:
<a href="/apex/skuid__ui?page=MyAccountDetailPage?id={{{Id}}}">{{External_Id_Test__c}}</a>
If you need to maintain the ability to edit these fields in the table, you can include the link through a custom field renderer, which would require some custom JS coding. Here's a tutorial that gives a little more information on custom field renderers.

Hope this helps! Let me know if you have questions.
Photo of Emily Davis

Emily Davis, Employee

  • 3,578 Points 3k badge 2x thumb