Creating a Filterable Gallery in GenerateBlocks, Part 1: Javascript

Published: 30 June 2025
on channel: Addison Hall Design

You requested a filterable category gallery in GenerateBlocks, so here we go! The first step is JavaScript... Lots of JavaScript. So, let's break down the code step-by-step and learn a bit about getting HTML elements and their values, creating new HTML elements and assigning values, and manipulating all of it based on user interaction. Next time, we'll apply this code to our GenerateBlocks gallery and make it filterable! Enjoy!

Here is the pen referenced in this video:
https://codepen.io/addisonhall/pen/dP...

PS: I think I've managed to fix the boo-boos I discovered while recording this video ;-)

OTHER LINKS (some are affiliate links):
AHD GeneratePress Child Theme: https://github.com/addisonhall/genera...
GeneratePress: https://generatepress.com/?ref=144&ca...
GenerateBlocks: https://generateblocks.com/?ref=105&c...
Cloudways WordPress Hosting: https://www.cloudways.com/en/?id=956114

On this page of the site you can watch the video online Creating a Filterable Gallery in GenerateBlocks, Part 1: Javascript with a duration of hours minute second in good quality, which was uploaded by the user Addison Hall Design 30 June 2025, share the link with friends and acquaintances, this video has already been watched 93 times on youtube and it was liked by 2 viewers. Enjoy your viewing!

102