AI Landing Pages: From Project Plan to Published Page

Hi, I'm Kia Kelley. I teach TikTok marketing and I'm here at Social Media Marketing World. So I have loved being a speaker at Social Media Marketing World the last 5 years. My favorite conference because not only do you get to speak or whatever, but you get to learn so much and be connected with all your peers in the social media space. So one of the things I love about Social Media Marketing World is everybody here is intentionally friendly. Like everyone, it doesn't matter how many followers you got, whether you are new or you've been around for a while, everybody is connecting with everyone. Like everybody is just normal and like people want to connect, they wanna talk to you, they wanna just hang, and it just feels like a really safe space for everybody, whether you're new on social media or you've been around for a while. This year for me has been like my absolute favorite because not only could I learn all about social media, but I was able to come in this space and learn about AI and how I can apply it to my business. So if you're thinking about coming to Social Media Marketing World, you definitely should.

Get tickets at socialmediamarketingworld.info.

Welcome to the AI Explored podcast, helping you put AI to work. And now, now, now, here's your host, Michael Stelzner.

Hello, hello, hello. Thank you so much for joining me for the AI Explored podcast brought to you by Social Media Examiner. I'm your host, Michael Stelzner, and this is the podcast for marketers, creators, and business owners who wanna know how to put AI to work. Today we'll explore creating landing pages from plan to published with AI. My special guest is an AI strategist who helps marketers with AI and marketing automation. He hosts the AI Driven Marketer podcast. He's returning to Social Media Marketing World and AI Business World 2027. Dan Sanchez, welcome back to the show. How you doing?

It's always good to be back. I enjoy being on the show.

Super awesome to have you, bro. I'm so excited at what we're going to talk about today. We're here really to talk about how to actually have AI create really awesome landing pages. And we're going to get into kind of all the stuff, but literally from soup to nuts, okay, to create more persuasive whatever it is you're trying to achieve, whether it be lead generation, sales, all that fun stuff. Now, before we get started, what's one of the biggest misconceptions that you see out there when it comes to AI and marketing right now?

Now, I've been thinking about this a lot, Mike. And I think the biggest misconception that I'm running into right now with marketers is that productivity means progress. But that's Not always true. We're all using AI now, and some of us like it a little bit more, some of us like it a little bit less, but come on, like most marketers— I saw in your last AI marketing report that most marketers are using AI now. It's standard. Most of us are using multiple AIs. But what I found over and over again is that people are crushing it. Productivity's through the roof, but it doesn't always mean that we are getting all the revenue we want or that we're moving the right things forward. So that's kind of the big misconception that I'm hitting all the time is that productivity means progress, but it doesn't always mean progress.

Well, you're speaking to my soul here, brother, because like, I think you and I are cut from a similar cloth. We feel really good when we make things, you know what I mean? But sometimes that's not enough, right? Because just making things alone is not really what marketing is all about. Marketing is, yes, it's got a creative process, but marketing also has a process where you need to actually be accountable to somebody for results, right? And I'm with you that like progress alone is not good enough because there's always room for improvement, right? Can you relate to that? Like, like I find always like opportunities to improve and sometimes you just gotta ship it. What do you, what do you say to that?

I just think people get excited about all the new productivity and they chase down all the shiny ideas and man, there's so many shiny things. And I don't know about you, but I can go on long walks and just talk to ChatGPT and dictate and be like, oh, what about this? Oh, what about this? What about this? And we flesh out all kinds of ideas that I'm like, you know, that's none of those are going to move the ball forward that we actually, it's not going to keep us from the work that's actually slowing down growth. But that's why I'm excited to talk about landing pages. Cause I think that's one of the key things that I think actually holds back growth, like substantially.

Love it. Okay. So when AI and landing page creation, for lack of better words, is done well, what is waiting for us on the other side? What is the upside? What are the perks, the benefits to marketers who pay close attention to what we're about to talk about today?

So if you're like, your company's always in one of 3 places. You're either growing and you're trying to like struggle with the growth, uh, you're plateaued and you're trying to figure out how to break that plateau, or you're in, you're in the downswing, right? And you're trying to figure out how to reverse that sucker. I find with all 3 things, it's always about how to find the right idea to fix the problems, right? And oftentimes in marketing, the thing that we need to spend more time figuring out is what's the idea that's going to unlock growth? So especially when you're plateaued or you're shrinking, you're trying to figure out like, what's the packaging? What's the offer? Is there a new message that we need to figure out that's going to unlock growth for us? Is there a new one-two punch as far as the offer? Like we offer this on the front end, back end. Do we need to restructure pricing? All these questions. We don't know the answers to them. The only thing we can do is test them. I don't know about you, Mike, but like we live in a digital age. We're not testing with printed brochures. We haven't been doing that in a long time. We don't run split tests in magazines. We run them all digitally, and almost always it's on the back of a landing page. I mean, maybe you can test and do a little poll on social media, but we all know that like that was only, you know, people vote with, uh, with either subscribing with their emails or with actually making a small purchase of some kind, which means you need that landing page in order to test ideas. And I found multiple times, whether I'm working full-time for an employer, even running my own shop, Like I can only go as fast as I'm able to set up the landing page in order to send out a new offer. I could send out an email or if they shoot, Claude, write me a good little email copy based on what I give it to talk about. And we refine it and make it sound less AI and all that kind of stuff. That's not too bad. But then you got to send the offer to a landing page where you can actually flesh it out and see how people react to it. But it always took me so long to get it done. I know how to do HTML and CSS. I'm actually a graphic designer by trade that got into marketing. I was really good at those drag-and-drop builders. I'm a master at WordPress. Yet it still would take me 4, 5, 6, 8 hours, sometimes 2 days to set up a landing page and everything else you need with the landing page. But with AI, man, you can get it done so easy. And it's honestly better than anything I could have designed before. And I was a pretty good website designer. So now you can just fly with testing ideas and get feedback faster. And I think that's a big

