# Hyperlink box?

**URL:** <https://forum.wixstudio.com/t/hyperlink-box/15695>\
**Category:** Ask the community\
**Tags:** question, code\
**Created:** [March 18, 2019, 10:19pm UTC](https://forum.wixstudio.com/t/hyperlink-box/15695 "2019-03-18T22:19:01Z")\
**Posts on this page:** 11\
**Page:** 1

<div class="post-metadata">

**Author:** ![info81994](https://sea1.discourse-cdn.com/wix/user_avatar/forum.wixstudio.com/info81994/32/9651_2.png) [@info81994](https://forum.wixstudio.com/u/info81994)\
**Post date:** [March 18, 2019, 10:19pm UTC](https://forum.wixstudio.com/t/hyperlink-box/15695/1 "2019-03-18T22:19:01Z")

</div>

Hello,

I am currently optimising my site for mobile and have a box with no text in it that sits on top of a slideshow (purely for aesthetic purposes). I was wondering whether it is possible to make this box a hyperlink to go to another page when clicked? I can see in developer mode that there’s scope for an ‘On Click’ event, but what code might I use to make this work?

Any help would be greatly appreciated.

Many thanks,

Thomas

![](https://us1.discourse-cdn.com/wix/original/3X/5/5/55d7539d430405167490b07a7be7a3ab380dbedb.png)

---

<div class="post-metadata">

**Author:** ![J.D](https://sea1.discourse-cdn.com/wix/user_avatar/forum.wixstudio.com/j.d/32/7312_2.png) [@J.D](https://forum.wixstudio.com/u/J.D)\
**Post date:** [March 18, 2019, 10:46pm UTC](https://forum.wixstudio.com/t/hyperlink-box/15695/2 "2019-03-18T22:46:28Z")

</div>

You have 2 options:

1. if the box is just a place holder and doesn’t serve as a container to other elements, you can remove it and put a button instead. You can resize and redesign the button to look exactly like the box.  
In this case no code is needed as you can link the button thorough the editor.
2. you can use the box and the following code:  
For external webpage:

```javascript
import wixLocation from 'wix-location';
$w.onReady(function () {
    $w("#box19").onClick( (event) => {
        wixLocation.to("https://en.wikipedia.org");
    })

});

```

For internal webpage:

```javascript
import wixLocation from 'wix-location';
$w.onReady(function () {
    $w("#box19").onClick( (event) => {
        wixLocation.to("/home");
    })

});

```

---

<div class="post-metadata">

**Author:** ![info81994](https://sea1.discourse-cdn.com/wix/user_avatar/forum.wixstudio.com/info81994/32/9651_2.png) [@info81994](https://forum.wixstudio.com/u/info81994)\
**Post date:** [March 18, 2019, 11:00pm UTC](https://forum.wixstudio.com/t/hyperlink-box/15695/3 "2019-03-18T23:00:43Z")

</div>

Thanks very much for this, I will test drive it! Just quickly, if I replace it with a button, will it require text? Only the look I am trying to achieve is a hollow/transparent box with a thin border.

Thanks again!

---

<div class="post-metadata">

**Author:** ![J.D](https://sea1.discourse-cdn.com/wix/user_avatar/forum.wixstudio.com/j.d/32/7312_2.png) [@J.D](https://forum.wixstudio.com/u/J.D)\
**Post date:** [March 18, 2019, 11:26pm UTC](https://forum.wixstudio.com/t/hyperlink-box/15695/4 "2019-03-18T23:26:26Z")

</div>

@info81994 you can remove the text from the button if you wish.  
(But if you want this area to hold contents (such as images, shapes, long texts etc.) then box will be better).

---

<div class="post-metadata">

**Author:** ![info81994](https://sea1.discourse-cdn.com/wix/user_avatar/forum.wixstudio.com/info81994/32/9651_2.png) [@info81994](https://forum.wixstudio.com/u/info81994)\
**Post date:** [March 19, 2019, 10:03am UTC](https://forum.wixstudio.com/t/hyperlink-box/15695/5 "2019-03-19T10:03:27Z")

</div>

Fantastic - I went with the button in the end, but the code for hyperlinks on shapes is incredibly useful to, thank you very much!

---

<div class="post-metadata">

**Author:** ![dsiwy2000](https://sea1.discourse-cdn.com/wix/user_avatar/forum.wixstudio.com/dsiwy2000/32/25085_2.png) [@dsiwy2000](https://forum.wixstudio.com/u/dsiwy2000)\
**Post date:** [November 25, 2020, 9:05pm UTC](https://forum.wixstudio.com/t/hyperlink-box/15695/6 "2020-11-25T21:05:58Z")

</div>

How would the code look if we had more of these buttons on the page? It shows an error code for me when I try the code “wixlocation, has already been declared”.

---

<div class="post-metadata">

**Author:** ![J.D](https://sea1.discourse-cdn.com/wix/user_avatar/forum.wixstudio.com/j.d/32/7312_2.png) [@J.D](https://forum.wixstudio.com/u/J.D)\
**Post date:** [November 25, 2020, 9:45pm UTC](https://forum.wixstudio.com/t/hyperlink-box/15695/7 "2020-11-25T21:45:51Z")

</div>

The import line should appear one time only (at the top of the code).  
It’s also better to have 1 $w.onReady(function () { /_rest of the code_/ } per page and put the rest of the code inside.

---

<div class="post-metadata">

**Author:** ![infomusiklab](https://avatars.discourse-cdn.com/v4/letter/i/838e76/32.png) [@infomusiklab](https://forum.wixstudio.com/u/infomusiklab)\
**Post date:** [February 26, 2021, 4:34pm UTC](https://forum.wixstudio.com/t/hyperlink-box/15695/8 "2021-02-26T16:34:40Z")

</div>

What could I do if I want to open this new link in a new window?

---

<div class="post-metadata">

**Author:** ![pranavatandra](https://sea1.discourse-cdn.com/wix/user_avatar/forum.wixstudio.com/pranavatandra/32/27266_2.png) [@pranavatandra](https://forum.wixstudio.com/u/pranavatandra)\
**Post date:** [March 15, 2021, 5:39am UTC](https://forum.wixstudio.com/t/hyperlink-box/15695/9 "2021-03-15T05:39:15Z")

</div>

This works!! and, what if I want to open the link in a new tab?

---

<div class="post-metadata">

**Author:** ![erigallagher](https://avatars.discourse-cdn.com/v4/letter/e/a9a28c/32.png) [@erigallagher](https://forum.wixstudio.com/u/erigallagher)\
**Post date:** [August 2, 2021, 2:18pm UTC](https://forum.wixstudio.com/t/hyperlink-box/15695/10 "2021-08-02T14:18:44Z")

</div>

Hey J.D the code works great on one item but how can i hyperlink multipul boxs on one page? TIA

---

<div class="post-metadata">

**Author:** ![J.D](https://sea1.discourse-cdn.com/wix/user_avatar/forum.wixstudio.com/j.d/32/7312_2.png) [@J.D](https://forum.wixstudio.com/u/J.D)\
**Post date:** [August 2, 2021, 3:23pm UTC](https://forum.wixstudio.com/t/hyperlink-box/15695/11 "2021-08-02T15:23:20Z")

</div>

Hey, this thread is too old.  
Please open a new thread and explain what you’re trying to do in details (+ explain what a multiple box is). Thanks.
