Jump to content

Active Page Footer Links

Go to solution Solved by DPruitt,

Recommended Posts

Posted

Hi all, 

Does anyone know how I can add a style to active page links in my website footer?

https://dragonfly-star-7hgp.squarespace.com/
password: sunshine

I just have normal text links in the footer that are for each page. Is there a way i can bold the text link depending on what page you're on? Eg, if I'm on the About page, the About link in the footer would appear bold? 

Thank you

FOOTER-active-link.png

  • Solution
Posted

I think your quickest approach will be to assign a bold link per collection.  Try inserting this into CUSTOM CSS:

/*Homepage*/
#collection-649d74abb21c116f17a9fc23
#block-yui_3_17_2_1_1688402606420_25603
a:first-child{font-weight: 900 !important;}


/*About*/
#collection-64a2a952762de64617a90212
#block-yui_3_17_2_1_1688402606420_25603
a:nth-child(2){font-weight: 900 !important;}


/*Services*/
#collection-64a2a95e48f12318878a5706
#block-yui_3_17_2_1_1688402606420_25603
a:nth-child(3){font-weight: 900 !important;}


/*Contact*/
#collection-64a2a967b299003f9fbecef8
#block-yui_3_17_2_1_1688402606420_25603
a:last-child{font-weight: 900 !important;}

 

Posted

Amazing! That worked. Thanks so much for taking the time to write out that code - will definitely help me in the future now I understand what blocks to target. 

Many thanks

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.