I love that, and I'm on board with that. And I think what I'm hearing you say is, hey, everybody, if you pay attention to this, you now can go from idea to full execution of actually building such a thing very, very quickly, where in the past you had to go to someone like Dan who knew how to do HTML, or you had to hire an expert to be able to build these things out. But now you can go from actually creating incredible copy copy to incredible layout to even graphics and ultimately to possible multiple variations that you can test. And this can all be done with one person and the right tools. And that's what I'm really excited about and what we're going to explore today. So is there anything that we need to consider before we start creating landing pages with AI? Because there's going to be people in my audience that have never even done a landing page before. So like, what are some of the basics we should be talking about?

You needed quite a few things kind of thought out, but roughly, just roughly, you kind of need your general— like, what are you testing? Like, what's your offer? What do you want them to do on the landing page, right? What's, what's the goal, right? And that's, that's usually pretty self-evident. I'm using landing pages in order to test an idea you have. Maybe it's a new package, different price. Maybe it's a new lead magnet because you know you need more leads to get your sales team or just to nurture them before you can get to the offer. There's all kinds of places where you need to find the thing that's holding back growth. So you need to have the main problem you're solving and the offer to solve it with. Then you need to know like, okay, what do I need on this landing page? You're probably gonna need some copy. You're a copywriter. So like you probably know some of your favorite copywriting frameworks that you would all have. I like a stack of copywriting frameworks that I like to go to, um, using the PASS framework or whatever frameworks you want to use for copywriting. If you don't know what they are, just ask chat and it'll tell you what to use and you can probably generate some copy ahead of time. Then you need a general flow. Okay. Like what's, We gotta have the landing page, but what do you need on the form? What do you need to get from them? Is it a multi-stage form? Just one form? Just an email? A purchase? What are you gonna do on the thank you page? Shoot, that's where a lot of marketers leave money on the table because they're at their most excited point after they've gotten through whatever you've asked them to do. You might need to put another offer there. Maybe an upsell, maybe a downsell. Maybe you just want them to fill out a survey so you can capture more information on the way into their email list. All kinds of different variations you can do there. And there might be a couple more pages after that if you're asking them for more things. And then you have to think like, well, Are we just having them fill out a landing page or are we going to follow up with them? Well, we need to think about that ahead of time too. Like if they fill out the landing page, are you going to have a little automated sequence, even a little 3-part email sequence? What if they don't do the next thing you want them to do? You know, uh, what are you going to do then? What if it's a multi-stage funnel sequence? You know, you might have multiple email sequences to get them wherever they drop off. You can see how it becomes more than just a landing page. It could— it's, it's a whole campaign, which is why these things took us so long to do. I mean, imagine assigning A 3-part landing page sequence, a funnel to your team with 2 different automated follow-up sequences depending on where they fall off in the sequence. How long do you think that would have taken them? A couple of weeks?

I mean, it's a huge thing. And like, as a guy who's a copywriter, normally when I think of a landing page, I'm thinking about the copy that goes on the landing page. But what I love about what you have identified here is you've got the page itself, okay, which is going to have some text on it and maybe some images on it. And then you either have a purchase or a form. And if we're talking about freebies, that form is really important, right? And then after they've completed whatever the step or transaction is, that thank you page— I totally wouldn't have even thought of that. And then what happens afterwards? The whole email sequence. So what I'm hearing you say is we can map this whole thing out now, and that's what I'm really excited about. So like, where do we start? What's the obvious first step we do next?

So before you dive into a tool like Codex or Claude Code, you want to brainstorm all this stuff with ChatGPT or Claude on the chat side, you know, not the code side, but the chat side before we're building out any of this, at least on ChatGPT. I don't know if this is true for Claude, because, you know, I'm a ChatGPT guy. And now, you know, with Astra coming out, I'm finally being rewarded for staying true to my tool. I was left in the dust for a while there. But one of the cool things about ChatGPT is it gives you 2 sets of credits. There's a Codex credit or ChatGPT Work. So it's ChatGPT Work and Codex. And there's a whole nother credit system that's just chat. So it's really easy if you're spinning up multiple agents and stuff to burn through that Codex budget real fast. We want to save that. So even OpenAI will recommend run all your brainstorming and all your planning process on the chat side first. I just do it in the web app. You can toggle over in the Mac app or the Windows app over to chat side. They do the same thing. I usually do it in the web app and I'll brainstorm the whole thing and I'll give it the requirements. This is the offer. Here's the thing that I wanna test. I wanna have this on the landing page with this copywriting framework, this on the thank you page and this form here, this form there. I need a 3-part email sequence to follow up with this offer. And if they don't do this, they do that, you know? So like you just kind of word vomit what you want on there, like a general rough plan. You have it in your head or maybe you put it down on pen and paper and you just kind of give chat the requirements. You tell it to build a document. It's really good at building docs now, right there in chat, even without work turned on. It'll build a doc, you read it over, maybe go back and forth a few times until you have the plan, essentially the requirements. If you've ever studied project management, you know of like work scopes, like what is the general scope of what you want done? If you were going to hand this project over to a freelancer, which is what we're going to do with Codex in a sec, you need the general scope of what you need done when and where, right? And that's what you and ChatGPT are going to come up together is the scope of work for this landing page, the thank you page, the forms. The email sequences, all that kind of stuff. Just an outline, pretty basic, but you need to have this document ready in order to make the most of the next step.

