Add Links to Lightning Pages from Your Custom Components

To link to Lightning Experience pages, use lightning:formattedUrl in your custom component. The lightning:formattedUrl component displays a URL as a hyperlink.

If you use raw anchor tags or the ui:outputUrl (deprecated) component for links, the page does a full reload each time you click the link. To avoid full page reloads, replace your link components with lightning:formattedUrl.

For examples, see the Component Library.

Copy the attributes from the ui:outputUrl component.

1<aura:component>
2    <ui:outputURL value="https://my/path" label="Contact ID" />
3</aura:component>

Paste the same attributes into the lightning:formattedUrl component. lightning:formattedUrl supports more attributes, like tooltip.

1<aura:component>
2    <div aura:id="container">
3        <p><lightning:formattedUrl value="https://my/path" label="Contact ID" tooltip="Go to Contact's recordId" /></p>
4    </div>
5</aura:component>

See Also

• Component Library: lightning:formattedUrl Reference

j

Introducing Aura Components

Quick Start

Creating Components

Using Components

Aura Component Bundle Design Resources

Use Aura Components in Lightning Experience and the Salesforce Mobile App

Navigate Across Your Apps with Page References

Basic Navigation

Add Links to Lightning Pages from Your Custom Components

Add Query Parameters

Navigate to a Record Create Page with Default Field Values

Navigate to a Web Page

Migrate to lightning:isUrlAddressable from from force:navigateToComponent

pageReference Types

Get Your Aura Components Ready to Use on Lightning Pages

Use Aura Components in Experience Builder

Use Aura Components with Flows

Add Components to Apps

Integrate Your Custom Apps into the Chatter Publisher

Using Background Utility Items

Use Lightning Components in Visualforce Pages

Use Aura and Lightning Web Components Outside of Salesforce with Lightning Out (Beta)

Lightning Container

Communicating with Events

Communicating Across the DOM with Lightning Message Service

Creating Apps

Styling Apps

Developing Secure Code

Using JavaScript

Working with Salesforce Data

Testing Components

Debugging

Performance

Reference

Previous PDF Versions