SQSP Themes

View Original

How Do I Not Underline Links in Squarespace?

To remove the underlines from links in Squarespace, you’ll need to use custom CSS. Here's a step-by-step guide to help you achieve this:

Step-by-Step Guide

  1. Log in to Your Squarespace Account

  2. Navigate to Squarespace and log in with your credentials.

  3. Access Your Site

  4. Click on the site you want to edit.

  5. Enter the CSS Editor

  6. On the left-hand navigation bar, go to Design.

  7. Under Design, click on Custom CSS.

  8. Add the CSS Code

  9. You will see a blank CSS editor panel. This is where you will input your custom CSS.

```css / Remove underline from all links / a { text-decoration: none; }

/ Ensure that hover state does not include underline / a:hover { text-decoration: none; } ```

This basic code snippet will remove the underline from all the links on your site. It also removes underlining when links are hovered over.

  1. Save Your Changes
  2. After adding the code, click the Save button at the top-left or bottom-right corner of the Custom CSS panel to apply your changes.

Additional Considerations

  • Link Styling: If you only want to remove the underline from specific links (e.g., navigation links, footer links), you will need to target those links more specifically with CSS classes or IDs specific to your theme.

css /* Example: Remove underline from navigation links only */ .nav a { text-decoration: none; }

  • Testing: Always preview your site to ensure that the links look as expected and that you haven’t unintentionally affected other parts of your design.

  • Mobile View: Ensure to check how these changes appear on mobile devices to maintain a consistent and user-friendly design.

Final Steps

  • Once you've saved your CSS changes, take a comprehensive look through different pages and sections to make sure everything looks right.
  • It’s a good practice to revisit your site’s design on different devices and browsers to ensure consistency.

By following these steps, you should be able to remove the underline from links in Squarespace, helping you achieve a cleaner and more polished look for your website.