Yeah, so let's talk about this a little bit. You already hinted about Astra. For folks that don't know, as of this recording, Astra is the latest, most successful model. I think it's ChatGPT-6, is that right? And when we were prepping, you said, hey, Astra's really good at this. So help everybody understand what they should ask Astra to do to help create such a plan? And you've already, I think, done this. So like, just what's the, where do we start with if we're gonna, like, I've not even tried Astra yet. So if I were to go to Astra, what am I, what exactly am I gonna ask it?

Okay, so in order to use Astra, it's not available on the chat side taking up, you know, our brainstorming credits and all that kind of stuff. You have to switch over to either ChatGPT Work or Codex in the app.

And ChatGPT Work is the easiest one, right? Because it's just right there with a click, right?

It's just right there. It's just a little toggle on the top of the screen. You flip over to Chat Work. I don't recommend doing that. Chatwork is useful for some things if you're, especially if you're on your mobile phone and on the go and you want it to be a little bit more agentic.

What about for this project plan?

For this, I do it all on Codex, which is the ChatGPT Mac app. You just switch it over to code mode, which is Codex, and 'cause we're gonna be coding landing pages, so you might as well have Codex do it.

Okay, so this is important, folks. I would imagine it's available for Windows as well, but you have to download the chat app. And when you're in the chat app, which there's a function that says Codex, so you switch over there, you choose Astra, and then what do you do? Like, just talk us through how do you get it to write the project plan?

Yep. When you're over in Codex, Codex works in project folders, just like Claude Code does. So if you're familiar with Claude Code, Codex does it the same way. You create a project folder, you start working in that folder. The difference between ChatGPT is the folders, the project folders in ChatGPT are web-based. The Codex ones are based locally on your computer. So every folder and all the stuff that goes into that folder is going to be sitting there right on your folder, usually in a document in your documents folder somewhere if you're on a Mac. I don't know where it stores it as a Windows file, but it's somewhere locally on your machine. And that's the power of it, is that it can use your computer to get stuff done too. But you set up a folder, it creates a folder there locally, and then you start a conversation within that folder. Generally, if you're building a landing page and you're just getting started, And there's a couple steps to this, but then you give it the document, you know, the, the work, the scope of work, you give it to 'em and be like, hey, let's build this.

Let's back up a little bit. So I wanna reiterate this scope of work or project plan because, um, I think when we were prepping you said, hey, you can simply ask Astra to help you write such a plan. So what do we, if we want to do that, what are we exactly asking? Do you understand what I'm asking?

Yes. I generally like to have Chat write the plan and then give it to Astra to actually execute.

Oh, okay. All right, then let's get back to chat for a second here. And let's say we're in chat. Does it matter which model we're using in chat? And if so, are we asking to interview us? Like, I just want to, I want to zoom in on this project plan a little bit before we go into actually building it.

Yes. As it is with most working with most AI on most projects, having it ask us questions beforehand can be really helpful, especially if you build the scope of work. You'd be like, hey, what's, what's missing from this? And it'll be like, well, it'll, you know, say, ask me some questions to get more clear. It'll ask you questions, you answer them, it'll build a better scope of work. And then generally, like, if you gave it the rough outline, it's going to deliver what you want here. Now, you might find in the build phase that there's some things you didn't know you wanted and you go back and add it later. But generally, once you have the scope of work done, that'll be enough in order to get this project started. And then again, I don't use Astra over on ChatGPT. It's not available. It's, you just give it a reasoning level and then call it good. It's not until you move over to Codex that you have access to Astra at ChatGPT-6. You have more granular nuance in what chat, what model you use, what reasoning level you give it. That's over on the Codex side.

Okay. What about the visual stuff and what about where to grab context? And I think we were talking about some sort of delegate skill. So there was some stuff here that I think we're, we still need to talk about a little bit.

