Creating Tooltips/Definitions like those on Support.SquareSpace.com

I am wanting to use something very similar to the tooltips/definitions that show up on nearly every page of the SquareSpace Support site.

As an example:

This is from the Getting Started page

These seem to be using the dfn html tag, and appear consistently throughout the site.

Were these manually added, or is there some css or othewise wizardry that can be done to dynamically add this type of tag to every instance of a word on a given site?

I'd love to have a glossary of terms with definitions/links to those terms very similar to what is happening here, but adding them manually to every instance of each word will be nightmarish.

Thanks!