# How to add hyperlink

**URL:** <https://forum.code.org/t/how-to-add-hyperlink/35908>\
**Category:** Uncategorized\
**Created:** [February 19, 2022, 2:04pm UTC](https://forum.code.org/t/how-to-add-hyperlink/35908 "2022-02-19T14:04:23Z")\
**Posts on this page:** 9\
**Page:** 1

<div class="post-metadata">

**Author:** ![alsotechyofficial](https://sea2.discourse-cdn.com/flex016/user_avatar/forum.code.org/alsotechyofficial/32/7318_2.png) [@alsotechyofficial](https://forum.code.org/u/alsotechyofficial)\
**Post date:** [February 19, 2022, 2:04pm UTC](https://forum.code.org/t/how-to-add-hyperlink/35908/1 "2022-02-19T14:04:23Z")

</div>

How to add links to a button in app tab?  
Help me as soon as possible

---

<div class="post-metadata">

**Author:** ![IMPixel](https://sea2.discourse-cdn.com/flex016/user_avatar/forum.code.org/impixel/32/6744_2.png) [@IMPixel](https://forum.code.org/u/IMPixel)\
**Post date:** [February 19, 2022, 8:24pm UTC](https://forum.code.org/t/how-to-add-hyperlink/35908/2 "2022-02-19T20:24:36Z")

</div>

Here’s a simple function to help you out in this:

```auto
function hyperlinkButton(id, link) {
  onEvent(id, "click", function( ) {
    window.open(link);
  });
}

```

Usage:

```auto
hyperlinkButton("button1", "https://youtube.com/");

```

This will assign a link to a button. You need to have created that button already, and then have put the id and the link in a function.

---

<div class="post-metadata">

**Author:** ![melynn](https://sea2.discourse-cdn.com/flex016/user_avatar/forum.code.org/melynn/32/4925_2.png) [@melynn](https://forum.code.org/u/melynn)\
**Post date:** [February 19, 2022, 10:59pm UTC](https://forum.code.org/t/how-to-add-hyperlink/35908/3 "2022-02-19T22:59:55Z")

</div>

@alsotechyofficial -

If you are using blocks in App Lab, the following will work as well:

 ![Screen Shot 2022-02-19 at 3.57.31 PM](https://us1.discourse-cdn.com/flex016/uploads/codeorgforum/original/2X/d/d8ea81a85f81aa598d8db1d126bfb3c5bd32808c.png)

~Michelle

---

<div class="post-metadata">

**Author:** ![IMPixel](https://sea2.discourse-cdn.com/flex016/user_avatar/forum.code.org/impixel/32/6744_2.png) [@IMPixel](https://forum.code.org/u/IMPixel)\
**Post date:** [February 20, 2022, 1:23am UTC](https://forum.code.org/t/how-to-add-hyperlink/35908/4 "2022-02-20T01:23:14Z")

</div>

That is literally what I had written though? I just made it easier because it’s a function you can paste and it’s one line.

---

<div class="post-metadata">

**Author:** ![melynn](https://sea2.discourse-cdn.com/flex016/user_avatar/forum.code.org/melynn/32/4925_2.png) [@melynn](https://forum.code.org/u/melynn)\
**Post date:** [February 20, 2022, 11:35pm UTC](https://forum.code.org/t/how-to-add-hyperlink/35908/5 "2022-02-20T23:35:38Z")

</div>

@IMPixel,

Always thankful for your help especially with the more advanced posts. I always learn something from them! My approach was considering the poster might be new to teaching CS (or new to CS) as many [Code.org](http://Code.org) users are and therefore may prefer blocks. Just covering the bases.

~Michelle

---

<div class="post-metadata">

**Author:** ![IMPixel](https://sea2.discourse-cdn.com/flex016/user_avatar/forum.code.org/impixel/32/6744_2.png) [@IMPixel](https://forum.code.org/u/IMPixel)\
**Post date:** [February 21, 2022, 1:55am UTC](https://forum.code.org/t/how-to-add-hyperlink/35908/6 "2022-02-21T01:55:10Z")

</div>

Oh thanks, it’s ok, I was just wondering.

---

<div class="post-metadata">

**Author:** ![letti42](https://avatars.discourse-cdn.com/v4/letter/l/7ea924/32.png) [@letti42](https://forum.code.org/u/letti42)\
**Post date:** [February 21, 2022, 2:27am UTC](https://forum.code.org/t/how-to-add-hyperlink/35908/7 "2022-02-21T02:27:21Z")

</div>

You can import the **[Link](https://studio.code.org/projects/applab/dR4BIBYsaPqybX21RevLykJg57yMONOHAPY9aF-dYS0/view)** library into your code by going to **Manage Libraries → Import Library from ID →** then paste **dR4BIBYsaPqybX21RevLykJg57yMONOHAPY9aF-dYS0** and press **Add**.  
After the library is imported, make an `onEvent` block similar to @melynn’s example, but add the following code:

```auto
Link.link('google.com',true);

```

You can replace [google.com](http://google.com) with your link and it will take you there instantly.

---

<div class="post-metadata">

**Author:** ![alsotechyofficial](https://sea2.discourse-cdn.com/flex016/user_avatar/forum.code.org/alsotechyofficial/32/7318_2.png) [@alsotechyofficial](https://forum.code.org/u/alsotechyofficial)\
**Post date:** [February 21, 2022, 12:49pm UTC](https://forum.code.org/t/how-to-add-hyperlink/35908/8 "2022-02-21T12:49:17Z")

</div>

Thank you so much Michelle . I appreciate for you work!

---

<div class="post-metadata">

**Author:** ![IMPixel](https://sea2.discourse-cdn.com/flex016/user_avatar/forum.code.org/impixel/32/6744_2.png) [@IMPixel](https://forum.code.org/u/IMPixel)\
**Post date:** [February 24, 2022, 10:57pm UTC](https://forum.code.org/t/how-to-add-hyperlink/35908/9 "2022-02-24T22:57:41Z")

</div>

Note that @letti42’s way bypassees the prompt for all links that aren’t created by [code.org](http://code.org).