I like to build all this locally before pushing it out to someplace like to host like Vercel, which we'll talk about in a minute. This is actually an idea you gave me and it's something I hadn't been considered. I had considered split testing or creating multiple versions of the Copy, but this is an idea I got from you. I actually started implementing it right away and it's been fantastic. Having to give me multiple versions of the design first. So like, hey, just start with the landing page portion and give me 3 different versions of what this can look like in HTML. Just show me what the design can look like with the copy in it. I always specify I like it to do the design and the copywriting work in the same pass because the copy can influence the design and the design can influence the copy in a really important way. And that's something as someone with a design background, I found I did all the time as a marketer. I was always trying to giving my copy the layout ahead of time before I, not maybe not the full design details, but I always did both at the same time. So I like it to think through it both at the same time. And then it gives me the 3 different versions. I pick one and then have it go ahead and execute the rest of the project. Now delegation is a more advanced skill, but I honestly think it's really easy. I built a skill. And it wasn't hard to build the skill because Astra can burn through tokens really fast. It is an expensive model. Even if you're using Astra Lite, it's quite expensive. Just like Fable is on the Claude side. Like it's less expensive than Fable, but you know, it still burns through credits pretty fast. But not all the tasks on that project plan require the level of power that Astra has. So what I did just one time, I went to chat on the research side again, over in the Mac app. And I said, hey, I want to build a skill for Codex so I can assign it to Astra to be able to delegate to Terra, 2 models down, and Luna, a model down farther still. I want you to do research on what Astra is good at, what Terra would be good at, and what Luna would be good at, and then build a skill so that when I say delegate, it knows what to delegate and what to keep for itself and how to move the whole project forward as a project manager.

Oh, so this is fascinating. Keep going. So like, how does this, how do you deploy something like this?

So once ChatGPT built the file, which is just an MD file, it gave me the file. I downloaded it, uploaded it to Codex and said, hey, I want to install this Codex skill. It's like, yeah, sure, can do that for you. Hey, just take this, gave me the line, put this in your terminal, which is a little program. Just open up terminal, research terminal on your Mac and open it up. It gave me the command lines in order to install the skill because the skill file lives outside of the folder it had permissions in, but I didn't want to give Codex more access to any files outside of that folder, because I don't want it to run my whole computer, just the project in that folder. So I had to install it via the terminal, but again, it just literally gave me the script to put, copy, paste it in the terminal, skill installed. And now every time I hit $delegate, it's following those instructions that chat created about how to delegate and what to delegate to Terra and Luna every time I do this with Astra.

So does this mean that— okay, and I'm just going to back up the train for those of you that might not be tracking completely. We're starting with chat, regular good old-fashioned ChatGPT, whatever model, to develop the initial project plan. Then we're going to install Codex, right? Which is a ChatGPT thing that runs through an app. It's going to create a folder on our computer, and we're going to ask it to go ahead and execute on basically the creation of The plan, the copy, the design. It's capable of doing all of this stuff out of the box. By the way, is it pretty good at visual design? Because I know that ChatGPT is really good at images, but layout I'm not as familiar with. I'm more of a Claude design guy. But do you find that the layout skills are pretty sophisticated?

Yes. Yeah. All the Frontier models are great at web design, have been for a while. I've been pretty impressed with their web design ability for about a year now, and they continue to get better.

Got it. And then when you call on this delegate skill, it will decide which version of ChatGPT to use given what you're about to ask it to do. Is that right? So it'll flip over to a cheaper model before it does what it— and I would imagine you could create this kind of skill for Claude and do the exact same thing.

Oh yeah. You could just drag and drop the same skill into Claude and be like, hey, convert this to a Claude skill, which is literally just changing the name of the file and 2 other lines in the file and then it'll do it. Yeah.

Hi, my name is Rachel Milliken. This is my 3rd year at Social Media Marketing World, and there is a very distinct reason why I keep coming back, and that's because of the amazing speakers that are here. Everyone talks about networking and the connections, and honestly, it's fantastic, but the speakers, they know what they're talking about. And even if you think you know everything about AI, I promise you don't. You're gonna learn something new here. Just like I did. I keep telling my clients I will never stop learning, and that's because I come to Social Media Marketing World.

Get tickets at socialmediamarketingworld.info. We're going to get into some more technical stuff here and then we're going to talk about how to build the whole darn thing. But so far what we've got is we've got Chat coming up with the plan and we've got ChatGPT Codex, which is actually going to be building the entire thing. But we're going to talk soup to nuts, right? So we're going to talk about like, where does this information live? I think that's the next part. And then how do we connect all the dots together? And then we'll actually go through the process of doing it all. So let's keep moving along. Like, where do we put all this information? Because this, Dan, this is one of the big challenges is that if you're creating, for lack of better words, a page and it's not inside of a content management system like WordPress, how in the world do you update it? And where do you keep all that information, right? So let's talk about that side of it as well.

So a few different options. First, the first place it's gonna live is just locally on your computer, which is great 'cause even Kodak has a place where you can preview it and Cloud Code has the same thing where you could preview it right in the editor. It's got a little preview, opens up a browser and it's like, hey, here's your site. You're like, great. And after you, you make your edits to it, cause you're like, oh, let's move this here, move that there. Everyone's got feedback for it. It's great. And it'll write the emails for the email sequence and it'll have little MD files for that. And it'll all be there. You can review it, make updates to it. It's like, okay, let's, let's imagine we've moved past that. We have everything we need. How do I make it live? Now there's a few different options. There's an easy option. You can host it with ChatGPT itself. There's something called ChatGPT Sites, which if you have a Plus plan is just part of your package already.

That's the, is that the $20 a month?

Yeah, that's $20 a month plan.

Okay.

You can actually host static HTML websites

really

