This simple theme component allows for hiding the lock badge icons for selected secure categories in the drop-down category selectors, header breadcrumbs, navigation sidebar menu, search results, and corresponding category chat channels. There is also an option for toggling for Staff, since seeing the lock icon can be a useful indicator for Staff members.
In the theme’s categories and channels field setting, use the category slug and category ID of each secure category (and chat channel) you want to hide the lock icon for, where the URL of the category is your-forum-address/c/category-slug/ID (you can look in your browser’s address bar from the secured category). Separate the category slug and ID with a semicolon. Leave this blank to hide the lock icon for all secured categories.
For example, https://exampleforum.org/c/vip/6 would have category slug “vip” and category ID = 6 and in the setting category field you would input “vip;6” as one of the list items. Chat channel must be linked to the category and channel slug must be the same as its corresponding category. (See screenshots below)
For sub-categories, the sub-category will inherit the parent category if the latter is hidden. However, you can a hide lock icon in secure sub-categories themselves by separating the parent category and sub-category slugs with a forward slash like parentcategory-slug/subcategory-slug (ie: boats/motorboats/8 ) and use the sub-category ID in the settings field, separated by a semicolon, like category/subcategory;subcategoryID.
To-do: Use category list_type setting and map id. Add setting for hiding lock icon for all secured categories, and setting to hide lock icon of search results from secured categories.
Thanks to @nathank, @Arkshine and @Don for some of the code snippets.
Nice! I’ve hacked a solution together for this a few times on various sites - brilliant to have it as a configurable theme component. You’ve got a knack for churning out some really useful customisations!!
Just checking - is it possible to use a Category selector instead of specifying each slug and ID? I would have thought that would be more durable for those like me who occasionally rename / move categories. Also, it might help with managing subcategories.
The lock icons are actually a bit tricky to hide in some places, that’s why the category ID is also required. I’m trying to figure out doing it also for search results but singling out select categories in the results seems near impossible.
oh good point. Can separate the slugs with a forward slash like category-slug/subcategory-slug (ie: boats/motorboats;8) and just use the subcategory ID. But a subcategory will inherit the parent category if you are hiding the lock icon there.
I will add this to the OP.
Yea I actually started developing it this way but I was getting results that were not what I expected. I will continue to work this method out because it is preferred for the reasons you describe. Thanks for the great feedback Nathan, I appreciate it.
I have updated the component for some of the field descriptions with corrections and more information about subcategories, and also edited the OP with the correct instructions for using subcategories.
Excellent theme component that was created in response to a question I had on another topic here. Can’t thank you enough for putting in the time to help us non-CSS experts manage their forum more effectively.
Ooh, thanks for this. I find all of those icons to be more distracting than informative — especially because they can mean so many different things in terms of actual access.
Nice!!! I love the extension to the navigation sidebar and search.
Have you had any further thoughts on having it as a category selector? To my ignorant mind, both the slug and the ID should be relatively straightforward to obtain from the category object.
heh, yea I worked on this a bit and got close but I was having trouble with the javascript to get the category slug from the ID. I know it’s possible and which methods in the existing library to use and the basic framework, I just need to spend some more time on it and debug. I have it so I can get most of it with the category selector, but in some places it requires the slug. I’m sure someone more proficient in javascript would be able to do it faster. LolaBot (GPT) was no help at all and kept creating nebulous arrays from thin air. lol
When I have some downtime, finishing it is on my Todo list. Also, now I have some more javascript gurus at my disposal. hehe
This is possible and I toyed with it when I was doing the component. When I replaced it with the unlocked padlock the difference in appearance wasn’t that noticeable because the icons are so small (the locked and unlocked ones don’t look much different at that size). I may revisit this. Even the key didn’t look great at that size. TBH.
It didn’t work on the sidebar last time I looked - that was probably fixed ages ago! But it works well now - thanks!
Perhaps the best path of all would be to combine the two TCs into one, as they both pertain to icons associated with categories, and this is an area of overlap.
I’m open to whatever works. I don’t have time at the moment to work on this, but I know we have a general plan to make the hide lock badge component official, we just haven’t gotten to it just yet. I’m also wanting to improve it a bit - the category setting in particular isn’t intuitive enough; I really dislike those kind of delimited text input fields with separators. Probably could use a bit of a code refresh and update given some of our core changes. Feel free to fork and hack! PRs always welcome. I think this was one of the first theme components I built.
When I apply this to a Category, it also affects all subcategories of that Category (unhelpfully); this prevents it from being useful in my context of having restricted private subcategories.