How to display multiple, separate tags?

Hi all, I think I know the answer to this but not sure how to set it up. I’m trying to set up a search for different local artists by genre. If you see the screenshot below, you’ll see this artist has rock and roll, blues and indie in one blue bar as a tag. It shows that way as I stuck in all 3 genres in the genre 1 column. I’d like to have them all be separate tags. I’m thinking I’d have to use a relation column but not sure? Any opinions or feedback greatly appreciated. Thanks in advance!

@Robert_Petitto - didn’t you have a tutorial related to this somewhere? (dynamic tagging)

2 Likes

If you don’t mind having some additional rows (or you might have them already), let’s make a column for all possible tags.

Then in your profile, I assume you’re using comma-separated list to list all tags.

1st step: Make a split text column and split the original list of “tags”.
2nd step: Make a multiple relation from that split text column to the column of all tags.

Then you can display that relation in an inline list, set it up as horizontal.

3rd step: In the sheet where you store all tags, make a relation back to the split text column to return all users who have that tag.

When the user clicks an item in the inline list, they can be directed to a “Link to screen” action to show all artists with the tag.

4 Likes

I did:

3 Likes

Thanks @ThinhDinh @Robert_Petitto !!! Appreciate this!!

2 Likes

Hi @Robert_Petitto @ThinhDinh , finally got some time to work on this. Is there anyway to adjust the spacing between the tags? I’d like them to be more compact and not taking up so much space. See screenshot below. Thanks in advance!

Thanks in advance!

For cases like this I usually use a tile layout, let the text be an overlay, the background will then be generated by dummyimage.

In your case it would be something like:

https://dummyimage.com/600x400/0078be/0078be

3 Likes

:point_up_2: What he said

2 Likes

@ThinhDinh @Robert_Petitto - Thanks for your help guys! I tried all those suggestions with the exception of the dummy image as I truthfully don’t know where I’d be able to edit that. I took screenshots of how everything is set up below as I possibly made a mistake somewhere. Where would I generate a dummyimage? Thanks in advance



Your image setting needs to point to a column with an image url. Looks like you are just pointing it to your tags column, so there is no image to render. Also, you are still using the tag setting to display your tag text. Other things to try would be to set your title or details to your tag column. Also setting the number of tiles per row higher will make everything more compact.

1 Like

Thanks @Jeff_Hager ! I’ll try your suggestions and THANK YOU for pointing out my foolish error in the payment thread. I had assumed my credit card # was safe since only the last 4 digits were shown but forgot about the URL. Anyways, thanks for looking out!

1 Like

No worries. Just gotta be careful out there.

1 Like

You get the hang of creating the relation already, so here’s the aesthetical part.

The background is a static dummyimage link I generated with a hex code of my chosen color. I like to make this the same as my app theme color.

Inline list of tiles layout with settings as below:

Hope it helps.

1 Like