for free. Yeah. It's wonderful. Like I'm moving, I'm helping friends set up their first websites or migrating off of Square all the time because people are just using Square all the time. You know, for just basic websites. I'm like, you can host this on your preexisting ChatGPT account. They can? I'm like, yeah, here, let me, I'll have Codex rip off the site, rebuild it in HTML, and I'll just upload it to chat for them. And you can even hook up a premium domain. So it's really cool. Now you can't, in just a static HTML site, you can't do things like forms or anything dynamic, of course. But you know, if you have a MailChimp account and it has like an email signup feature, and has an ability to send it to another page, then you can, because you can just specify what the thank you page is. MailChimp, they fill out the form at the bottom of the thank you page that you embed. Again, you just give the form code to chat and it'll plug it in there. And then it loads up the thank you page. Right. So you can get away with just using ChatGPT sites for quite a bit. And if you're on a budget and you don't want to do this next step, and it's not expensive, but you know, if you're a solopreneur or freelancer out there and you're trying to pinch the penny, then that's, that option works great. Now, if you want to level up and really like take the training wheels off, then we're using a combination of, it's still local on ChatGPT on your computer using GitHub, which is like a code repository. Sounds fancy. It's not, it's not too big of a deal if you're just using it by yourself.

It's like a Google Drive folder, really, right?

And then we're using Vercel to really host and deploy the site out to the world. Okay. Like a web host.

Yeah. Tell us about Vercel. I know that you're a big fan of it and you private messaged me and said, you need Vercel. So tell me about it.

Yeah, I've, I've switched over everything to Vercel. I used to have everything on WordPress and WordPress hosting and all that kind of stuff. And I've been a WordPress guy for years, man, decades, just a long time. And I finally just done. I'm tired of all the website things. I'm tired of landing pages. I'm tired of websites. I'm tired of dealing with all the things. So I think vibe coding finally got easy enough and strong enough that even though I don't know how to, I don't have a degree in computer science, I don't know how to do object-oriented code. I pretty much rebuilt my whole personal website on JavaScript, which Vercel is really good at hosting JavaScript apps or just static websites. You can actually use Vercel for free if you're just hosting simple static websites. Their free account, like, is very generous. So like what I just said with ChatGPT sites, you can do with Vercel for free. But if you want to make it a little bit more dynamic, this is what you would want to do next. You set up a Vercel site. Um, and you can do this part for free too. You push your site to GitHub and then just connect GitHub to Vercel. You set up a site on Vercel. It's just a project and say, it'll ask you, do you want to hook this up to GitHub? You're like, yes, connect. Bam. Which GitHub project? That's GitHub. Perfect. Great. We pulled the code. Do you want to map your domain name? Yes, I mapped the domain name. So now it's all connected, right? It might be a few steps. Ask chat to help you through a few other steps in there.

But is Vercel a database or is it more of a server?

It's just a web host. If you need a database, you'll have to go outside of that, which for landing pages you might need, but you might not need. Ask Chat based on your scope of work if you need a database and it'll tell you. If you need a database, there's a couple popular database tools like Neon and Supabase, both of which have some pretty good freemium options you can get started with, but there's pros and cons to each. Have Chat do a side-by-side analysis for you. And then just pick one if you need the database.

Yeah, let me translate this to everybody. GitHub, just so you know, is owned by Microsoft. It's free and you can create public and/or private repositories where you can load all your files. Okay, so ChatGPT Sites is kind of like the low-hanging— you want to get it up and you just want to get it working. It sounds like that's the way to go. If you want something that's a little more sophisticated, Vercel is like a server. Right. And then it's connecting to GitHub to get the files. Do you have to connect to GitHub or can you just upload the files directly to Vercel?

Maybe, but everybody I know is doing it through GitHub. And the reason why you'd want to do it through GitHub is what GitHub provides that Vercel is not going to do is version control.

So if you accidentally delete something, yeah.

Yeah. Well, you accidentally delete something or maybe you roll out a new change or a new feature and it screws up everything. Well, you might want to roll that back. GitHub's going to have that reversion back. It's going to be able to go back. So. You want that.

Got it. Okay, so, so far where we're at is we've started with ChatGPT to build the project plan, and then we've used ChatGPT Codex to actually start building the files. They're going to live probably either on ChatGPT sites or in GitHub and Vercel. By the way, just quick cost analysis on what Vercel— you said it's free, but—

Vercel has a generous freemium plan. Otherwise it's $20 a month.

So you probably are going to be just fine. Either one of these are going to cost you next to nothing. So now the next step is how do we like get these forms working right? Because there's obviously some integrations here that we need to kind of connect the dots on. So how does that work?

2 ways. The easy way is just to build the form in your Mailchimp or whatever email marketing automation, wherever you're collecting emails, or if you're doing It's mainly for lead capture. If you're doing emails, you take your form, you embed it in. Now, if you're taking payments, you're probably going to want to send them to your payment source where you have secure checkout, right? That would be more complex, but you can, you can say, hey, integrate this into my Stripe account and create a secure checkout experience. If you have simple products for someone like you, Mike, for Social Media Marketing World, like this probably isn't going to work because you're in a whole ecosystem of your payments and customers and dealing with all the things. But for people doing simple things, Stripe will work. Now there's a more complex way to do this that I am now doing all the time because it's just once you set it up once, it's easier. And that is giving it access to the API of whatever mail system you're using. Mailchimp has a very strong and robust— I keep using Mailchimp because we're all familiar with that, but Mailchimp has a really strong and robust API. You can ask for in the settings in Mailchimp, go for an API token. It'll give you a token. And in Vercel, there's a special place you can go. Let me see what the name of it is to be precise.

