Discover the Success Stories Behind Our Work
Explore Case Studies
July 26, 2024

How to Set Up 301 Redirects for a Webflow Website

PLAY

In today’s video, I’m going to show you how to migrate all your blogs, resources, and content from a CMS like Wordpress, or Wix, or Squarespace, to Webflow. This is basically a free way to do it. You can use the software that we’re gonna show you and get it done in record time.

So let’s go ahead and dive in, y’all.

Quick refresher on redirects, and the way they work is, they’re preferable for search engines and users. Now let’s say you have an old website and now have a new website, and you’re doing a site rebrand. Let’s say the site is Google.com.

Now what happens is you have the old website’s url, which might be “google.com/services,” and now on your new site redesign you have “google.com/our-services.”

Now what’s gonna happen is when you publish that new website with that changed url, it’s going to cause a 404 error in the search engines. Meaning, the old content is already indexed and shown in Google, so if someone clicks that link, they go back to that old link. What’ll happen is they will get a 404 error.

So the search engine will look at that like, “Okay, this page keeps giving the user a 404 error.” They’re bouncing with the indexed page, and think that it’s not important to the consumer. So it’s not giving them the content that they need.

And what can happen a lot of times is you’ll have an old site that looks terrible—it’s arbitrary—but it’s got great organic rankings. And now you have this new, beautiful site, but all the urls have changed. And now it causes a chain reaction for all your organic traffic to literally decrease overnight.

So I wanna walk you through this quick process with an additional couple of free tools to help you convey this, get it across, and migrate your old site when you rebrand or upgrade a website. So I did want to show you a visual of what that looks like: here’s the old page, and here’s the redirect.

Download Screaming Frog SEO Spider

I created a quick training here, the first thing you wanna do is download Screaming Frog. Screaming Frog is a free software that allows you to pull all the mined data on your website. So it’ll pull all your internal urls, external and security, your H1s, your H2s, your meta descriptions—basically all of that SEO data from a website for free—up to 500 pages.

They have a premium service that costs a little bit more, but you can do up to 500 pages for free. Most sites, in your case, are probably gonna be under 500 pages.

Now once you have that downloaded, you’re gonna open the program, drop your url right here, and then you’re gonna hit Start. And what it’s gonna do is it’s gonna pull all those urls. You’re gonna wanna go ahead and click Internal, and then Export.

And then when you export that CSV file, just import it onto a Google Sheet like I have here. Now once you have it in a Google Sheet, you’re gonna put Old Address here, and you’re gonna put New Address here, so you know where they’re at.

And then what you’re gonna do is you wanna get rid of the main urls, ‘cause you don’t need it. All you need is anything past the foreslash. So I’m just gonna highlight all this, I’m gonna do the cmd+f, I’m gonna type in the url, and then I’m just gonna hit these three buttons, Replace With, Replace All, and hit Done.

Now you can see all those urls just have the second url.

Now let’s say that “blog” is gonna change to “blogs.” So we’re just gonna put it here, and we’re gonna put “/blogs.” So for all the new addresses of the new site build out, you’re gonna add in this column.

Now before, we didn’t have to do this manually, or we would have some type of .json file upload—which is pretty much a nightmare. But one of many amazing things that the team essentially has done is they actually created an extension that allows you to do a bulk update of all your 301 redirects.

Grab the Finsweet Extension

So first thing you wanna do is grab the Finsweet extension—I’ll go ahead and post that link below as well. You can get it right here. Once you install that, it’s gonna add a whole bunch of new attributes to your Webflow Designer.

So when I’m in the Designer, and I go to Projects, and I go to Settings under Hosting, and I scroll down, this is where you add your 301 redirects.

So again, if we have “/blog” and change it to “/blogs,” I can just add the old path and the redirect path here and hit Add Redirect, and it will add that instantly. Then I just need to Publish the site. So as you can see, I only have one redirect here.

It’s from “Work” to “Case Studies.” Now, the things we have done is when you install the extension, it’s gonna add this really cool Bulk Import button here. So I’m gonna hit the bulk import.

Create a CSV Template

Now what you’ll need is the CSV template, which is really super simple. This is what it looks like. You can see it’s got Path, Target Path, and then Old URLs and New URLs. And that is pretty much it.

So what I can do is I can grab that… So I’m gonna drop that in here. I’m gonna take that, and drop it in here, and then you can just copy all your old urls to your new urls.

So I’m just gonna go Open With Google Sheets. You can just copy the paths, I’m just gonna do “/blog,” “/blogs.” And then I’m just gonna hit File, Download as a CSV, and then I can just go back here and I can drag my CSV file back.

Upload the CSV

Now you can see, the old path is “/blog,” the new path is “/blogs,” and I can hit Upload. And it says “Successful” or “Failed.” Okay, it’s probably because of specifics.

Okay, let’s do Download Failed Redirects. Probably because the old path is not public. But ultimately, what you’re gonna do is you have the old path here, the new path there, and I can then see why that fails.

So, “/blog is already a page for this product.” Okay, so that’s probably why. So I’m just gonna do another one.

The old one this time—let’s say “/service,” and the new one is “/services.” The old path is probably not showing there, so that’s probably why it’s not coming up there. Gonna do CSV, and then we’re going to import it here.

So let’s do Bulk Import, grab my file, then I’m just gonna go here and hit drag. I’m gonna grab my file here, Upload. Now it says one Successful, Done, Close.

Publish Your New Site

As you can see, it’s gonna refresh and then reload it right here. Oh, man, you guys don’t understand how huge this is. It’s a painstaking process—especially if you have bigger websites.

This process just made it so much easier. Then you’re just gonna hit the drop down, and then Publish. And you are ready to go.

And that’s it, y’all, that’s how to set up your 301. So when you’re working on a project, make sure that you set up all urls. Start the process as soon as you bring the client on, create a Google Sheet to make sure you’re recording all that data and information, and I guarantee that you’ll have a great and successful launch.

A web designer on laptop waving at computer

Ready to work together?

Let’s link up. Complete our quick form below to schedule a 30 minute consult with our team. We invite companies looking to collaborate to build their website with 5Four.  
Schedule a Chat