CMS Collection Item Interactions

Design help CMS
1

Is it possible to use interactions on collection items?

I’m currently building out a 2 column grid, where the column on the left are images and the column on the right are links that are suppose to show its respective images on hover. For some reason IX2 won’t register the interactions. Anyone know how to solve this issue with IX2?

PS. I made a soft fix using Legacy but it’s limiting.

You can find the issue on the Roster Template page in the section labeled “Catalog”.

Preview Link
https://www.veryspecialmusic.com/roster/tannermolique

Share Link
https://preview.webflow.com/preview/veryspecialmusic?utm_source=veryspecialmusic&preview=c6787e7328ffbdd8f20983ff888738d5

Here is my public share link: LINK
(how to access public share link)

2

Hey @Jereme_Wijesekera,

It’s definitely possible!

See what I’ve done here http://rainfall.com. Hovering on each block displays dynamic content. Although, I used the opacity in the effects tab on the right side of the designer panel (not legacy/IX2).

What you need to do;

  1. Add a new CMS field in your CMS collection named image overlay
  2. Add a div block (absolute position) to a link block (relative position)
  3. Name the div block CSS class as ‘image on hover’ or whatever you want
  4. Go to the dynamic styles settings for that div block and link it to the newly created CMS field
  5. Then go to the effects tab (see attached image) and set the opacity to 0, scroll back up to the selector and change the state to hover, go back to the effects tab at the bottom and set the opacity to 100%.

Hope this helps! Let me know if it does.

Best,
Naweed

1 Like