So what i would like to achieve is to show a class only on subpages of a certain parent page and hide on the rest of the pages. I looked it up and learned i can achieve this with jQuery through page IDs. But this subpages keep getting updated so is there a way to make this automatic?
.sidebar {
example page and subpage;
https://example/event/
https://example/event/pikachu
Thanks
const { pathname } = window.locatione.g.:
https://www.example.com/path1 <-- Hide the class
https://www.example.com/path1/path2 <-- Show the class
https://www.example.com/path1/path3 <-- Show the class
https://www.example.com/path1/path2/path4 <-- Show the class
etc...
// .sidebar class allowed only for sub paths of /path1
// This is the logic //////////////////////////
const { pathname } = window.location;
const target = /^\/path1.*/gim;
if (target.test(pathname) && pathname !== '/path1')
node.classList.add('sidebar');
else node.classList.remove('sidebar');
///////////////////////////////////////////////
You can test a demo HERE