Jump to content

Adding a Custom Colored Hyperlink to a Hidden Page

Go to solution Solved by creedon,

Recommended Posts

Site URL: https://www.worldisonfire.com/maxvibration


I am an artist and voice teacher and am putting the finishing touches on my new art website. One detail I've been struggling with is how to add a custom hyperlink color to the bottom of one of my digital sculptures residing on a hidden page. On my webpage at the link below, there is a large red guitar emoji used as a link at the bottom, where the heading says, "Music Lab".  I am wondering if someone might help me make that guitar link underline color be red, and then when someone hovers over it, have it turn yellow?


Thank you in advance,


Link to comment
  • Solution

Add the following to Design > Custom CSS.

/* music lab link/hover effect */

#collection-5cad3f28104c7bc67dcc0dcf #musiclab-navigation.Index-page--has-image h1 a {

  border-bottom-color : red;

#collection-5cad3f28104c7bc67dcc0dcf #musiclab-navigation.Index-page--has-image h1 a:hover {

  border-bottom-color : yellow;

This is for v7.0 using the Brine template family and is specific to the OP's needs.

Let us know how it goes.

Find my contributions useful? Please like, upvote, mark my answer as best , and see my profile. Thanks for your support!

Link to comment

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.