Adding link to the box has been a daunting task specially for people who don’t have experience with coding. Well, you don’t have to be clueless anymore as in this short post you will learn step by step how to add or attach link to the box on your wix website.

1. First thing first, make sure you have added the box to your site.

2. Then you need to enable the Developer Mode by hovering over Dev Mode on your top left menu and then enable it by clicking on the button that says Turn On Developing Mode.

You will see little coding space opened at the bottom of your screen.

3. Now its time to code, select the box and at the bottom in Event handler section you will see this dialogue box (shown below in the image), you need to click “onClick()” and then + icon (basically telling the editor that we want to attach a link to that box)

4. Now you would see the function being added automatically, you just need to add the line where you want the box to go, for instance I want to go to the Page About when someone clicks this box, so I will add the following code inside the function

wixLocation.to(“/about”);

5. That’s it, your whole function should look like this

export function box27_click(event) {
 wixLocation.to(“/about”);
}

6. Make sure to import wix location outside the OnReady function by typing this
import wixLocation from ‘wix-location’;

Complete Code for the Above Example:

import wixLocation from ‘wix-location’;
$w.onReady(function () {
});
export function box27_click(event) {
wixLocation.to(“/about”);
}

You can modify this code accordingly to your needs and wants. You just need to replace the box ID and page name.