Main Content

Using WC Glossary

Using WC Glossary

WC Glossary lets you make a reference to term in a glossary page from your lesson content.  For example, I am now mentioning apple, banana, and carrot.  If you hover over them, you can see the definition from my glossary page.  If you click them, you will go directly to the section of my glossary where each one is defined.

To use WC glossary, you need to set up the following:

    Your Glossary Page

    The simplest way to set up your glossary page is like this:

    <h3>Sample Glossary of Terms</h3>
    <h4 id="a">A</h4>
    <dl class="glossarylist">
    <dt id="apple">Apple</dt>
    <dd class="apple">Something red and delicious.</dd>
    ...
    <dt id="banana">Banana</dt>
    <dd class="banana">Something yellow and tasty.</dd>
    ... <dt id="carrot">Carrot</dt>
    <dd class="carrot">Something orange and crunchy.</dd>
    ... </dl>

    ...but if you would like to create an anchor menu at the top of your glossary you could combine WC Glossary with WC Anchor Nav and do something like this:

    <h3>Sample Glossary of Terms</h3>
    <p id="anchormenu" class="h3"></p>
    <h4 id="a">A</h4>
    <dl class="glossarylist">
    <dt id="apple">Apple</dt>
    <dd class="apple">Something red and delicious.</dd>
    ...
    </dl>
    <h4 id="b">B</h4>
    <dl class="glossarylist">
    <dt id="banana">Banana</dt>
    <dd class="banana">Something yellow and tasty.</dd>
    ...
    </dl>
    <h4 id="c">C</h4>
    <dl class="glossarylist">
    <dt id="carrot">Carrot</dt>
    <dd class="carrot">Something orange and crunchy.</dd>
    ...
    </dl>

    All you have to do to reference a term in your glossary is make hyperlink and give it the linktodefinition class:

    <a href="glossary.html#apple" class="linktodefinition">apple</a>

    Top of page