Linking a cms tooltip to a cms modal

I am trying to add a tooltip onto a word to bring up a modal that adds more information, all via cms.

Really struggling here, sharing the link with how far ive got.

Thanks in advance!


Here is my public share link:

https://preview.webflow.com/preview/cambrian-alliance?utm_medium=preview_link&utm_source=designer&utm_content=cambrian-alliance&preview=9485dd8a57993b0d29b368597822d220&pageId=65b379a6c4cb5d62a6df8e58&workflow=preview

Hey Josh, it’s a slightly complex build.
I’ll use terms in reference to the linked words, and definitions in reference to the pop-up content.

If your count of definitions is low, in the hundreds max, the best approach I’ve found is-

  • Create a cms collection with your terms and definitions
  • Build a separate cms collection on the page containing your definition modals, each with a trigger button. Build this out and make sure the triggers work correctly to open the correct modal. ( see cloneable )
  • Hide the definition modals & trigger buttons
  • Link your terms **
  • Custom code to trigger the term-specific definition popup

** As term triggers, I like to create it as a ##term link, so that it’s easily managed in the designer, and the script easily knows how to wire up the appropriate trigger button.

Here’s a nocode lib I’ve built to simplify the trigger wiring, so that a link to ##coffee would click the associated button with the matching name in its SA5 attribute;

The cms modal construction here is the hardest part, use this cloneable as a guide;

Hi Michael,

Thanks for the speedy reply - I’ve had a read through and attempted to action these points but still getting stuck. Do you have any further advice on what I’m doing wrong?

https://preview.webflow.com/preview/cambrian-alliance?utm_medium=preview_link&utm_source=designer&utm_content=cambrian-alliance&preview=b01c710175cba306932eedc877cf8352&pageId=65bd0e317f8416cb96c37302&itemId=65bd0e3508e2288c4cc79ecb&workflow=preview

thanks,

Josh

Hey Josh, it would take quite some time to unpack and debug your setup, if you need some pro dev help, drop me a message.

However I’ve added some notes to my post above, and a cloneable on the CMS-driven modals setup.

1 Like

Thanks Michael - the cloneable is helpful. I will keep trying and reach out again if I get stuck!