Looking for a bit of help creating an interactive dropdown list .
To avoid confusion, I’m not looking for a Menu Navigation Bar dropdown it has to be separate.
If this has already been asked, please point me in the right direction.
I’m trying to create a dropdown list on my home page that links to other pages.
- It needs 6 options (pages) inside of it.
- These will then link to their own category pages. (see picture below)
When you click one of those options, I would like it to link to the page it relates to.
i.e Adventure in the dropdown will link to the Adventure Tour page.
How did I get the dropdown?
I turned on the Developer options and grabbed a dropdown box from the user input section.
To my understanding these dropdowns are usually for forms, but i’ve heard that they can be used for what I’m trying to do here.
Currently, I only have the design setup (pictured above) and you can click the items. But none of those items are linked to anything, as I don’t know how to link them to a page or IF that’s even possible.
Is there some coding I can do to get this working?
Or another option of a dropdown list/menu that I could work with?
I appreciate any help on this, I’ve been staring at it for hours without any results.
Hold on, I am making a tutorial for you on this one.
Oh really? Thanks a bunch!
@terminator_408 Yes, oh really… I was planning a video on that next week but did it today to help you out. It is now uploading so hold on. Will paste url here in minutes for you. Thank you for using Wix Code.
Here is the video and all the code you will need. Any more questions here is the place.
https://www.wixshow.com/wixcode/today/Redirect-Users-using-Dropdowns-in-Wix-Code
@andreas-kviby Thank you for making that. It was EXACTLY what I needed.
Dropdowns are working perfectly now.
Sometimes the linked page loads a little slow, but that may just be the images and videos needing optimizing.
@andreas-kviby Great video. Worked first time. Many thanks.
@andreas-kviby Hi thanks for the video, really helped, thankyou. I was wondering, when selecting an option in the drop down, is it possible to have it open new tab for the redirect, rather than replace current page. Also rather than URL is it possible a selection opens an uploaded site file document. Thanks in advance.
Thank you for your help i will give this a go. Much appreciated.
@hello44 - sounds like you have a great tutorial here but when I click on the URL to it gives an error and says it’s not a domain yet? Can you please provide the updated link to the tutorial as I would be extremely grateful - it’s exactly what I’m needing to do for a client.
Thanks in advance,
Juanita Schwalger
@deleteduser Thanks Heath
@andreas-kviby Hello can you update the link you shared i cant open it
"
Here is the video and all the code you will need. Any more questions here is the place.
https://www.wixshow.com/wixcode/today/Redirect-Users-using-Dropdowns-in-Wix-Code
"
@yasmeenhdaib
Hi Yasmeen, I recently tried it using the code as per Andreas’ video that Heath has shared with you but I couldn’t make it work (I am a beginner Corvid coder though!). Instead I was able to use a button to effectively do the same thing - it requires an extra click by users on a “Go Now” button but in terms of user experience I’m okay with that.
My code is below and #industrydropdwon is the name of my dropdown element and button1 the name of my button. It is still worth watching Andreas’ video that Heath shared if you’re a newbie like me.
Code:
// For full API documentation, including code examples, visit Velo API Reference - Wix.com
import wixLocation from ‘wix-location’;
export function button1_click(event) {
let gotoURL= $w(“#industrydropdown”).value;
wixLocation.to(gotoURL);
//Add your code for this event here:
}
@deleteduser Thank you so much
@contact99941 Thank you so much, I will try it
Is there a way I could link the drop-down ‘labels’ (choices) to LINK to a LIGHTBOX (not a Page)?
You can’t really link to a Lightbox, but you can use the Dropdown to open the selected Lightbox in the Dropdown’s onChange event handler . See the openLightbox() API for details for how to open a Lightbox.
@yisrael-wix
Closed as old post from 2018 and they had already added it as a new forum post too.