While you're looking that up, I also want to ask about these MCP connections, because I know we use Drip as our email provider and they've got an MCP. I would imagine, I don't know if, if we want to use API, MCP, we're getting a little technical here, but what's your thoughts on whether we should connect something like this with an MCP or whether we should just go with the API?

You want to go with the API for a few reasons. The MCP is good when you're working with Codex or Claude code and you're wanting to pull data into what you're doing with AI. But while we're using Codex here to build the landing page, once it's built the landing page, it's done. It's not interacting with the MCP anymore. This landing page has to be able to live and exist and do everything we need to without Codex talking to it. It's going to deploy the code and that code needs to be able to figure out what to do.

Ah,

that's API work.

So the API is like a, it's like a route. Yeah, that's the road to get the data directly into whatever your email provider is. Okay.

So what we're looking at is what, what Vercel calls environment variables. And all it is is a little form you fill out in the backend of Vercel related to that project. You see environment variables and then you put the Mailchimp token in there and then it's a secure place where it can hold onto it. To where ChatGPT can use it, the website can use it, and you don't have to worry about it getting leaked onto the internet and everybody have access to your, your Mailchimp account. It's just a secure place to put it. Once it's there, once it's there, you can ask chat to build out the forms and say like, hey, build out this form, build out that form, integrate that form into Mailchimp, line up the values to what I already have there. And it will just do it. And then you don't have to build all the forms. And if you wanted to change it, be like, hey, add this field and add it to my Mailchimp while you're at it. You know, it's like it builds the form field and then makes the new custom field in your Mailchimp database. And then every time someone fills out the form, it's just already gone into Mailchimp. You didn't have to use a Mailchimp form. It just built the form and just integrated it custom for you. And to me, it just makes a huge difference.

And for folks that are like, their eyes are rolling backwards because this sounds so technical, I know that with Claude, and I'm guessing with ChatGPT, there is a Chrome extension where you can literally have it take over your browser and figure this stuff out for you, right? Like you could literally say, open up my email account, find the API key stuff, and put it over in Vercel, and it will just do it for you. Isn't that fair to say that that's possible with ChatGPT as well?

It's done it for me multiple times when I've gotten stuck on some more complex projects, and it's like, you need to do this in Vercel. I'm like, I don't know where that is. I'm like, yeah, fine, take the wheel, chat. And it'll open up your browser because you're already logged in. It'll just take over your browser for you and be like, click, click, click. Here it is. Oh, I misunderstood this. Now, now that I got the right context, here's what you need to do. And then it'll just do it for you.

Yeah. And this is really important, folks. Once you get these basic things out of the way where you figured out where it's— where the page is going to live and you figured out how you're going to integrate your existing email provider with the forms or your existing financial Stripe or whatever, once it's set, it's kind of set and you're good to go and you can use it over and over again. Is that fair to say?

That's right. And now once you have it set up, I don't do— I don't log into Vercel. I just deal with Codex and I talk to Codex about the website and I'm like, hey, Codex, I don't like this page anymore. Let's change it up. I like this thing that I saw over here. Give it an image of some screenshot I took. I'm like, show me what this could look like. Okay, that looks good. Push it live. Hey, chat, I want you to do a full audit of my website. Hey, can you do an audit of the landing page for this? I just read this article here. I'll copy and paste it to you. Would this increase the conversion rate of the landing page, you think? Oh yeah, it will. Like we should change this and this. Great, make those changes. I love it. Push it live. You just don't have to do anything anymore. It's just, Constant collaboration and all the technical steps and setup and drag and drop and saving and logging in and all that kind of stuff's just kind of gone and it's magic. And I know it sounds really technical. It's a little bit to learn, but it's much easier than anything we were doing in Make.com or NAN or any of those things. It's actually easier than just building your first automated marketing sequence in Drip. It's just not that hard. Everything new, it takes a little bit of effort, but I promise this is in the skill range of most marketers. If you've already been sending out emails or already kind of using drag-and-drop systems in your WordPress site, this is in your range. I promise this is probably the next step that you were looking for, is learning how to build simple websites. And then once you start playing here, I promise you're gonna want to change your whole website over.

Okay, so I want to spend some time now talking about actually crafting the landing page itself. Because you kind of alluded earlier, there's different ideas and themes and designs and concepts. So let's just give people some tips on how they can get, in this case, Codex to create different variations and show it to them. Because this is the part that I'm a Claude user. I know Claude has these artifacts which are visually beautiful and I can see them, but I don't know how it works in Codex. So let's just start with like, what kind of instructions do we need to give Codex in order for it to build beautiful looking landing pages? Because I'm smart enough to know you don't just say build landing page. If you do, you're going to get an ugly looking one. Give us some tips.

So there's 2 sides. There's a design side and then there's the copywriting side. If you already have a brand guide, then the design side's pretty straightforward because you have a well-developed brand guide. If you don't have a brand guide, the ultimate hack is literally just go and surf through Pinterest and tell— and search for websites or landing pages, find something that like hits it. Like, like you were like, yes, something like this. That's what most designers are doing, by the way.

