- This topic has 9 replies, 2 voices, and was last updated 7 years, 6 months ago by
.
I have 2 sets of categories in my portfolio and would like to develop a landing page for each. When I select the parent category I want to show in the Portfolio 2.0 content editor, it only shows the projects that fall under that parent category, but shows all the labels for all my other categories and sub-categories. Is there a way to hide the other categories that aren’t applicable?
Here’s a draft of the landing page and I only want the sub-categories from the drop-down menu “life” category to show. I’d eventually like to replace the menu item (currently set to Portfolio Category of the same name).
I hope you are well today and thank you for your question.
You can just display life category and hide all other categories by adding the following CSS code in the Custom CSS code option of your theme on the below path.
Admin Area -> Appearance -> Theme Settings -> Custom Code -> CSS Code
#portfolio-fancy-filter-6e9cf96963b6e1ac988a0c5678b41524 .sh-filter-item { display: none; } #portfolio-fancy-filter-6e9cf96963b6e1ac988a0c5678b41524 .sh-filter-item[data-filter="*"], #portfolio-fancy-filter-6e9cf96963b6e1ac988a0c5678b41524 .sh-filter-item[data-filter=".category-life"] { display: inline-block; }Best regards,
Shufflehound teamThanks. I was able to modify to show my “Life” subcategories as pasted below. I’d like to do the same for my “Work” landing page to show its subcategories. How do I edit the code for that page’s portfolio? It seems the Portfolio content element works to only show the 3 subcategories (first portfolio on this page), but not the Portfolio 2.0 (second portfolio on this page) which is still showing all the categories.
https://kathleenpduffy.com/work/
#portfolio-fancy-filter-6e9cf96963b6e1ac988a0c5678b41524 .sh-filter-item {
display: none;
}#portfolio-fancy-filter-6e9cf96963b6e1ac988a0c5678b41524 .sh-filter-item[data-filter=”*”],
#portfolio-fancy-filter-6e9cf96963b6e1ac988a0c5678b41524 .sh-filter-item[data-filter=”.category-travel”],
#portfolio-fancy-filter-6e9cf96963b6e1ac988a0c5678b41524 .sh-filter-item[data-filter=”.category-logos”],#portfolio-fancy-filter-6e9cf96963b6e1ac988a0c5678b41524 .sh-filter-item[data-filter=”.category-costuming”] {
display: inline-block;
}Thanks.
To achieve same on the shared work page please also use the below custom CSS code.
#portfolio-fancy-filter-c62cbc9b3652ac33f01612b2bb46bac0 .sh-filter-item { display: none; } #portfolio-fancy-filter-c62cbc9b3652ac33f01612b2bb46bac0 .sh-filter-item[data-filter="*"], #portfolio-fancy-filter-c62cbc9b3652ac33f01612b2bb46bac0 .sh-filter-item[data-filter=".category-concepts"], #portfolio-fancy-filter-c62cbc9b3652ac33f01612b2bb46bac0 .sh-filter-item[data-filter=".category-plans"], #portfolio-fancy-filter-c62cbc9b3652ac33f01612b2bb46bac0 .sh-filter-item[data-filter=".category-work"] { display: inline-block; }Thanks. I’d like it to show a different subcategory than “work” (Work is the parent category). I had it named Before/After, but when I replaced “work” in the 3rd item above with “Before/After”, it didn’t grab those with that category. I tried changing the category name thinking the “/” was the problem, so I called it “PhotoSimulations” and it still isn’t grabbing everything in that category. I would prefer it be called “Photo Simulations” with a space if possible. Any idea why my edit to the code did not work? Thanks.
#portfolio-fancy-filter-c62cbc9b3652ac33f01612b2bb46bac0 .sh-filter-item {
display: none;
}
#portfolio-fancy-filter-c62cbc9b3652ac33f01612b2bb46bac0 .sh-filter-item[data-filter=”*”],
#portfolio-fancy-filter-c62cbc9b3652ac33f01612b2bb46bac0 .sh-filter-item[data-filter=”.category-concepts”],
#portfolio-fancy-filter-c62cbc9b3652ac33f01612b2bb46bac0 .sh-filter-item[data-filter=”.category-plans”],
#portfolio-fancy-filter-c62cbc9b3652ac33f01612b2bb46bac0 .sh-filter-item[data-filter=”.category-photosimulations”] {
display: inline-block;
}Please change the text “.category-photosimulations” in your above code to the text “.category-before-after”
Ahh, the slug. Thanks still learning all this web code stuff! I appreciate the help.
You are most welcome here 🙂
One last filter I’d like to customize more. On my homepage, I’d like the filter to only show “All” “Work” and “Life”. Just too many tabs with all the subcategories showing. Thanks.
Use the below custom CSS code to achieve it.
#portfolio-fancy-filter-7c965475e86778586eb3f5c5f5821836 .sh-filter-item { display: none; } #portfolio-fancy-filter-7c965475e86778586eb3f5c5f5821836 .sh-filter-item[data-filter="*"], #portfolio-fancy-filter-7c965475e86778586eb3f5c5f5821836 .sh-filter-item[data-filter=".category-life"], #portfolio-fancy-filter-7c965475e86778586eb3f5c5f5821836 .sh-filter-item[data-filter=".category-work"] { display: inline-block; }
