Drop down auto-expand on page load

Hello!

I’m having trouble setting up custom code so this FAQ dropdown automatically expands on the homepage.

Do you know how to have the drop down auto-expand on page load?


Here is my site Read-Only

hey @miikede :slight_smile: you’ll have to be a bit more specific. which FAQ dropdown on the homepage? And I don’t see any custom code on the page yet.

Hey, the dropdown box labeled “Play [Lesson 101]” where you click to expand.
I inserted custom code from this solution but it’s not working. Check out the live site here.

Thanks for the help!

Hey!

Make sure you give the dropdown element your dropdown-home ID in the settings!

image

I think you haven’t set any, and the script you copied looks for an element with that ID.

Let me know if this works!

Oh wait! You set the dropdown-home ID to the wrong element!
It’s set on the nav element inside the dropdown. Make sure to remove it there!

I just changed it, it does do something—it removes the bottom line on the dropdown box but doesn’t open it.

I wonder why?

You probably set the ID dropdown-home on the wrong element.

Set it on the dropdown itself, not the toggle inside the dropdown!

image

Make sure it says “Dropdown settings” and NOT “Dropdown toggle settings”

image

Tried changing it to every single dropdown option, currently on “dropdown settings”. It doesn’t work :cry:

Can you provide me a designer read-only link (if not publicly, maybe via DM)?

Don’t worry, we’ll figure this out!

Yes, here you go. Thanks for the help, much appreciated!

Sorry I was mistaken, the element that the script should target is actually the toggle :confused:

But I tried that too, I also tried setting an animation on page load to open the dropdown, also didn’t work. I would need to replicate your layout in order to progress more…

I also tried various methods on simulating clicks on the toggle element programmatically or setting the w--open class to the dropdown parent and trigger. It doesn’t call the eventHandlers that WF uses internally to modify the dropdown components (like setting the classes and attributes). I thought it might be due to the custom interactions you’ve set up for it - but I created my own project without any interactions, didn’t work either.

I’m sorry - dropdown elements are wierd in WF.

I would suggest creating your own dropdown (it’s easy!) and have it open from the very beginning. You won’t need any scripts or hacks to get it working.

Check out this guide from WF:

Sorry for letting you down!

No worries, thanks for the work you put in!

1 Like