Problem:

I am working on a Team section for a website using Toolset CPT and Views. I need to add functionality where, upon hovering over team member images, further information about the member is displayed in an overlay. The current hover options seem insufficient for this need.

Solution:

Option 1:

Use Kadence Modal Block:

https://toolset.com/2021/09/3-dynamic-designs-using-kadence-blocks-to-inspire-your-website/#kadence-modal-block

Option 2:

Use Fields and Text block in Toolset and incorporate the Bootstrap modal code:

https://getbootstrap.com/docs/3.3/javascript/#modals-related-target

https://toolset.com/forums/topic/opening-a-form-with-a-button-in-a-modal-with-view-block-editor/#post-2417381

You can add dynamic Toolset data inside the HTML code using the buttons available in the Fields and Text block or manually using the shortcode reference:

https://toolset.com/documentation/programmer-reference/views/views-shortcodes/

Relevant Documentation:

https://toolset.com/2021/09/3-dynamic-designs-using-kadence-blocks-to-inspire-your-website/#kadence-modal-block

https://getbootstrap.com/docs/3.3/javascript/#modals-related-target

https://toolset.com/forums/topic/opening-a-form-with-a-button-in-a-modal-with-view-block-editor/#post-2417381

https://toolset.com/documentation/programmer-reference/views/views-shortcodes/