How to Create Slugs in Airtable Using Automations and Scripting

This is a small piece of a larger workflow that I use for dealing with data in Airtable and then sending it over to Webflow. And as part of sending data from Airtable to Webflow, one of the pieces of data that I need to have is a Webflow Slug. And since we're no coders and love automations, there's no reason to hard code the Webflow slug. And so I don't, I use a little bit of Airtable built in capabilities to dynamically create the Webflow Slug. And then I've also done it in such a flexible way that if it turns out I don't like what ends up being dynamically created, I've got the ability to go in and change it.

For this tutorial, I've created a new Airtable base and added a few of the things that we're going to need. So here I've got my basic table that I've named table one. I've created a couple of different views. So I have a grid view, I've got a couple views that I use as part of my automations. And then I've got a view that I use for error handling.

In my table I have my primary field which is a name field. It's just a basic text field. I have a status field that's a single select. And this is something that when you are creating something new in Airtable, is often a default depending upon if you're creating from a blank base or if you're creating from a template. This may not be there.

As you can see, I've left some of the defaults, but I've also added two additional options called Create Slug and Slug Created. And then I have a text field, single line text field that I've named Webflow Slug. Over here under automations, I've created two different automations and we are about to dive into them. I'm going to go through two different use cases here. I'm going to go initially through the use case of what I am doing currently.

And this is an adaptation of something that I had previously been doing but had been starting to encounter some errors and a little bit of wonkiness. And so I'll show you that as the second use case. But for the most part, you're probably going to get what you need by looking at this first use case. So let's dive in. That first use case is creating a slug based on a status.

And so my and if we take a look at the automation, we can see when record enters a view and it's this view here, create slug based on status. So let's go take a look at what that means. And so pretty straightforward records will show up in this view where the status column is Create Slug. So I want an action taken and that action is create a slug.

So when a record enters this view, I want to have two actions take place. I want a script to be run and I want the status to be updated. So let's take a look at the script.

Okay, so as part of my script, I'm defining two input variables. My first is my ID, which is the air table record that kind of entered the view and is causing action to take place. And then I've also defined a slug name and that slug name is pulling from my primary field, my name field. And they are used in a couple spots here in the script. So if you use the script, you're going to want to make sure that the slug name is going to match the slug name here.

And you're also going to want to update this here to be whatever table name you have. In my case it's table one. And then you're going to want to update this field here for where you want the outputted slug to be. And so in my case I've labeled Webflow Slug. What the script is doing is it is using the encode Uri component which is basically kind of making content friendly to be as part of a URL.

It's also using the two lowercase command so that if I have like a blog post title that has capitalization, that my output, which in this case is my Slug, is going to be all lowercase and it's going to be replacing special characters with a Hyphen. So for example, if the spaces that might be in that name field are going to get replaced with a Hyphen here. And so that's basically it. We're going to finish editing this and then as I mentioned, once the script runs, I update the status to be that the slug has been created. So before the trigger had been Create Slug and this is now basically letting me know that the slug has been created.

Alright, so let's turn this automation on and see it in action. So move back out of here, gonna go to my grid view and let's create a couple.

Okay, so I've added several records and nothing is happening at this point. And the reason that nothing is happening, there isn't anything happening here is because this automation is going to be looking for what is in the status column. And currently the status column is empty. If we take a look here, this view here based on status, there's nothing in here because there is no status. There are no records with the status of Create Slug.

So if we go back over here, we're going to change the status and then we're going to quickly go over to that other view and see if we can catch it. So we're going to say create slug. See, it says create slug. So it has entered in this particular view and we can see that the automation ran, it's disappeared. We saw something very briefly happen in this field and if we go back over here we can see, hey, there's that test one.

And if we come over here to our automation. We can see that it successfully ran.

So let's go back and we'll do that.

Create slug.

I just briefly kind of changed this test three situation because there's something that I kind of wanted to show. So let's trigger this and get this one going so that we can look at it in more detail. So we're going to say create slug. I'm going to wait here a moment. All right.

And so now it's updated. If we take a look at these slugs, we'll notice that as I mentioned before, part of that script is going to make sure that the slug is all lowercase. So we see that these are lower case, that spaces have been replaced with a hyphen. And I also mentioned a few moments ago, one of the reasons that I liked this approach was that I can go in and make edits if I don't like the final output. So let's say in this case here, we've got three hyphens here.

Two of these hyphens are related to the spaces and then the third hyphen is because I had a hyphen here. Well, I can now go in here and make changes if I want. Maybe I just want that single hyphen. Another thing that I could potentially do if this was an ongoing issue where I had a lot of extra hyphens or other things I didn't like, I could go in and change that script. But for my purposes, I rarely have this case of multiple hyphens.

So I haven't updated the script. Okay, so that's basically what you need to know to dynamically be creating your web flow plugs. Now you may be wondering why I am having this situation trigger based on a status. It kind of seems like it's a bit of an extra step and I agree it is a bit of an extra step. So let's take a look at this other scenario that I had previously been using and you may be able to end up seeing some of the wonkiness that I had been witnessing.

Okay?

So in order to do that, I'm going to come in here to this initial one. I'm going to turn this off and I'm going to go and let's take a look at this other case. So in this case it was when a record enters a view and that view was create slug based on slug being empty. So if we go back here and the filtering condition is where Webflow log is empty and that was it.

Run a script and this is the same script, same variables as the other case.

And then once that happens, update status. So again, that little piece of the automation is the same. So let's turn this on.

Okay, so let's take a look at this use case of why I'm not doing this. Hey, if the field is empty, go ahead and run the automation.

So let's go here two a times test four test five, test six, test seven. And we've probably typed in more examples than our previous case and yet we don't have anything here in this Webflow slug column. So if I go over here, I'm going to see that we're getting these failed to run situations and it is often stuck on the two lower case situation because the script is the same as previously.

I have noticed also as part of this that if I go in here and let's just kind of put some dummy content in and then take the dummy content out so that now the slug is empty, the automation will now start to run.

See how the other one came in. And so it's part of this sort of unpredictability that as to why I'm not just basically saying hey, create a slug based on this deal being empty. I've also noticed in situations with this case where if I'm slow typing it'll sometimes start to run and it will only end up with a Webflow slug of my first letter. This is why I showed you that first setup where create slug based on status being tied to a single select and not just is a field empty or not. Hope this is helpful to you.

If you end up using the script in any of your automations. Would love to know how you use it and how you adapt it.

And again, happy building. Thanks for watching.

‍