-
AuthorPosts
-
February 5, 2024 at 10:42 pm #1433065
I’d like to style the category filters of the portfolio grid. I’ve managed to change font size, remove the “all” sort button and the “/” separator.
I’d like to change color, hover color, center the category names, change the spacing between them. If it’s possible to underline them on hover.I looked at the documentation and i couldn’t find what i was looking for.
Thank you very much
- This topic was modified 8 months, 1 week ago by Qgrafica_7.
February 6, 2024 at 8:24 am #1433189Hey Qgrafica_7,
Thank you for the inquiry.
You can use the following css code to adjust the style of the sorting buttons.
#top .av-sort-yes-tax .av-sort-by-term, #top .av-sort-yes-tax .sort_by_cat a, #top .av-sort-yes-tax .av-sort-by-term, #top .av-sort-yes-tax .sort_by_cat .text-sep { color: red; margin-right: 10px; font-size: 20px; } #top .av-sort-yes-tax .sort_by_cat a:hover { color: blue; }
Best regards,
IsmaelFebruary 6, 2024 at 10:01 pm #1433358Hi and thank you.
Your code didn’t work actually, so i did some research using inspect and i came out with the following working code:#js_sort_items a { color: blue !important; font-size: 25px !important; margin-right: 25px !important; } #js_sort_items a:hover { color: red !important; }
The only thing that i still need is how to center the sort categories horizontally in the page and how to increase the dimension of the grid items
Thank you very much
February 7, 2024 at 10:48 am #1433445Hi,
Glad to know that you managed to adjust the style of the sort buttons. Your modifications are actually the same as the ones we provided above, so it’s quite odd that the modification didn’t work. Anyway, to align the sort buttons to the center, you can add this css code:
#top .sort_by_cat { width: 100%; display: flex; justify-content: center; }
And to increase the size of the grid items, you can adjust the Column count settings in the Styling > Columns tab.
Best regards,
Ismael -
AuthorPosts
- You must be logged in to reply to this topic.