# Forge UI - Button with Link?

**URL:** <https://community.developer.atlassian.com/t/forge-ui-button-with-link/45696>\
**Category:** Forge\
**Tags:** forge-ui\
**Created:** [March 1, 2021, 8:14pm UTC](https://community.developer.atlassian.com/t/forge-ui-button-with-link/45696 "2021-03-01T20:14:47Z")\
**Posts on this page:** 17\
**Page:** 1

<div class="post-metadata">

**Author:** ![FranzBinder](https://avatars.discourse-cdn.com/v4/letter/f/94ad74/32.png) [@FranzBinder](https://community.developer.atlassian.com/u/FranzBinder)\
**Post date:** [March 1, 2021, 8:14pm UTC](https://community.developer.atlassian.com/t/forge-ui-button-with-link/45696/1 "2021-03-01T20:14:47Z")

</div>

With **Forge UI kit components** I’d like to place a **button with a link**. e.g. `<Button text="Sample subtle-link" appearance="subtle-link" />`

But it seems it is not possible:

- [Button](https://developer.atlassian.com/platform/forge/ui-kit-components/button/) doesn’t accept links. (despite there is a prop “appearance=link”)  
With `onClick={}` I wasn’t available to jump to another page.
- Links are available only as “formatting option” in the [Text](https://developer.atlassian.com/platform/forge/ui-kit-components/text/) component.

Did I miss something?  
Probably I have to use Custom UI ☹  
IMHO a Button **with** Link option should be possible in Forge UI. Like it is available at [Atlassian Design](https://atlassian.design/components/button/code) (see option `href`)

---

<div class="post-metadata">

**Author:** ![dmorrow](https://sea1.discourse-cdn.com/atlassiandeveloper/user_avatar/community.developer.atlassian.com/dmorrow/32/35895_2.png) [@dmorrow](https://community.developer.atlassian.com/u/dmorrow)\
**Post date:** [March 2, 2021, 10:46am UTC](https://community.developer.atlassian.com/t/forge-ui-button-with-link/45696/2 "2021-03-02T10:46:57Z")

</div>

Hi @FranzBinder,

I tested the ability to create a button with a `subtle-link` appearance and it worked. It was styled as a subtle link and my `onClick()` event handler was invoked when I clicked on the link.

Note that despite being able to make a [Button](https://developer.atlassian.com/platform/forge/ui-kit-components/button) look like a link, they are different. Links are for navigating between locations and buttons are for triggering/handling events.

Regards,  
Dugald

---

<div class="post-metadata">

**Author:** ![hopel](https://sea1.discourse-cdn.com/atlassiandeveloper/user_avatar/community.developer.atlassian.com/hopel/32/35947_2.png) [@hopel](https://community.developer.atlassian.com/u/hopel)\
**Post date:** [March 2, 2021, 12:20pm UTC](https://community.developer.atlassian.com/t/forge-ui-button-with-link/45696/3 "2021-03-02T12:20:45Z")

</div>

We are missing this functionality as well and have created [FRGE-225 - Allow Button working as Link (or Link styled as Button)](https://ecosystem.atlassian.net/browse/FRGE-225) as a suggestion/request for it.

---

<div class="post-metadata">

**Author:** ![FranzBinder](https://avatars.discourse-cdn.com/v4/letter/f/94ad74/32.png) [@FranzBinder](https://community.developer.atlassian.com/u/FranzBinder)\
**Post date:** [March 2, 2021, 3:42pm UTC](https://community.developer.atlassian.com/t/forge-ui-button-with-link/45696/4 "2021-03-02T15:42:43Z")

</div>

Thanks @dmorrow for your swift test!

Sure, the button itself worked with all the different appeance-options.  
I was wondering why there is no `href` option.

How could I do this using `onClick={...}` ? I would be curious to know to know how this works.🙏

I agree as well that buttons are mostly used for triggering actions. But partly also for navigation.  
Atlassian uses this as well:  
 ![getstarted](https://global.discourse-cdn.com/atlassiandeveloper/original/3X/a/c/acf078c6fc6725191bf6e08bc34dc5c289073e5a.png)

---

<div class="post-metadata">

**Author:** ![dmorrow](https://sea1.discourse-cdn.com/atlassiandeveloper/user_avatar/community.developer.atlassian.com/dmorrow/32/35895_2.png) [@dmorrow](https://community.developer.atlassian.com/u/dmorrow)\
**Post date:** [March 3, 2021, 12:10am UTC](https://community.developer.atlassian.com/t/forge-ui-button-with-link/45696/5 "2021-03-03T00:10:20Z")

</div>

Hi @FranzBinder,

I don’t know of a technical reason why the [Button](https://developer.atlassian.com/platform/forge/ui-kit-components/button) component couldn’t be enhanced to support a `href` attribute. It is possibly just a feature gap that hasn’t been prioritised yet. Would you be able to add a comment to [FRGE-105](https://ecosystem.atlassian.net/browse/FRGE-105) explaining the need for this and why creating a regular link using the [Text](https://developer.atlassian.com/platform/forge/ui-kit-components/text/) component is insufficient.

Regards,  
Dugald

---

<div class="post-metadata">

**Author:** ![FranzBinder](https://avatars.discourse-cdn.com/v4/letter/f/94ad74/32.png) [@FranzBinder](https://community.developer.atlassian.com/u/FranzBinder)\
**Post date:** [March 4, 2021, 9:25am UTC](https://community.developer.atlassian.com/t/forge-ui-button-with-link/45696/6 "2021-03-04T09:25:24Z")

</div>

Thanks @dmorrow,

done!

BR,  
Franz

---

<div class="post-metadata">

**Author:** ![nhur](https://sea1.discourse-cdn.com/atlassiandeveloper/user_avatar/community.developer.atlassian.com/nhur/32/41415_2.png) [@nhur](https://community.developer.atlassian.com/u/nhur)\
**Post date:** [March 4, 2021, 11:02pm UTC](https://community.developer.atlassian.com/t/forge-ui-button-with-link/45696/7 "2021-03-04T23:02:32Z")

</div>

Hi @FranzBinder, thanks for the feedback. We have navigation with handlers (such as Button’s onClick) planned for upcoming work.

---

<div class="post-metadata">

**Author:** ![FranzBinder](https://avatars.discourse-cdn.com/v4/letter/f/94ad74/32.png) [@FranzBinder](https://community.developer.atlassian.com/u/FranzBinder)\
**Post date:** [April 22, 2021, 9:56am UTC](https://community.developer.atlassian.com/t/forge-ui-button-with-link/45696/8 "2021-04-22T09:56:28Z")

</div>

Hi @nhur , @dmorrow ,  
are there any news regarding this topic?

Cheers,  
Franz

---

<div class="post-metadata">

**Author:** ![nhur](https://sea1.discourse-cdn.com/atlassiandeveloper/user_avatar/community.developer.atlassian.com/nhur/32/41415_2.png) [@nhur](https://community.developer.atlassian.com/u/nhur)\
**Post date:** [April 22, 2021, 11:48pm UTC](https://community.developer.atlassian.com/t/forge-ui-button-with-link/45696/9 "2021-04-22T23:48:07Z")

</div>

Hi @FranzBinder, we’re working on rolling out this navigation to Custom UI and discussed unifying this with UI Kit, but we haven’t started any work there.

---

<div class="post-metadata">

**Author:** ![FranzBinder](https://avatars.discourse-cdn.com/v4/letter/f/94ad74/32.png) [@FranzBinder](https://community.developer.atlassian.com/u/FranzBinder)\
**Post date:** [April 23, 2021, 9:42am UTC](https://community.developer.atlassian.com/t/forge-ui-button-with-link/45696/10 "2021-04-23T09:42:56Z")

</div>

Thanks @nhur !  
From my point of view it not necessary to have a common solution for Forge UI and Custom UI (router…).  
For Forge UI it can be a simple `href` option.

I hope the work can start soon 🙏 !  
For such small things Forge UI is much better and the **end user** has not that **bad experience** with large areas (viewport size topic).

---

<div class="post-metadata">

**Author:** ![nhur](https://sea1.discourse-cdn.com/atlassiandeveloper/user_avatar/community.developer.atlassian.com/nhur/32/41415_2.png) [@nhur](https://community.developer.atlassian.com/u/nhur)\
**Post date:** [May 4, 2021, 1:49am UTC](https://community.developer.atlassian.com/t/forge-ui-button-with-link/45696/11 "2021-05-04T01:49:04Z")

</div>

@FranzBinder Thanks for your feedback and patience — we should be rolling out an `href` option soon. It is a small change but I think we were trying to think about routing more.

---

<div class="post-metadata">

**Author:** ![FranzBinder](https://avatars.discourse-cdn.com/v4/letter/f/94ad74/32.png) [@FranzBinder](https://community.developer.atlassian.com/u/FranzBinder)\
**Post date:** [June 20, 2021, 11:52am UTC](https://community.developer.atlassian.com/t/forge-ui-button-with-link/45696/12 "2021-06-20T11:52:17Z")

</div>

Hey @nhur , @dmorrow,  
any news about this topic? It’s already ~6 weeks since your statement. 😉

---

<div class="post-metadata">

**Author:** ![nhur](https://sea1.discourse-cdn.com/atlassiandeveloper/user_avatar/community.developer.atlassian.com/nhur/32/41415_2.png) [@nhur](https://community.developer.atlassian.com/u/nhur)\
**Post date:** [June 20, 2021, 12:09pm UTC](https://community.developer.atlassian.com/t/forge-ui-button-with-link/45696/13 "2021-06-20T12:09:02Z")

</div>

Hey @FranzBinder, we’re rolling out changes to the Link component to act as a Button - expect docs for this shortly!

---

<div class="post-metadata">

**Author:** ![nhur](https://sea1.discourse-cdn.com/atlassiandeveloper/user_avatar/community.developer.atlassian.com/nhur/32/41415_2.png) [@nhur](https://community.developer.atlassian.com/u/nhur)\
**Post date:** [June 22, 2021, 5:38am UTC](https://community.developer.atlassian.com/t/forge-ui-button-with-link/45696/14 "2021-06-22T05:38:24Z")

</div>

Just an update: changes to the Link component (new props: `appearance`, and `openNewTab`) have been rolled out (and useable) everywhere except Confluence macros due to upgrading delays. We’ll release documentation once that is complete.

---

<div class="post-metadata">

**Author:** ![nhur](https://sea1.discourse-cdn.com/atlassiandeveloper/user_avatar/community.developer.atlassian.com/nhur/32/41415_2.png) [@nhur](https://community.developer.atlassian.com/u/nhur)\
**Post date:** [June 30, 2021, 2:52am UTC](https://community.developer.atlassian.com/t/forge-ui-button-with-link/45696/15 "2021-06-30T02:52:44Z")

</div>

Hi all, thanks for your patience! The documentation for this feature will be out later today but if you’re feeling adventurous, `Link` has two new props `appearance` and `openNewTab` which you can use enow.

The original delay was due to deployment blockers that meant that only macros didn’t have support for this (for over a month).

---

<div class="post-metadata">

**Author:** ![nhur](https://sea1.discourse-cdn.com/atlassiandeveloper/user_avatar/community.developer.atlassian.com/nhur/32/41415_2.png) [@nhur](https://community.developer.atlassian.com/u/nhur)\
**Post date:** [July 1, 2021, 3:32am UTC](https://community.developer.atlassian.com/t/forge-ui-button-with-link/45696/16 "2021-07-01T03:32:19Z")

</div>

Quick links for visitors from the future:  
[Release announcement](https://community.developer.atlassian.com/t/new-external-permissions-authorize-method-cli-improvements-and-bug-fixes/49409)  
[UI Kit Link docs](https://developer.atlassian.com/platform/forge/ui-kit-components/text/#link)

Again, thanks for your patience — our team has changed the way we handle feedback so requests like these should get bubbled up and decided on faster.

---

<div class="post-metadata">

**Author:** ![DavidPezet1](https://avatars.discourse-cdn.com/v4/letter/d/ad7895/32.png) [@DavidPezet1](https://community.developer.atlassian.com/u/DavidPezet1)\
**Post date:** [November 22, 2023, 8:05pm UTC](https://community.developer.atlassian.com/t/forge-ui-button-with-link/45696/17 "2023-11-22T20:05:11Z")

</div>

@nhur Do you know if this is supposed to be supported in UI Kit 2?