---
title: "Glossary Web Component – David Bushell – Web Dev (UK)"
description: "!https://dbushell.com/2025/05/07/glossary-web-component/"
date: 2025-07-25
published: true
tags:
  - blog
  - thought
template: link
---


<div class="embed-card embed-card-external">
  <a href="https://dbushell.com/2025/05/07/glossary-web-component/" class="embed-card-link" target="_blank" rel="noopener noreferrer">
    <div class="embed-card-image">
      <img src="https://dbushell.com/images/articles/2025-05-07-glossary-web-component.png" alt="Glossary Web Component — The one where I put the hypercard in the hyperlink" loading="lazy">
    </div>
    <div class="embed-card-content">
      <div class="embed-card-title">Glossary Web Component</div>
      <div class="embed-card-description">The one where I put the hypercard in the hyperlink</div>
      <div class="embed-card-meta">dbushell.com &middot; dbushell.com</div>
    </div>
  </a>
</div>


I really enjoy David's Glossary, he has absolutely nailed it.  I'm working on one for myself that feels close but not quite.  I want to have a list of words that auto glossary to terms for me, maybe this is too much automation and I should just lean on wikilinks, i.e. <a href="/sick-wikilink-hover/" class="wikilink" data-title="sick wikilink hover" data-description="Today I set up some sick wikilink hover effects using tailwind see a-case-for-tailwindcss. When you hover over them they show an image preview of the link..." data-date="2024-05-30">sick wikilink hover</a>, they only take wrapping in brackets.   But like David mentions here its a lot of work to make sure they are right on all the older posts.  I think it needs to be done with js on my setup, I don't have no fancy wroker to modify html on the way out, I'm fully static right now, so i would need to do full rebuilds any time the glossary changes, i'm trying to cut down on the number of features that require full site rebuilds and potential cache issues.