In this tutorial, I’ll be showing you how to build a dictionary/glossary using the GenerateBlocks Query Loop.
This can be useful for your customers to find posts by letter on your website.
I managed to build a solution that works out of the box and only requires you to add a class to enable the functionality.
Demo
1. Setup our query loop
First we need to insert our GenerateBlocks Query Loop and set a couple of parameters:
- Posts per page:
-1
- Order By:
Title
- Order:
ASC
Feel free to style the query loop however you want. I just used the title linked to the post in my tutorial, however you can add whatever information you want.
2. Adding the target class
Next we need to add the class dictionary
to the grid block inside the Query Loop Block
. This is what will tell our code later on to add the dictionary functionality to the loop.
3. Add the code
Now we want to add the code which will modify our targeted Query Loop. Add the 2 code snippets below to functions.php
or code snippet plugin.