In this tutorial, we will be adding selectable buttons in Wix using our own style. This style is entirely up to you, but in this video, we will be using check vector images to indicate the active buttons.

Download icons here

This is a code snippet written in Velo, a JavaScript-based platform for developing web applications using Wix.

The code uses the $w.onReady function to ensure that all the page components are loaded before executing the code.

The code also adds an onClick event listener to three buttons with IDs "exhibition1Button", "exhibition2Button", and "exhibition3Button". When any of these buttons are clicked, the code checks which button was clicked and sets the source of an image component ("#exhibition1Vector", "#exhibition2Vector", or "#exhibition3Vector") accordingly.

The code also calls a function called "changeState" on an element with the ID "statebox" and passes a string value ("exhibition1", "exhibition2", or "exhibition3") depending on which button was clicked.

Finally, the code assigns a value to an array called "buttonValue" depending on which button was clicked and logs the value of the first element in the array to the console.

Overall, it appears that this code is designed to change the appearance of vector images and update the state of the page when certain buttons are clicked.

Watch Tutorial