Question

How to use HTML Anchor Tags in Cards


I haven’t found any questions about Anchor Tags posted since the new table of contents feature came out so the answers on those old threads are just confusing me... so I thought I’d post this question again in the context of recent Guru updates..

 

As an example, lets say I have a guru card structured like this:

(1+ screen worth of Text)

Information (this is a Large Header)

(1+ screen worth of Text)

Additional Information (this is a Large Header)

(1+ screen worth of Text)

Even - More $ Additional & Information (this is a Large Header)

(1+ screen worth of Text)

 

So my question is, how do I create a URL with an Anchor Tag that will take a reader directly to the relevant section of a Guru card.

Lets say the Guru Card’s URL is: https://app.getguru.com/card/whatever/ImportantInformation

I’m very encouraged that if I create a URL that looks like this:

https://app.getguru.com/card/whatever/ImportantInformation#Information

...it brings me directly to the section with the Large Header that has only one word in it, “Information”.

But what if I want to send a person to the section with the Large Header “Additional Information”. Because it has a space, I can’t find your “formula” for how to get someone to that section. Usually Guru replaces spaces with dashes. So I tried:

https://app.getguru.com/card/whatever/ImportantInformation#Additional-Information

...but that didn’t take me directly to the correct section. Can you tell me if there is a usable anchor tag generated for a section with two or more words separated by only spaces that I can utilize in a link?

Finally, occasionally we will have a Large headers that will contain a dash or a comma or a apostrophe so that is why I created the large header “Even - More $ Additional & Information”. Is there a way to create a link, with an anchor tag after the pound character, that would bring me to this section?

4 replies

Userlevel 2
Badge +1

I don’t believe this works in Guru (in any way). Initially, we created TOC anchors using markdown blocks, but we scrapped that with the TOC feature rollout. 

There is no way to create an anchor link.

Userlevel 1

You may want to try to html encode the anchor name, which would turn spaces into %20

So, for your example, it would look like:

https://app.getguru.com/card/whatever/ImportantInformation#Additional%20Information

 

Caveat that this doesn’t work with headings inside collapsibles, you can’t anchor into a heading that is in a collapsible section. 

Second caveat is that this does interesting things when you click the anchor when the Card is open in the extension - it will change the current URL which is most likely a different website, and that website may interact strangely when the anchor tag is placed in the URL address.

I’ll play with the suggestions for adding the “%20” URL’s. I don’t fully understand the second caveat but I’ll play with it.

 

I would ask that the Guru team add support for something like this into the system. It looks like there have been various questions on this topic for years. One of the powers we are starting to discover with Guru is to link out to cards from inside various systems. The issue is that Guru needs to make it easy to link to specific parts of a card.

 

It would even be nice if the native inter-Guru links also supported linking to a specific section in a card but that is an extra

Userlevel 1

Thanks @Ryan R ! 

We are tracking the popularity of this feature request here, so please go and vote for it!
 

 

Reply