How to create a button that actually does what you tell it to, using Salesforce LWC buttons wrapped in JSON, with a custom component.
Many teams expect Salesforce Lightning pages to behave like modern application dashboards, where quick-access action buttons can be added anywhere as needed. However, when working within the constraints of the Salesforce Lightning framework, it becomes evident that the platform does not provide a straightforward way to place custom buttons directly onto Home, App, or Record pages. It comes to three core limitations:
1. Placement | 2. Access | 3. Editable |
| Lightning App Builder Does Not Support Native Button Placement | Per-User or Per-Role Visibility is Not Supported for Individual Buttons | Salesforce Does Not Provide Dynamic, Editable Button Definitions in the app builder |
Salesforce provides no native mechanism to:
| This becomes a significant limitation when different user groups require different actions on the same page, such as:
| Salesforce does not include native options for:
|
Custom Lightning Web Component
To address all of the above constraints, we developed a custom Lightning Web Component (LWC) specifically designed for this purpose. This component enables:
- Placement of one or more buttons anywhere on a Lightning page
- Configuration through JSON directly in the App Builder
- Independent button styling (label, icon, variant, URL)
- Support for external and internal links for all placements
- Right-aligned, clean, consistent visual presentation
- Per-button access control using Permission Sets
- No additional development required after deployment
In short, the custom component fills a functional gap in the Lightning platform, providing a flexible and maintainable approach for teams that require structured navigation or action shortcuts.
Salesforce Lightning offers powerful composition tools, but it does not support native action button placement, per-button visibility rules, or dynamic button configuration. These limitations prevent teams from creating intuitive, task-oriented pages without custom development.
By implementing a dedicated LWC designed expressly for this purpose, we are able to provide:
- Intuitive navigation
- Cleaner user interfaces
- Better security and role-based access
- Administrator-controlled configuration without code changes
This approach aligns with Salesforce architectural best practices while delivering the usability and flexibility that modern teams expect.
Limitations | Solution |
Salesforce Lightning is powerful, but it doesn’t natively support:
| Because of these architectural constraints, teams can’t create button-driven navigation on Lightning pages without introducing custom development. A dedicated LWC closes this gap by providing:
|
This approach aligns with Salesforce best practices while giving teams the flexible, modern experience they expect inside Lightning.
How to Guide
1. Download the LWC zip drive dynamicOpenUrlButtons.
2. Using Visual Code Studio, load the LWC into your Salesforce org.
3. Put the LWC on the page using Lightning Page Builder
4. Copy/Paste the example JSON below into the JSON field.
5. Change the URLs, icons, and text to meet your company’s needs
6. Test Buttons!
[ { "label": "Google", "url": "https://www.google.com", "variant": "brand", "iconName": "utility:search", "target": "_blank" }, { "label": "Salesforce", "url": "https://www.salesforce.com", "variant": "neutral", "iconName": "utility:link", "target": "_self" }, { "label": "Help", "url": "https://help.salesforce.com", "variant": "brand-outline", "iconName": "utility:question_mark"} ]
Charu Ragunath
Principal Cloud Architect
Charu Ragunath is a Principal Cloud Architect at MB&A with deep expertise in Salesforce solution architecture, designing scalable, resilient, data-driven solutions that accelerate digital transformation across both the private and public sectors.
