IH – Glossary Page
This week I spent some time getting the full Glossary page to work in the Immigration History site. I will show a picture-by-picture story about how I did it.
The whole thing started with a blank Glossary page and a lot of backend work. Stacy helped me use RESTful api to get all the info from the WordPress page and turn it into a JS object called glossary_page.
I could loop through these in order to print all the terms and definitions we have, but a real glossary needs to be in alphabetical order. Javascript’s native sorting allowed me to get them in the right order.
After this I ran into another problem. Since some of these words have parent terms, we want these to appear right under their parent. I had to modify my algorithm so that I only print the words that are not themselves children. After this, for every word that does have children, I would print them below their parent.
The last little bit to the Glossary page was creating labels for every letter. This is mostly for design purposes. I achieved this by comparing the initial letter of our words to the next one, printing a label when a different letter showed up.
As you can see, this works pretty good. When new words show up, they will now appear in the Glossary, as well as new labels for different letters.
As for next steps, I will now work on linking the pop-up definitions to their corresponding Glossary entry. I also have a meeting with the client during my next shift. I will show her how to insert new words and how this changes the site dynamically.