Avoiding redundant links

GenerateBlocks
#1

Hi all,

I usually custom code all my client projects, this is the first time I am using GP/GB for an important client project. This client is a major university so accessibility is of critical importance to them. I ran into a situation, and while my typical custom solution is obvious, I am a bit stumped on how to accomplish with GB.

I am using a query loop to display a list of staff with headshot and name, Each of which link to their bio page. However, if you do this using the GB UI, you end up with two separate redundant links. I would normally solve by wrapping both elements in the one link, or using aria-hidden and tabindex -1 to remove the image link, however neither of those are readily doable with GB it seems.

I did find a hyperlink group block plugin that has the right idea, but it won’t work in this case since the link path is dynamic from the query loop.

I realized a container can be linked, so I did try that, and while the effect is similar to what I need, the actual link tag is empty which is bad. So basically I would like a container link that actually wraps the contents.

Barring coding this as a custom block myself, anyone know of a way to make this work well?

Thanks!

#2

Hi @jamesrice,

In GB Pro, a container can be turned into a link. Reference: Container Links - Documentation

You can also add certain custom attributes to a GB Block with GB Pro. Example: Image 2022-12-22 at 2.01.50 PM

#3

Thanks, Fernando

I found those things myself, but when you do a container link it create an empty link the size of the container but not wrapping the contents. Why is that?
For both accessibility and styling that seems bad.

#4

Ah, I now see the wrapper option, I was only looking in the sidebar but in the link modal. I will experiment with this.

1 Like
#5

I see. Glad you found the solution!