Jump to content

Archive filter - displaying active category

Go to solution Solved by tuanphan,

Recommended Posts

Posted (edited)

https://seabass-hexahedron-tcln.squarespace.com/the-bad-directory-base (pass TNG)

Hi guys

When clicked on, I am wanting to display the active category as a heading above the results, and also highlight the active one in the Archive list.

I've searched high and low. How can I do this? Any ideas @tuanphan

Also can I change the number of posts per page, and change the text of the "older posts" link?

Thank you all in advance 🙂

 

Steph

 

 

Edited by TNG
  • TNG changed the title to Archive filter - displaying active category
  • Solution
Posted

Try this code, if it works, we will give code for other items

https://seabass-hexahedron-tcln.squarespace.com/the-bad-directory-base/category/BAD+Business+Member

Add to Code Injection > Footer

<script>
  if (document.location.pathname.indexOf("/the-bad-directory-base/category/BAD+Business+Member") == 0) {
    document.querySelector('body').classList.add('bad-business-member')
}
</script>
<style>
  .bad-business-member .archive-group-name-link[href*="BAD+Business+Member"]:before {
    content: '';
    position: absolute;
    height: 2px;
    background: #fdc35a;
    top: 50%;
    white-space: pre;
    width: 100%;
}
</style>

 

Email me if you have need any help (free, of course.). Answer within 24 hours. 
Or send to forum message

Contact Customer Care - Learn CSS - Buy me a coffee (thank you!)

Posted

Hi @tuanphan,

Sorry for my slow reply I had my relatives visiting and was off work for a few days!

Thank you so much this seems to work!!! Amazing!

Will there be a way also to place a heading on each category page?

 

Appreciate your help so much!

 

Steph

 

 

Posted
8 hours ago, TNG said:

Hi @tuanphan,

Sorry for my slow reply I had my relatives visiting and was off work for a few days!

Thank you so much this seems to work!!! Amazing!

Will there be a way also to place a heading on each category page?

 

Appreciate your help so much!

 

Steph

 

 

Sorry, I Forgot. Add this code under

<style>
  .bad-business-name .blog-masonry:before {
    content: "BAD Business Name ABCXYZ";
    display: block;
    text-align: center;
    margin-bottom: 20px;
    font-size: 50px;
    font-weight: bold;
}
</style>

 

Email me if you have need any help (free, of course.). Answer within 24 hours. 
Or send to forum message

Contact Customer Care - Learn CSS - Buy me a coffee (thank you!)

  • 4 weeks later...

Create an account or sign in to comment

You need to be a member in order to leave a comment

×
×
  • Create New...

Squarespace Webinars

Free online sessions where you’ll learn the basics and refine your Squarespace skills.

Hire a Designer

Stand out online with the help of an experienced designer or developer.