I have just started setting up my website, and I'm using Kalium's Agency Demo as a starting point. I am looking to build the site almost entirely around Kalium's Portfolio with live filtering. How can I change the Portfolio Category CSS so that the categories are listed on the side of the portfolio items (like a sidebar), rather than on top? Thanks,
We don't offer an option like this for the moment but it would be a nice feature for our next theme updates.
To achieve that you must modify CSS codes and place your CSS modifications on the Custom CSS area and maybe you need to edit any theme file too.
If you're looking for professional help in this matter, there's always someone available for such tasks on the WP Kraken or Codeable. Pricing and timeline are always straightforward there and that's the main reason for recommending those services.
Thanks for the reply. Can you point me to the classes and id's in the CSS that I would need to modify in order to change this? I am proficient enough in CSS to give it a shot myself.
EDIT: I've managed to locate the corresponding CSS myself. Can you point me to any associated theme files?
I'm sorry but I don't know where exactly you need to do that change. I think that you can apply your code changes on the functions.php file and if you have to add if you need to add CSS codes then you can apply those codes on the Custom CSS area of the theme.
Thanks for hanging in there with me. I've made some progress and located all code related to the Laborator portfolio (CSS & PHP). I managed to style the portfolio categories properly, and now I just need to align their div inline with the portfolio container div. I've included a screenshot of what I'm trying to achieve. Maybe you can help or advise me on this last step? I think there are two approaches:
1. Align the divs horizontally using CSS. I haven't been able to achieve this yet, but I think it is just a matter of tracking down the right selectors and style properties.
2. Hide the portfolio categories and build my own sidebar that contains links that trigger PHP portfolio queries. I could do this if I knew how to properly format the query that the following function expects:
1— This is a customization question and support doesn't offer customization services as we wrote on our support homepage and on this area. I will try to help you this time if I can but if that is very complicated I'm afraid that I can't help you.
Not sure why the site isn't working for you. Thanks for the heads up! I'll look into it.
As far as customization vs. support goes, that's okay, I understand. I managed to solve the issue myself (screenshot attached).
I will say that I think a commented .CSS file for the Kalium theme or comprehensive documentation on the .CSS selectors used by the theme would be a very nice feature for users. The .CSS file is 27,000 lines long! Also, the portfolio filter selector is named '.product-filter,' which is somewhat confusing when you're trying to track it down. I think some information on what's going on under the hood would go a long way in helping your users.
For those who are interested on styling their portfolio filters:
.product-filter
is the selector for the portfolio category filter (the div that contains your portfolio categories)
.portfolio-root-categories
is the selector used to style the categories themselves
Hello,
I have just started setting up my website, and I'm using Kalium's Agency Demo as a starting point. I am looking to build the site almost entirely around Kalium's Portfolio with live filtering. How can I change the Portfolio Category CSS so that the categories are listed on the side of the portfolio items (like a sidebar), rather than on top? Thanks,
Mike
Hi Mike,
We don't offer an option like this for the moment but it would be a nice feature for our next theme updates.
To achieve that you must modify CSS codes and place your CSS modifications on the Custom CSS area and maybe you need to edit any theme file too.
If you're looking for professional help in this matter, there's always someone available for such tasks on the WP Kraken or Codeable. Pricing and timeline are always straightforward there and that's the main reason for recommending those services.
Thanks for your understanding!
Hi Ylli,
Thanks for the reply. Can you point me to the classes and id's in the CSS that I would need to modify in order to change this? I am proficient enough in CSS to give it a shot myself.
EDIT: I've managed to locate the corresponding CSS myself. Can you point me to any associated theme files?
Thanks,
Mike
Hi Mike,
I'm sorry but I don't know where exactly you need to do that change. I think that you can apply your code changes on the functions.php file and if you have to add if you need to add CSS codes then you can apply those codes on the Custom CSS area of the theme.
Thanks!
Hey Ylli,
Thanks for hanging in there with me. I've made some progress and located all code related to the Laborator portfolio (CSS & PHP). I managed to style the portfolio categories properly, and now I just need to align their div inline with the portfolio container div. I've included a screenshot of what I'm trying to achieve. Maybe you can help or advise me on this last step? I think there are two approaches:
1. Align the divs horizontally using CSS. I haven't been able to achieve this yet, but I think it is just a matter of tracking down the right selectors and style properties.
2. Hide the portfolio categories and build my own sidebar that contains links that trigger PHP portfolio queries. I could do this if I knew how to properly format the query that the following function expects:
Or more specifically, I just need to know which function is fired when a user clicks on a portfolio category.
Can you advise me at all on these options?
Thanks,
Mike
Hi Mike,
1— This is a customization question and support doesn't offer customization services as we wrote on our support homepage and on this area. I will try to help you this time if I can but if that is very complicated I'm afraid that I can't help you.
Your site is not working on my end:
(view on new page)
2— If your portfolio is called through WPBakery Page Builder then you can press this option (video) to hide the filters.
I'm really sorry but that is all that we can do to help you. Those are classified as a customization questions and we can't help you there.
Hope for your understanding!
Hi Ylli,
Not sure why the site isn't working for you. Thanks for the heads up! I'll look into it.
As far as customization vs. support goes, that's okay, I understand. I managed to solve the issue myself (screenshot attached).
I will say that I think a commented .CSS file for the Kalium theme or comprehensive documentation on the .CSS selectors used by the theme would be a very nice feature for users. The .CSS file is 27,000 lines long! Also, the portfolio filter selector is named '.product-filter,' which is somewhat confusing when you're trying to track it down. I think some information on what's going on under the hood would go a long way in helping your users.
For those who are interested on styling their portfolio filters:
is the selector for the portfolio category filter (the div that contains your portfolio categories)
is the selector used to style the categories themselves
Thanks for your help, Ylli.
Mike
Hi Mike,
Thanks for your clarification, I'm sure that someone will find it useful. We will also check the naming of the filter on the future theme updates.
Have a great day!