We use Avada Postcards for showing products, posts and portfolios. There is an included filter function.
The basic filters are a row of text. To dress it up a bit our friend, Stephen Walker, adds a bit of css:
.filtered-cards {
padding:1.8rem 2rem;
}
.filtered-cards .fusion-filters{
margin-bottom:2rem;
}
.fusion-filter {
margin-inline:0;
}
.fusion-filter a{
padding:4px 12px;
color:black!important;
font-size:1rem!important;
font-weight:400!important;
background-color:transpareent;
border:1px solid lightgray;
border-radius:0;
}
.fusion-filter a:hover{
background-color:transparent;
color:black;
}
.fusion-filter.fusion-active a{
border:1px solid lightgray!important;
background-color:rgba(0,0,0,.1);
color:rgb(131, 64, 102)!important;
line-height:inherit;
}
.fusion-filter.fusion-active a:hover{
background-color:transparent;
color:var(–awb-color7)!important;
}
