How to Add Squarespace Redirects That Work from Facebook & other platforms.

Introduction

Recently, I decided to update the URL slug on my blog page. To preserve the SEO I built, I needed to add redirects to ensure the old links worked. While these standard redirects functioned fine, I noticed they failed for links shared on Facebook. This happened because Facebook added query parameters to the URLs. Here’s how to ensure your redirects work seamlessly, even with these additional parameters.

About This Tutorial: Why Redirects Matter

Redirects are essential for maintaining your website's user experience and SEO value when URLs change. Without them, visitors from social media platforms like Facebook might encounter broken links, leading to a poor user experience and lost traffic.

Understanding Query Parameters

When users click on a Facebook link, it often appends unique query parameters like ?fbclid to the URL for tracking purposes. These parameters can interfere with normal redirects, causing broken links or errors.

Example problematic URL:

https://contigostudio.com/en/work/total-image-ii-website-redesign?fbclid=IwZXh0bgNhZW0CMTEAAR1zPm4CDYjoXJ-4wTo8Ht_C8V3j7Wee7jc7BblfTMd0D7WMrZyl7s9ilu8_aem_AV4UCpK-A87l1txu78cVDa-5kdxAjb0zXoZz1aa4RlKNoRfqUaJ-kcXzvCQaQXmi1Yk-1oMzVgpvAdBRHMgcdV52
    

• Facebook Query Parameters

  When Facebook users click on a link, Facebook often adds query parameters to the URL. These parameters, such as ?fbclid, are unique strings that help track the source of the link. A query parameter is an additional segment of a URL that provides specific data to the server, usually after a question mark (?). Normal redirects might fail with these appended parameters because they don’t account for the additional information, leading to broken links or errors. To ensure proper redirection, it's essential to handle these parameters correctly, maintaining a seamless user experience.

The Step-by-Step Guide

Here's a step-by-step guide to set up redirects with an additional script and ensure they work correctly, even for links with query parameters like “fbclid”.

Step 1: Add Specific Redirects in Squarespace

1. Log into Squarespace:

• Go to your website’s home page and log in.

1. Navigate to Settings:

• From the home menu, go to Settings > Advanced > URL Mappings.

2. Add URL Mappings:

• Add each specific redirect. For example:

Redirect Example Copy

      
/old-url-example -> /new-url-example 301
      

Step 2: Handle Dynamic Redirects with JavaScript

To handle dynamic redirects and query parameters like “?fbclid=”

1. Go to Code Injection:

• Navigate to Settings > Advanced > Code Injection.

2. Add JavaScript Code:

• Insert the following script into the header or footer section (don’t forget to change the URL’s to match the redirect URL’s you entered above:

JavaScript Code Copy

  document.addEventListener("DOMContentLoaded", function() {
    const currentUrl = window.location.pathname + window.location.search;
    const redirectMap = {
      "/old-url-example1": "/new-url-example1",
      "/old-url-example2": "/new-url-example2",
      // Add more mappings as needed
    };
    
    if (redirectMap[currentUrl]) {
      window.location.replace(redirectMap[currentUrl]);
    } else if (currentUrl.startsWith("/old-url-base/")) {
      const newPath = currentUrl.replace("/old-url-base/", "/new-url-base/");
      window.location.replace(newPath);
    }
  });
    

Note: Don’t forget to place this code between an opening and closing script tag: <script> and </script>.

Step 3: Testing

1. Clear Cache:

• Clear your browser cache or use incognito mode.

2. Test URLs:

• Verify the redirects by testing specific URLs with and without query parameters.

Conclusion

By combining specific URL mappings in Squarespace with dynamic JavaScript-based redirects, you can ensure that all links, including those from Facebook and other social media platforms, redirect correctly. This approach maintains the integrity of your website’s structure and user experience.

FAQs about Redirects and Social Media Links

• Why do my redirects not work on Facebook?

  Facebook adds unique query parameters to URLs for tracking purposes, which can interfere with standard redirects. Adding JavaScript code to handle these parameters can ensure your redirects work properly.

• How do I add a redirect in Squarespace?

  IteGo to Settings > Advanced > URL Mappings and add your URL mappings in the format:

  /old-url-example -> /new-url-example 301m description

• What is the purpose of adding JavaScript for redirects?

  JavaScript can dynamically handle redirects, including those with query parameters added by social media platforms, ensuring all URLs redirect correctly.

• How can I test if my redirects are working?

  Clear your browser cache or use incognito mode, then test your URLs with and without query parameters to verify that the redirects are functioning correctly.

Need Help Implementing Your Redirects?

Dennis Pal
Web Designer/Developer

At Contigo Studio, I specialize in creating flawless web experiences tailored to your business needs. Whether it's setting up effective redirects, customizing your site, or solving web design challenges, I've got you covered. I ensure your website performs seamlessly across all platforms and social media channels.

Contact me at Contigo Studio today to elevate your website's functionality and user experience. Let me handle the technical details, so you can focus on what you do best.

Need assistance? I'm here to help every step of the way.

You might also like…