Conditional visibility in Webflow and Tangram

Published on
November 14, 2023
Paris Mielke

In order to conditionally hide everything inside of a div block based on the value a custom field is currently set to, follow these steps:

1) Wrap the thing you want to conditionally hide in a div block. It is our best practice to add a class to this div block like "Hide Class".
2) Wrap the Hide Class div block in another div block set to "display: block". Name it something like "Safety Wrapper".
3) Apply the HTML attributes to the Hide Class div block:

If you want to hide everything inside the div block unless a certain field is set to ANYTHING, add the following:

tg-hide-unless-field = "[field_id]"
tg-hide-unless-value = "*"


If you want to hide everything inside the div block unless a certain field is set to NOTHING, add the following:

tg-hide-unless-field = "[field_id]"
tg-hide-unless-value = "null"

If you want to hide everything inside the div block unless a certain field is set to a specific value, add the following:

tg-hide-unless-field = "[field_id]"
tg-hide-unless-value = "[specific value]" e.g. "purple"

Get notified of new features & resources.

Subscribe to our newsletter and stay up-to-date on our roadmap, new features, and free resources to help you scale your marketplace.

Thank you! Your submission has been received!
Oops! Something went wrong while submitting the form.
templatetemplatetemplatetemplate
templatetemplatetemplatetemplate
templatetemplatetemplatetemplate
templatetemplatetemplatetemplate
object