Reveal Random CMS Items on Click

Design help Custom code
1

Hey you awesome forum people.

I’m trying to understand how I could make something happen in Webflow.

The idea is to click on a button and reveal a random CMS item.

You can find an example of that here: GFDA – GFDA Store

Click - This isn’t enough, I need more advice - and another piece of advice shows up.

It’s probably simple, but my brain can’t wrap around the solution.

Any ideas would help.

Kev

2

A number of ways to construct it but pretty much all require custom code.
I’d probably do it as;

  • Collection list, contains all of the cards
  • Per-item button, which triggers the interaction to fade-out all cards, and fade in only the current one ( by sibling target ).
  • JS which handles the trigger event, picks a random card, clicks that button

Another approach would be to use swiper.js, randomize your deck, and your link would trigger a slide advance. Swiper has different transitions, one of which is a fade-out / fade-in effect.

3

@memetican thank you.

I was thinking along the same lines. This is helpful, I’m going to see what I can do.

Kev