How to remove underlines from text links on your Squarespace 7.1 website

Want to remove the underlines from the text links on your Squarespace website?

I’ll show you how to do just that in this short tutorial. All you need to do is follow along and paste the following code into your own site!

One thing to note is that the underlines are helpful to show your customers that the text is a clickable link, so be mindful when removing them. I’ll also show you how to only target links in the header and footer - it’s easier than you think.


Prep: Where to paste your CSS code in Squarespace

First things first, you’ll want to find the CSS panel which is where you’ll be pasting your code. From the main admin area, go to the Design tab and then click on the option called ‘Custom CSS’.


Version 1: Remove the underline from all text links on your Squarespace website

Copy and paste the following code into the CSS panel on your Squarespace website. This will remove the underline from all text links.

a {

background-image: none;
text-decoration: none;

}

 
 


Version 2: Remove the underline from text links in the header and footer sections only

To remove the underline from the text links only in the header and footer areas only, you can make your code more specific by targeting all links in the header and footer. Simply copy and paste the below code into the CSS panel. To only target the header or the footer, remove the header a and the comma or the footer a part of the code.

header a, footer a {

background-image: none;
text-decoration: none;

}

 
 
 

Hi I’m Danielle

I help entrepreneurs & creatives to bring their brand online through beautiful, strategic web design. Click below to learn more about how I can help you to launch your dream website.

 
Previous
Previous

The best Shopify themes for clothing stores that want to sell with style

Next
Next

Squarespace vs Shopify: which website platform is best for your business?