Terminology & Glossary plugin docs
How it works
This plugin parses docs in two ways:
- Parses all
*.mdx
files underdocs/
and replaces each pattern with an appropriate React component supporting a tooltip functionality (see below) - Generates a glossary with all terms corresponding to the
*.md
files underdocs/terms/
.
Parses all markdown files and generates a glossary page with all the pattern terms found in the .md files
Replace patterns with dynamical elements
When writing docs, in order to refer to a term, you may use the following syntax:
where:
term_text
: The terminology text you want it to be visible in the documentation pageterm_name
: The filename of the term file, which resides under./docs/terms
directory.
inside docs/*.mdx
files. After successfully running the script, the above occurrence
will be replaced by a React component, which will render term_text
as a link to the
corresponding term page, which is in turn generated from the term_name
attribute;
furthermore, hovering over term_text
displays a term summary, as extracted from the
corresponding term page.
Example usage
Say you want to reference a term that exists under the ./docs/terms/
directory,
e.g. ./docs/terms/party.md
. You can use the following syntax to reference
this term in your documentation page:
When the script runs, this will be replaced as follows:
which supports the functionality explained above.
How to correctly write a term
This plugin assumes that you follow the structure, as explained below:
Each term should have its own .md
file, inside the ./docs/terms
directory,
and it needs to consist of the following structure:
Pay attention to the
hoverText
attribute, as it's important to provide this attribute (along with the default docusaurus attributes), so the plugin can fetch the correct popup text to show when referencing a term.
Running the script
When you are finished referencing terms and have written corresponding term pages, you can test this locally by running the following command:
This will replace all %%term_text|term_name%%
occurrences with the React component
supporting the required functionality.
Here's an example where the terms have been replaced. When the project is up
and running, you can visit the test example on the /docs/replacement-test
page:
Generate the glossary page
If everything works well with the above procedure, you can then generate a glossary page, by running the following command:
This will generate a file in ./docs/glossary.md
where every term that has been
mentioned above, will be populated in the glossary.md
page.
When the project is up and running, you can visit the glossary on the /docs/essifLab-glossary
page: