No code job board with Webflow, Airtable and Zapier

Resources

Transcript

The setup

  • List of available jobs in Airtable
  • Candidate application form

Showing all available jobs

Easiest (26 minutes)

  • Link each job to application form
  • Embed Airtable gallery in Webflow

Medium

  • Create Webflow CMS
  • Show all upcoming jobs
  • Specific Job Page
  • Send new job postings from Airtable to Webflow with Zapier


Transcript

Testing 1, 2, 3. Let me know if you can hear me. I assume you can. Let me just get set up here. All right. Welcome to automate all the things. Uh, we're going to, you know, come back to my favorite tools, uh, air table here and web flow. We're going to be building a no code job board today. Uh, I'm going to try and, and do this a little simpler, uh, than I did in the past and try to segment it into like two parts, uh, that I can then kind of rejig and then put up as like full on tutorials.

So if you're in the chat, let me know Murillo, is it my saying that right? Hi, welcome. Let me know how you, uh, how you got here, what you expect to learn, where you expect to get out of this. And I'm going to try to put it in. Um, awesome. Actually, let me, let me just take a quick second here. See if I can, um, get the lag down.

Just give me a sec. Cause I think there's a, there's a big delay between us two.

Like that, just give me a sec here. I'm just gonna reduce the lag, the latency. So you can chat at the same time as I'm kind of displaying.

All right. That didn't work at all. So I just, we're going to have to live with the latency. That's fine. It's just a, it's not an actual latencies. That if it's 32nd delay between me saying something and you hearing it, so we'll just have to live with, uh, alright, so here we go. All right. Marilla, we'll try to give you some air table tips and some Webflow tips.

Um, all right. Welcome back. So we are going to build a no code, a job board today within air table using, sorry with Webflow air, table, and Xavier. So I'm just going to pull up up this little, a little cheat sheet today. So the first thing we're going to do is just set up, uh, our, you know, our air table to get the job board into that.

And then. You know, once we have all of our job and our applicants within our table, we're going to embed. The first step is just kind of embedding the view, uh, of, uh, in air table of air table into web flow. Uh, so we're just gonna put the jobs up into. Air table. We're going to create a view where you, you can see all of the available jobs.

And then we're going to create a form where applicants can submit to a specific job, but most of the legwork is going to be done in air table. And we're going to embed that into web flow step two. So that's going to be the easiest way, right? So it's going to be the super, super simple, hopefully. Um, and then step two is, um, use air table, the same job applications.

We have an air table, but we're actually going to send them to web flow into the CMS. And the reason we're going to do that is that it gives us a little more control as to what we want that job to look like. And it doesn't kind of punt out that user to the air table. So first step is going to be, um, creating the jobs and irritates.

Applicant section as well, embedding that into web flow, that's going to be step one. And step two is going to be going a little deeper, creating the CMS, putting all our jobs from air table automatically into web flow and then creating, you know, kind of specific pages. So that's kind of enough. Uh, uh, as introduction.

So I'm going to jump into, uh, the setup, right? So the setup is going to start in air table. So let's go ahead and go into air table. Should have it open somewhere. Here we go. So I did some work before this started. I always do work, but I did a little more this time and I already have kind of a base send me set up.

So a lot of the legwork has been done, but I'll walk you through it just to give you an idea. So, you know, we have two tables in our base. First is jobs. So those are all of the available positions at our current company. And so it's, it's, it's kind of very simple. So what I've done is I've actually kind of use the Airtable job section as a, you know, kind of roadmap, if you will, I'm actually close this, um, So, you know, when you have the title, let's actually go to the, to the kind of larger ones.

So you have the title where that job is a little bit of description, what the qualifications are and about the company. So if we go into, uh, my own job board, similarly, let me just go back here. We have the title location department department here is, you know, they don't have a department to actually change the color based on department, but I wanted to add the department job description.

This is just some, uh, Laura Epsom, um, qualifications. And then this, I should actually hide the applicants for now. So that's going to be our applicants, the jobs section, and then, and we have our applicant section, right? So kind of coming back here where if I come here and I go to the apply. I go to the bottom.

It was kind of giving us an idea of what the expectations are for that applicant to apply to that specific job. Right? First name, last name, email, phone resume, and then a bunch of things around like, you know, some, some, uh, um, that kind of, uh, include more longer texts, right? So we're just copying that first name, last name, email, resume, LinkedIn profile.

Why you're, why you're perfect for this role, which is some long time. And then we have a linked record. So this is at the point where I wanted to show you the link records. So what we always want to do since we're using one table for all of our applicants is to know which job this applicant is applying for.

So I created a linked record between jobs between applicants and jobs, right? So if I extend this, you see that Erin applied for the customer success role that's based in San Francisco, right? So that's kind of our setup for, uh, our applicants. And then we have Josh, so jobs, applicants, and those two are tied together by this linked record.

So I'm going to do here is on hide that field applicants. So that's great. Um, how was the description, text formatted essentially, um, web flow. This is a question coming from a real, so web flow has a rich text field. Or input type, uh, I'll show you how to manage that when we get there. Um, it's a rich text field and you can kind of format it yourself and we're going to be kind of moving from air table to a web flow.

Cool. So let me just kind of go back to the roadmap here. We have a list of available jobs in air table, and then before we kind of jump into that, um, I should have a candidate application form. Right? So what that is is we want, when you think of how. A job board is built. You have a job description, you have a way for that applicant to apply for that job, right?

So we need a form that we can embed into our, uh, air table, into our website, sorry, uh, where the user can input all this information. And then, then it'll populate into our applicants table. So I called this. So you want a job at automate all the things and it's our form. And all we need to do is kind of drag and drop the variables or the input fields right required that user has to upload a resume and CV.

We're all going to make all of this required. There we go. LinkedIn profile, that's optional. And then a little bit of text also required. Um, and then we're also gonna have a linked field, right? So this is gonna actually be a little bit of a challenge because we want to make sure that the applicant is always applying to the role so that, that, you know, they think they're applying to.

So what I mean by that is, you know, if Aaron wants to apply for the customer success role, when they get to the form, we're going to make sure that they're able to select the right, uh, option. So we're going to work on that in a minute, but that we're not going to force the user to select it's going to be automated, but I just want to bring your attention to this, that this is actually going to be like a sticking point in a little bit.

All right, let's go back here. So we have, uh, done the candidate application form form to submit jobs I'm actually going to put time permitting. So this is the idea that, you know, we want to create a form that, uh, an administrator can also add new jobs to, uh, um, our job board. So I'll leave that at the end, cause there's a little bit of work to do there.

Uh, but it's just as easy as, you know, you add a form view here and an input the form. Okay. So now we are ready, right? So we've set up our air table. We have jobs, we have applicants. We can go start working in, um, air table. So let's go ahead and come into our web flow. Sorry. I said air table. I meant web flow.

So. This is our web flow page and I'm not going to do any design work. I really just want to show you the functionality and you can kind of make this page yours, however, best you please. So, um, we simply have a heading, says, we heard you wanted a job, and then I have a tab menu. And the reason I have a tab is I want to show you how you can embed a gallery.

And then a grip. Phew. Um, so super, super simple. What we're going to do is we're going to embed what we call a view in air table of view as a way to see your data. And we're going to embed that into our, uh, web flow, uh, website here too, or an HTML embed. Hey Adam. Good to see you again. Uh, you're kind of coming through here a little late, but just catching you up where, uh, we've done the air table, uh, view.

We're created the views and now we're going to embed them into flow. So what we want to show on this page is all of our available rows roles. Um, so what we're going to do is in air table, come here. It's a little confusing cause at the air table website and an air table. Uh, open. Here we go. So we're going to create a gallery.

A gallery view is just kind of a, a way to view your data. That's a little more interesting than row. So it puts it vertically and you can kind of look at it to it. And just like every view on air table, you can embed it. So we're going to embed this little bit snippet of code in there to Webflow. And this is what it's going to look like.

So we're going to have all of our available jobs that user can filter. And the reason I have a department is I want to be able to say, Hey, only show sales for that user, or, uh, you can have dates, you know, the most recent jobs. And also potentially what I thought was really cool you can do in the future is actually show the number of people who applied so you can apply to the least popular or the most part, however, confident you are.

So let's, we're going to take this embed code and simply go into web flow. Boom. And then we have embed just somewhere. I never know where things are in Webflow, so we're just going to copy paste that save and close. And if the magic of the web operates correctly, um, we have our job board. That's simple. So we have, uh, a job board where the user can, let me just publish this.

And then we'll kind of see in life, um, can look at all available jobs. Um, super, super simple. Give it a second to deploy while that's happening. I'm going to go the grid view. And we're going to just do the same sh uh, oh, you can't embed. I guess you could embed. There we go. Uh, we're just going to do the same thing in the grid view.

So to change views, you come here, active tap type to, I should name those, but I won't try to be more efficient. Use your time more wisely. Uh, w what's going on now? Oh yeah, I can move it. Okay, here we go. Seven close. And then this HTML embed. We're going to move it. Whoops.

Okay, here we go.

Okay, let's do this differently. I'm in grid two. There we go. Tough content to paint too.

Awesome. There we go. So, so this isn't, isn't as interesting because it's not as convenient for the user, but I wanted to show you anyways. So let's publish this. Um,

it's my wedding music, you know, it's kind of hard. All right, come here.

Don't want to translate. I don't know why it asked me to translate. That's weird. Okay. So we have our job board super simple user can kind of click through here and I'm looking at the job. So, so that's kind of, um, step one. Now we actually want the user to be able to. Right. So right now, as I've built this, um, there is no way for that user to get to this form, right.

From this kind of a job board. Right? So, so we need to find a way to do two things. The first thing we need to do is actually linked to the form. And then the second thing we need to do is make sure that when the user clicks on the form for the customer success role, right? So that form is for applicants that in this field, the job field, we have prefilled the role.

So that user knows the applicant knows that they're applying to the right job. So it's going to take a little bit of work, not too much. Um, so the first thing let's simply embed a link to, uh, this one. Right. So we can share form. We have a link let's come here. So job application form is going to be a URL, a link,

and no matter the role you're applying, theoretically, we should have this. So I'm going to go into gallery and then I'm going to filter customized cars. I'm not going to show, apply to this child, which is where we're going. So application form, there we go. So if I come here to all of the jobs, refresh this, not sure why it's asking me to translate this page gallery apply application form.

Boom. So it brings me to the air table experience. Now the challenge is that like, I might, maybe there's like eight customer success jobs or there's, you know, I don't remember what I want to apply for. I don't know if you want to hire someone who doesn't remember what they clicked on like 10 seconds ago, but still we want to make it as easy as possible for that user, um, to not have to fill in this field.

So we're going to use, um, a way to pre-fill, uh, fields on air table. Um, it's just, uh, a URL parameter. Um, so if I come here and I'm going to try to do this slide and go pre-filled pre-fill underscored job, or just let's do name, name, equal test. Oh, I have first name. Okay. Uh, let's see, email that way. It's one word.

I don't need to worry about that. Email and then,

um, that'd be cool to have to pre-fill. Oh, it's good. It's a sensitive here. There we go. Okay. So here at a pre-fill right, that tells air table that we're going to, pre-fill a field, then we have email and then you pre-fill with what you want. Right. So what we need to do is tell them pre-fill the variable job with customer success manager.

So how we're going to do that is we have that information. So the title of the role right here, Right. So we have this right here. So we're going to create a formula that is job link to application form. I'm just trying to make sure I'm not using the same name. It's going to be a formula. And that formula is essentially going to be this.

So I'm just going to say, this could be nothing for now. I'm going to go copy paste. This doesn't matter. Uh, okay. I'm just going to copy paste this. So what we want this to be is that, um,

We want that URL. Right? So that's the URL to our general form. That's going to be the case for every single one of the job applications. And then we want to add pre-fill underscore the variable is job, and then we want equal. And then we want to add customer success manager. So that's job title, right?

Save, uh, there's missing an end here. There we go. Refresh like that. It's just saying, okay, it's going to save who that worked. Okay. Now I'm going to tell you right away, this is not going to work. So if I click on this URL, it just says customer rank. Um, so it doesn't link to the right job. W, you know, I knew this, um, just making sure you're, you're still watching.

So essentially we need to actually make sure that it has spaces and spaces, how they work in URLs is that we need to add, you know, I think it's like percentage 24 instead of each space so that the URL understands that it's space. How are we going to do that? Is, um, there's a, there's a, there's a function.

Oops. I need to come here. That's called URL, encode URL component. Right. I feel really smart knowing this. Um, and what this does is just looks for weird characters and then replaces them with the URL text equivalent, if you will. Right. Um, so the formula is you have your, your, uh, application form. Right. So that's the same one for everyone.

Question mark pre-fill underscore the variable, which our cases job, and then you add in code URL component and the job title itself. Right. So that's what it's going to do is just replace percentages with the space. So let's go ahead and see what that looks like. Right? So we have percentage 20 instead of the space.

And then again, if we come here, the role is selected. Boom. Okay. So, you know, let's, let's get to the finish here. Um, I go back into my gallery view. I'm going to customize the card. I want to show the link to application form. Right? So last thing here, just going to refresh this,

go to gallery, come here. So we have our job title or department job description, and then link to applications. User clicks on this and they fill out, let's go ahead and just test this out. My name is Vera Chromebook. There we go. It doesn't matter. I'm just the best candidate ever. Okay. It's great. So there's also like a bunch of integrations, right?

So if you want to integrate, get a file from your Google drive. It's really great. You put my TV, I pulled that job is pre-filled. I select the customer success manager. Submit we come here, applicants. This is where my heart starts beating boom customer success manager. That's what we just filled out. Um, you talked about the count.

Um Marillo so if you want to show count do is we create a count field and we link it to applicants save. That's going to tell us the number of applicants, and then we can just go to a gallery. Uh, and then, you know, have feel 10. I'm just going to name that properly, a number of applicants.

And then last but not least, you can also have date of posts or, you know, first, uh, I guess job first posted date or job posts. I think that makes sense. And then that's just date created, create, create a time. We don't want to time field. There we go. And you could show this as well on the gallery like that.

Boom whoop customized card, date of job posts there. And then if I come here, so now it's defaulting to grid because that's how I deployed. I'm gonna change that in a second. So, boom, boom, boom links, application form number of applicants or two. Cause I've tested this twice and in date of job posts is there.

So that is part one. We're done part one. So this took me about 26 minutes. So I'm just going to, I'm going to mark that right here. 26 minutes. That way I'm going to kind of cut this up later. Cool. So that was part one. Um, yeah, let's get on to part two. So just one thing I do want to kind of change here. So if I come here and I deploy this like that,

and you just want to default to gallery view and not current view,

there we go. Okay. So we're good to go still here. I haven't lost you guys. I went faster. I'm trying to go faster so I can, I can, can kind of condense it. Um, Okay. So, so this is kind of like the MVP of a job board essentially. Um, what's not great about it. It's not obvious that the user can kind of have link here.

And then when you do click here, um, it punches you out to air table.com. Right. So that's not great. Um, so what we're going to do is kind of make it a, um, a little better. Um, and yeah, we want to do is control the whole experience. Um, what I mean by that is have most of everything happened directly in, uh, Webflow.

So two things we're going to do there. The first is we are going to first show all the jobs directly in. So instead of just using this air table experience, we're going to take this information, put it into web flow and then, you know, kind of add it here. So we're going to have each job posting is going to be in this kind of format.

Um, and then we're going to create a page that already kind of started. That looks like this for each role. And then we're going to add the form that the user has to fill out directly in this. So the user doesn't actually leave our experience ever. Um, I'm getting taken inspiration from the air table. So these are all, let me just leave this from the air table, job board itself.

So exact same format, title, quick description apply that brings you to that jobs application form. And there's a little bit more information.

I haven't applied marula. I saw that come through. So we're talking about the, the rich embed, um, Oh, sorry. The rich text format in, I imagine that's going to be directly in the rich text field. We actually hit some snags a little later with web flow and air table around that. So I'm curious to see how that goes.

I, I should just apply for the beta. I will. Thanks for the tip. Um, cool. So, so let's get started into actually, you know, owning the full experience with our job board. So, uh, job boards, that was part one. We are now at part two. So the first thing we need to do is actually kind of create our CMS. So what that means is create web flow CMS.

So we need a way to web flow to recognize our data. Essentially, what we're going to do is replicate most of this kind of air table directly in flow. So let's come here and just going to go into settings and it's quite, quite similar, right? So we have the name, that's a title. I should actually refer, oops, this is title,

uh, that slug that's going to be automatically created location. Just reminder, same thing here. Location department one-to-one match, job description, qualifications, embed form URL. That's going to be this right here. Look to application form, uh, number of applicants, I guess we could pass it through, uh, that would require quite a bit of work on Xavier.

Not quite a bit. This is one's app, but it won't be doing it. And then date of job posts. Um, that's also in automatically created in a web flow. When, um, you create a new CMS item, it's going to give you a creation date. So, uh, let's save this and I want to maybe just do one manually. So we're going to copy like customer success manager

and then location would be San Francisco department. It's going to be customer success, job description. Let's just copy paste. This. We're going to automate this later qualifications. There we go. And then embed form URL, same thing, linked to application form. Great. So we're going to create that. Okay. And could we duplicate this?

Is that allowed? No, they don't have a duplication. Okay. So I'll create a second one. Apologies. I want it to do this live. Let's create the second one account executive in New York account is that kid of New York that's going to be in sale. Got your face, this, and then copy and paste that embed form URL.

There we go. That's great. Okay. So now we have two roles. Um, and what we want to do is show those two roles here. Exactly like air table does right here. So one and then two, and then have a button that says, apply that links to a CMS page where that user can apply for that role. So this is going to be quite easy.

We're just going to create a collection list. Let's just put it here. I'm going to put it into the section here too, like that. All right. And then let's move this over. Okay. So this allows us to list all of the items in a specific collection. So we're going to connect, collect, connect our jobs, uh, CMS, right?

Collection dances, collection items, connections, really mixing me up. So, and then all we have to do is kind of take this whole job post, put it into here, and then it's just duplicating it because it's two of them. And then we just say, Hey, this heading, heading on top, get text from jobs. That's going to be the title account executive customer success manager.

This is going to be the location location. Boom. This is going to be the. I think we have, uh, uh, us as a paragraph department and bedroom location. That's weird. Why don't I have,

let me check something. I think I put a rich text field, not, there's always one thing I got to debug during these things, so let's go into settings. Okay. So these are rich text fields and those at paragraphs, uh, let's put the mens rich text fits. So I'm going to come back here, all jobs. And then here instead, we're going to do a rich text field.

And then we're going to remove this paragraph. And then rich text field is going to get its information from job description. Boom done. Then, and here, this is going to be a link and it's going to be to a link to the CMS page of that job, where the user can see more information and then fill out their application.

Okay. I think we're done like that is essentially what we wanted to do. Um, I think I'm missing. Okay. I just need to put all of this into job posts, make it, there we go. Okay. So we have kind of similar to this right here, title, location, a little bit of texts and. So we've gone ahead and recreated that. So that's pretty cool.

Right. And step one and then step. So again, I'm not doing design, that's not my forte. You guys can figure that out. Um, okay. So let's now, so now we've created all of our job, like a list of all of our jobs. So we're recreating this. If I copy pasted all of those jobs into our CMS, I would have the exact same information here as here in the list.

So we're going to go ahead and now work on each jobs page, how we do that is by going into. The jobs template. Now I've already done some work here around, um, just structuring this page. So what I've done is title. They're not linked yet, but I've gone ahead and made the page, at least applying those weird apply now, uh, which when clicked will bring you to the form which we'll do here.

Um, some text, this is texts. That's always going to be the same. Uh, I just took the pretty much the same text that was here. Right. And it's weird. Cause air table, you know, links to Greenhills. Us. We're actually using air table. I would expect air table to use air table, but that's just me. Maybe they've got hundreds of applications.

Um, so we're gonna go ahead and recreate this top page. And then here, we're going to use the same form that we already created to embed, and that's going to be, uh, um, that's going to be, uh, our page. Um, we're a little asks, do we have to do this manually or we're going to create an automated way so that each new job posting is sent into the CMS.

This is one of those moments where you asked me what I'm about to do in two minutes. So that's great. So I've, you know, um, kind of a few steps ahead of you. So at the end, we're going to integrate Xavier and web flow, right? So we've created the workflow, CMS, upcoming pages, and we're now working on the specific job page.

And that is that step right here. That's where we're going to be doing in, um, you know, five, seven minute. Cool. So specific job page. Let's just, you know, as we did before, we're going to link all of this title, customer success manager, location, location. I'm going to do this in a second. The apply now button.

Um, this is just standard text. Um,

is it? Oh no. So this has to be okay, so this is another situation. Oh, we have a rich checkbook. There we go. Okay. So we're going to go, I get texts from jobs. Same as we did before job description. Right. And we're going to add another rich title it's block,

which is qualifications. And then I'm just gonna maybe add a title here. Uh, heading let's do your qualifications because there's no heading

awesome. Uh, let's put it heading for, there you go. Okay. So this is just some warm rip. Some of you would have some, you know, description about your company, the qualifications, this like, you know, static description about what you offer candidates and about your company. Pretty simple stuff. So again, we're just trying to recreate this.

I'm going to spare you all of the texts, and if you want it to view all jobs, you just create a URL back to the old page. Read the page with all of the jobs that's relatively simple apply. Now we'll do in a minute. Now we get to this, right? So we, we want to do is embed the form directly on the page. So the user can kind of fill out their application directly on the page and then it's going to be sent to their table.

So go ahead and do that. So what we're here to do, so we're going to create embed an embed, embed embedded, but where are you embed? There we go. Okay. Oops. I need to go get so coming, like thinking back to what we did before, we're just gonna in bed. Same thing we did before then we want to applicants. No, we got to go to the form view.

Now, remember, there's a difference between embedding. The F the form, the form view and what we did before, which is just pre linking to the form on air table, but the logic will be extremely simple, similar. So remember what we embedded before was the gallery view. In each record, we had a link to the form view of air table.

Now we're embedding the form itself into our page for each job. So a share form. We're going to embed this form on our site. Similarly, we're going to copy paste this, come here. I'm going to do that. Save and close. So this is our form. Uh, let me just publish this.

Yeah, I'll take this moment to, like, what's going to happen here is that we're not going to have a. That job pre-selection is not going to be there. Right. So that's unfortunate. So let's, let's just see what this looks like. So we have our customer SKUs manager, some information, and then we have the job board.

If you want this to be a little, like, you can make this much larger, much higher, so you don't have this little tug, like, um, scroll. So first name, last name, all that good information. But then we have job, right. And again, we want to avoid having the user to select this role. So what we need to do is kind of find a way to pre-fill this information in the embed.

Right? So, um, how do we do that? Similarly, as we did before, right? We had this variable. So like, let's, let's just take a minute to think about this. So let's look at the embed code. Um, jobs. No, here it's uh, here we go. So we have this kind of URL. And when you look at it, it says air table slash embed slash you know, random stuff.

But if we look at that random stuff, it's the same thing we have here. So it's the only difference between this and the embed URL for the form. This is a link to the form reminder and embedding is that there's slash embed between air, table.com. Right? So that's just an I-frame functionality. So, um, what we're hoping to do is use this exact link, right.

But instead of this link, we're just going to add a little embed, right? And this is information we're going to have to send to, um, The CMS in Webflow. So we're going to create a new field that is embed URL

and it's same kind of thought process we had before. Right. So I'm actually, before I, I'm going to cancel this, I'm just going to copy paste this right here.

Right. And then go to a job board. I think, as I do this, it'll make a little more sense. Right. So, so we want the embed URL just as we did before. And then we want question mark pre-filled equal. Uh, so pre-filled job, right? That's a variable warning. Pre-filled. And just as we Don, we need Incode URL component and it's going to be job title, right.

Save that. What was the pro there's missing? And here that's stressful. Okay. So this is going to be embed URL, and this is what we're going to kind of pass in the embed code, so that we're always pre-filling the right role. So let's just, let's just add a new version jobs settings. We already have an embed form URL.

Okay, great. I had already thought of this preparation gotta be, expect the unexpected. So let me just go into customer success manager. That's what I posted. Embed form URL. It's a little worrying that it's not the same as what I had before. Okay. No, it's fine. Oh, that's we're in the account executive, so I'm to account.

So that change, come here. There we go. We're going to say this and then go to that page. And now that we have the embed form URL, um, here, so maybe I'll, I'll kind of explain it this way. So we have the embed form URL. And what I want to do is here. You pre-fill underscore it. Let's just test it. And this is for customer success managers.

So let me go ahead and if I remember I have it right here,

it's going to take the end here and see if that works properly. Right. So just, just gonna copy paste that. So what we've done is we've taken the embed URL. We've done the same thing we did before. Pre-fill one of the fields save and close. Let's do we need to publish? Yeah, I think we need to publish just to scroll down to there.

Okay. Refresh. So we should pre-fill. Customer success manager. Right. So that's what we wanted to do. I don't know if in the chat, like, did that make sense or did I lose you guys? So essentially we did what we did before, but in the embed functionality, it's just a different URL. Um, so yeah, so we go there and then, so now that we know that it works, let's actually create a variable here.

Oops. So what that means is instead of just testing it with a specific URL, we always want it to take it from the CMS. Dammit. There's no good way of doing this. Uh, scroll, scroll, scroll. Okay. So let's just carefully select this. Oh, no, remove that. And then that's going to come from. Embed form URL. Let's save and close.

See if it works correctly and it should work for both customer success manager and account executive. If all goes well. Okay. Let's refresh that

or success manager. And then if we go into account executive

fingers crossed, oh, that did not work. Oh. Cause I don't have an embed URL there. That's why then was why

stressful? Uh, let's go here embed to the account executive and it's this right here.

Then we go publish. Make sure it works.

Okay. Account executive. Okay, good. So we have a specific job page. The only thing left to do is just this apply now. And what we're going to do is we're going to create, uh, uh, just a form ID. And then this link is going to go to form simple as that. That's just in page linking. If you want to skip the information about the role,

when a reload and then if all goes well, whoop, there we go. And I come to the form and we're done for our specific pages. We have one thing left to do. Which is integrate zip here in Webflow. What I should actually say is send new job postings to in, from air table to upflow with savior that's, that's actually what we're doing here.

So, um, Xavier, I say this every week, I feel like butt is glue for all of your applications. So we have data in air table that we want to send to web flow. Um, so essentially that's what we're going to do. Uh, we're going to, um, Xavier will do that for us. The trigger Xavier, how it works. I shouldn't just go into Zapier and there we go.

You have a trigger, something that happens in one of your applications and then an action. So that means that, you know, something that happens in another application. So the trigger in our case is going to be new job posting new record in air table. And then our  is going to be fill information in web flow in this case.

So create a new CMS item with the job that was just created in. Uh, so we're always going to be working, you know, I'm a administrator, I'm going to be creating my jobs in air table and an Xavier is going to handle sending it to flow. So let's go ahead and do that. So our trigger is air table boom, to trigger vent, new record continue.

So they just redid this interface is quite, that's quite good. This used to be on the left here. Um, personal air table. That is mine base is going to be, I think, was jobs, job board. So I'm just, I'm just kind of going through the motions here, uh, table jobs. So every time we create a new record in the jobs sport test and review, it's going to go get some data.

Let's see which one let's actually use. One that we haven't sent through, which is sales manager. So let's try to find sales manager, HR manager. Oh, wait. We haven't sent HR manager either. So let's just use that one. So we're going to, it's pulled the information from HR manager. So this information here, so all of this information is now in Zapier.

So we're going to use that one. And then what do we want to do we want to, uh, create, create, live on I'm actually. So yeah, I want to create a live item because that way I don't need to publish the website, but what I am going to do before. This was last week's problem. And I'm going to publish to production that way.

Production knows about the CMS collection. Okay. Webflow create live item. Boom. What float counter is ATT automate all the things continue. Website. I only have one website.

Yep. That one collection jobs.

Okay. So what it does is it goes and talks to Webflow and says, Hey, you know, what's in jobs. What information do you need location? Now we already have information from air T. Well, we're just gonna send it through. Right. So location that's in step one, that's getting the record and location locations called location.

So San Francisco department. Uh, is HR job description is job description, uh, description of job description. There we go. Now I'm a little worried about this formatting. We're going to see if that works, not, um, in the case where it doesn't work. Um, it's not, yeah, that much work to have a kind of like sub CMS, I guess, where you have all the descriptions.

So you don't have that many different roles, so you can just put them once into web flow. Um, so we'll see, I haven't tested with, um, I'm kind of fearful that it is going to be poorly formatted though. Um, embed form URL. That is the embed URL. There we go. Title is title. There we go. Slug is going to be created.

Archived is no draft. Isn't it. Continue. Okay. So let's test and review a test item was sent to workflow. So that means if we go into workflow right here, we are now have a third item, which is HR manager. Oh. And the format you made it. Yes. Go the web. That's awesome. That's really, really cool. Um, so yeah, and that sends it to, um, it, it does what we expect it to do.

So we, you know, it took data from air table and send it to workflow. Uh, so you know, if we go to this oh, no, sorry. The CMS jobs template. And then we select HR manager and then we go to production. We have our, oh, the formatting didn't make it. Oh, that's weird. That's okay. That's too bad. I'll check into why, because it does work properly into web flow.

Um, but the rest works, right. HR manager as expected. I'll link it to why this doesn't work. That's kind of weird. Um, so it creates our page. That's what we expect. So I'm just going to do one last thing. I'm actually going to test it in production if you will. So we're going to make this life done. Editing.

Turn that on. We're going to give it a name, I guess I gotta go to name.

Uh, okay, that's fine. Uh, so let's just, I'm gonna read the beginning. You asked to create a form, so let's go ahead and do that. And this we can remove, we don't need that anymore. This is automatically created as well. Department. Yeah, that should all work. Okay. So let's open the foremost, fill it out. So this is a form for a new job that an HR administrator would do.

So let's create a new customer success manager role instead of San Francisco. This one's going to be in New York. The department is customer success. This is the second customer success job. You need a lot of qualifications. Okay. So if we submit that quote, my mouse is kind of going crazy. Sorry, sorry.

Sorry. There we go. Okay. So we should see it here. I see it in many places.

There we go. So we see our customer success job. Right? We should see it in the embed. Just kind of going through the motions here. If I go to here, we should see it right here, which we do. And then I need to, I think I need to manually go run the zap. Um, this one's in yeah, run. Cause it runs every 15 minutes.

Uh, so I'm, I'm just triggering it. So it runs right away. And then we go into web flow. I should have a fourth job. Oops. It's not yet arrived. Create live item was successful. Okay.

Let me refresh this.

I might have no unique name. Nope, we're good.

There we go. So it created this. Oh, it just, it, uh, workflow thinks about it. Nice. I gave me a little nine here, so if we go here and then we go to our jobs template, customer success manager, and this one should be in production. Boom. So we have as expected what we need. So that was, um, essentially what I wanted to show you today.

So we did two things. Let me just kind of check some boxes here and send new job posting. Um, so we did two things. We did the MVP version. The MVP version was embedding. Gallery and grid view into what flow from air table. Okay. And then we did the kind of, a little more complicated where we created a CMS collection where we list out each role.

And then, uh, we embedded a form in the CMS page collection page for that specific role, um, via  people in embed as well. So we're just hitting the hour here. So, thanks. Um, thanks for watching. Let me know if you have any feedback. Um, I also write a weekly newsletter, uh, talking about automation. So subscribe to that and I'll be back here next Wednesday.

Um, yeah. So thanks. Thanks so much. Have a good and have a great week. Let me know. Just bye.

Key takeaways

Similar streams

Oh no! No videos within this category were found.