Streaming live at 10am (PST)

Remove element from a symbol instance

In the attached screen shot, I am trying to remove the third tag (shown empty) in the Case Study Card symbol. Is there a way to do this?


Here is my site Read-Only: LINK
(how to share your site Read-Only link)

If you edit the symbol you can make changes to elements just as you would with any other element in a page. If you want to edit only one particular instance then unlink the symbol before making the changes.

Currently there’s no way to change styles—including visibility—on Symbol instances (yet) so you’d need a separate instance for cards with less than 3 tags.

Edit: As @Gail_Ranger mentioned, you could unlink the Symbol for that single instance, but just like having a separate instance that makes it more difficult to make sweeping layout changes to your card designs that propagate to all instances across the site.

This is a situation where I’d probably forego using Symbols entirely and instead just create my cards with classes/comb-classes. I’m assuming you’re not using CMS content here (as this would make it easy to have a nested Collection List within this card list for those tags) so unfortunately the process will be a bit more manual any way you slice it.

I just added a few lines of “custom code” on the head of the page to hide an element, maybe it is not a good practice but it works for me. :thinking:

<style>
.class-you-want-to-hide {
display: none !important;
}
</style>