Pinterest. So Pinterest has like screenshots of landing pages on there?

Oh yeah, there's, there's all kinds of fun graphic design things. You can go to Dribbble too if you want, but I actually just find Pinterest to be faster and more intuitive to find things. And you know, you drag and drop the picture off to your desktop, you can pin them to make a little board. But I'll just take that image and say like, make it look like this.

So you could also, if you know someone else, like a marketer that you love their landing pages, you could take a screenshot of it and say, hey, I like the concept of this. But what kind of art direction can you give it? Like, talk to us a little bit about that. You understand what I'm asking? Like, if you give it a design, and you say, I like the concept here, how can you like, you know, you have a graphic design background. So if we're art directing here a little bit, the layout of it, like, how good is it? You know, like, we'll literally copy it because we don't want to copy it. But maybe we want to be inspired by it.

I mean, you can't copyright design and every design's, you know, kind of been done somewhere sometime. So it's kind of like, well—

Yeah, but just give us some tips for people that don't have that.

If it's, if you're taking it, I'm usually pulling from unrelated industries. So it's not like I'm taking my competitor. And if you did take your competitor, that's probably not going to help as much as you would think.

Okay. So you grab some screenshots in there and what do you tell it exactly?

If I'm putting the screenshots in, then I'm going to tell it what I like about those things. I like that it has a bold color on the top and that it has a more subtle texture going on here. Like, what do you like about it? Tell it what you like and it'll pull those things. You might have 2 different designs that you like. Tell it what you like about each. This is the same kind of thing you would have to do with a graphic designer. Now that's going to be the benefit of actually hiring a designer and work with them is they have the technical language in order to guide AI, which I'm holding back from saying here. Cause I say like, oh, like if you get specific about fonts, maybe you have the language for the fonts or the types of typography. If you do, then tell it what you like in your typography, what you like in the white space. But if you are more of a layman when it comes to art direction, just tell it what you like about the designs that you're seeing and it will— and you could even say like, interview me to— like you're a graphic designer and you're trying to pull it out of a client, then it'll probably walk you through the process. Just give it the images that you like and it'll help you walk through the process.

I do recommend if you missed the last episode with Jeff Z on Claude Design, this might also be a good place to start because Claude Design is a really cool visual creative tool. And you could export those design schemas directly into chat and give it to it. So let's say we've got a design that we love. How does it display it to us inside of Cowork? Does it, is it just HTML files or what are we looking at exactly?

It is an HTML file, but it'll just display it visually in its own browser. Remember a year ago they launched their own ChatGPT and OpenAI had their own browser? Well, they shut that down and now it's just baked that whole, all the browser work they did in launching their own browser.

Was it Comet?

No, that's Perplexity's browser. They had their own browser.

So it's baked into the app, a little browser window.

Yeah, it's baked into the app. It's a very robust browser. So they just display it in that. It'll show up on the right side as a little right-hand side kind of menu and you'll be able to see it and talk to it about it.

And can you just chat with it? Like, can you just turn on voice chat and just say, hey, change this, da da da, and it'll just make the changes while you're watching it?

Not quite dynamically as Claude does. What I've noticed Claude does is Claude has a whole design environment and Claude Design specifically where it's like almost working in like an Illustrator type environment where you can actually click and drag and move elements around and specify fonts right there in the little click and drag. This is, you're just looking at an HTML page rendered in a browser and you have your chat on the left so you can talk to chat. It's more like working with, uh, Replit or Lovable. It's very similar to that. You'll have to reload the page and then you'll see the updates on it, but it's not like live changing things as you're, as you're talking. You'll have to make your prompt, it'll change it, and then you reload it.

Are we presumably providing copy that has been written outside of this Codex system and we're just letting Codex build the entire thing? I'm just curious whether you usually start with some other simple chat or tool to just get the copy where you like it and then bring it into Codex.

Like I said, I like it to write the copy and design at the same time, but I've given it the project plan to kind of guide it. Now, I do like to provide it with a general framework to go off of to kind of get it started. There's 3 different copywriting frameworks that are kind of like my go-tos for the standard landing page. I like the AIDA framework for above the fold, the PASS right underneath, and the 4 Cs underneath that. AIDA is like, I don't know, that's like a whole episode in itself breaking down the copywriting.

A-I-D-A. And then the other one is called PASS. Is it P-A-S-S?

P-A-S. And then the 4 Cs are just 4 Cs. But if you just Google Copywriting frameworks, AIDA, PAS, 4 Cs, it'll give it to you. You don't even have to understand it. You could literally just tell chat that you want that and it'll do it according to that.

Okay, so just so we're clear, we're talking about all of these are used together in one output. Okay, fascinating. Now sometimes there's short pages and long pages. What's your thoughts on like split testing and all that kind of stuff? Do you, I mean, I would imagine we could say like, hey, create a very, very short variation of this and let's put a split test in or whatever. These things are all possible, right?

