Customize Squarespace Universal Filter

Hello

I am trying to customize the Universal Filter. I am currently using the 'buttons-inline' but I want to add title to the filter. The title should be above the filter in center or in the left side next to the filter, in bold. This does not appear on this type of style. I would like to add title to the two filters, I am currently using - "Category" and "Tags".

I hope someone can help!

pw thankyou

Can you share your website URL and this page?

Sorry! It's https://cone-dolphin-lxkp.squarespace.com/ It's on the front page 🙂

Try this:

.custom-filter-container:nth-child(1) .customFiltersWrapper .sqs-block:before {
  content:"Categories";
}
.custom-filter-container:nth-child(2) .customFiltersWrapper .sqs-block:before {
  content:"Tags";
}

Thank you! It looks good however Categories seem to be added three places. Do you know what to change?

On 4/8/2024 at 3:26 PM, WebShark said:

Thank you! It looks good however Categories seem to be added three places. Do you know what to change?

Try this new CSS code

.custom-filter-container .customFiltersWrapper .customFiltersContainer:before {
    content: "Kategori";
    display: block;
    font-size: 17px;
    margin-top: 20px;
}

On 4/10/2024 at 11:10 AM, tuanphan said:

Try this new CSS code

.custom-filter-container .customFiltersWrapper .customFiltersContainer:before {
    content: "Kategori";
    display: block;
    font-size: 17px;
    margin-top: 20px;
}

 

Thank you @tuanphan!  It did work! I would also like to have a title for the filter under, where I have marked with a red cross. It should say 'Lokation'. Is this possible? 

18 minutes ago, tuanphan said:

Use this CSS code under

[data-filter="lokation"].sqs-block:before {
    content: "Lokation";
    display: block;
    font-size: 17px;
    margin-top: 20px;
    font-weight: bold;
}

 

THANK YOU! 🙌