Yep. All those things are possible. Almost anything's possible because it's a live— I mean, Vercel's made for hosting full JavaScript web apps. This is just a landing page. But if you give it a database, oh no, all of a sudden you can have different variations of it. You're like, hey, build me some little JavaScript to split test it 50/50 or 20/80 or whatever you want. Hey, give me a little login area where I can go in and check the stats of this landing page split test and then do the math so I can see which one's winning and when to declare the winner. And then I just push a button and it makes one the winner and I can tell you to do what the next one is. You know, you can make whatever web app you want once you have it down to the cell.

Well, and you don't need a database for that. You don't need a database for that. You can just have multiple pages. Like, you know, you could have variation 1, variation 2, right?

Yeah. You probably still need a database if you want it to start reporting and have an area dashboard for you to be able to check on it. That kind of data needs to be stored somewhere and it's going to be a database.

I mean, I'm using Microsoft Clarity and Google Analytics on the backend and I just have it encode it. Okay, so we built these pages and we've had it build the thank you page. Do you have it build literally the landing page, the thank you page, the form integration, the email sequence all in one swoop, or do you tend to have the email stuff done separately somewhere else?

I do the pages first. It'll write the emails, but it won't because I haven't— I mean, depends on what part of the project I'm in or how many times I've done this with this particular project. But it'll have the email copy ready, but you need to load them. I often use a, like a drag and drop email builder, but there's no way to get the emails into the drag and drop email builder through the API. Otherwise I would just do that. So the only way to do it is to open it up in your browser.

Yeah, that's, that's where the MCP comes in, by the way, depending on what tool you're using.

If it's available, if that particular feature is available on MCP, that would be great. But for my tool, it's not. The only way to do it is to log into the browser and manually drag and like copy and paste them in and build it all out with a little drag and drop email drip sequence. So this is where Astra got cool because it became so much more reliable taking over your browser and moving fast and effectively through that. If it already has the email copy, you'd be like, great, set up the workflow sequence here. I already got it started for you, but you like build all the emails in there, put the delay timers in there and build it all. I already have the template.

How long does it take? Because I have found that browser control is slow as molasses, at least on Claude. And it's probably because I'm not using the super high-end models because I don't have to. But with Astra, is it quite fast or is it really slow and you just watch the mouse and it's like you feel like you're watching, like, I don't know, popcorn, you're waiting for it to pop? I mean, is it really quite fast with Astra and browser control?

It could be faster. It's now fast enough and accurate enough that I could easily say, do it. And then go and work on something else for 20 minutes while it fills out 9 different emails.

Got it. Okay, let's talk about review. There needs to be humans involved in the loop here a little bit, right? So talk to me a little bit about your thoughts on that.

Of course, you're checking the pages before you push these live and looking over them, reading them. If you're doing some robust code and you're actually starting to build like a landing page split tester and all that kind of stuff, your code's starting to become more sophisticated and it's worth at least running some kind of code review. Again, this is where a skill is helpful. I had, I got this skill from a friend who used it. Now I'm using it all the time, but just the same way I built the delegate one, you could have ChatGPT do some research on like, hey, if I were going to build a code review skill, looking for security vulnerabilities, making sure the code's not redundant and it was clean and all the things and things that I don't even think to think of, go and research what best practices and build that skill for me. They can do that. You install the skill the same way. I already have that skill. So I always run like, hey, do a code review on this and delegate it in the process so that Astra, you're not doing all of it. You're giving Luna the low-hanging fruit things that are easy for it to do. So I'll do that before I ever push code live. If it's more than just simple, simple changes or aesthetic changes, um, I'll have a code review done. Anytime I'm dealing with database work or more substantial features, I'll do that. And then lastly, before you launch this thing, you do have to fill out the form. Make sure it loads to the thank you page and see the emails go out and you get the first couple of emails, you know, to make sure that their workflow is actually right. You could have to go behind it and check to make sure the right emails are in the right spot and that what was generally written is what you want. So you do have to go through the process, but you had to go through that manually anyway. Even if you were doing it all manually yourself, you would have to check it to make sure the form sent you to the right page and did everything you were expecting it to do.

Dan, first of all, thank you for going into extreme detail on this topic for our audience. I know some people are literally going to be playing this back and going through the entire process and messaging you later and letting you know how successful they've been with it. Tell everyone where they can find you on the socials, your preferred one, and then if they're interested in checking out your podcast, where do you want them to go?

Absolutely. danchez.com, D-A-N-C-H-E-Z.com. You could find links to all the socials, my newsletter, and of course, the podcast AI Driven Marketer.

Dan, thank you so much for coming on the show today.

Thank you, Mike.

Hey, if you missed anything, we took all the notes for you over at socialmediaexaminer.com/a127. Be sure to follow this show on your favorite podcasting app. And if you've been a listener for a while, we would love a review. You can also connect with me on any of the social platforms. I would love it if you would share this show with your friends. You can tag me on Facebook, LinkedIn, Instagram, X, and also over on TikTok. Do check out my other show, the Social Media Marketing Podcast. This brings us to the end of the AI Explored Podcast. I'm your host, Michael Stelzner. I'll be back with you next week. I hope you make the best out of your day and may AI help you become more successful.

The AI Explored Podcast is a production of Social Media Examiner.

One more thing. We just announced the first speakers for AI Business World 2027. Dedicated AI sessions, personally recruited speakers, pitch-free training designed for implementation, and virtual tickets cover both AI Business World and Social Media Marketing World. See the lineup at aibusinessworld.live.