GitHub & how to deploy your static site – Simply Static Webinar Series, Episode 1

[00:00:04] Nathan Wrigley: This episode of the WP Builds podcast is brought to you by GoDaddy Pro, the home of managed WordPress hosting that includes free domain, SSL, and 24 7 support. Bundle that with The Hub by GoDaddy Pro to unlock more free benefits to manage multiple sites in one place, invoice clients, and get 30% of new purchases.

Find out [email protected]. Forward slash WP Builds.

How are you doing Mark??

[00:00:37] Mark Westguard: I'm good.

[00:00:38] Nathan Wrigley: How are you? How are you? Yeah, very good. We're trying out this, we're trying out a load of different platforms to try and make video go in all different directions. This one though, is cool because you can do this.

Yeah. You're liking it. Yeah. What about what about this,

[00:01:02] Mark Westguard: Oh,

[00:01:05] Nathan Wrigley: we could do this all day, but we're not gonna, because we're gonna talk about WS form and all of the different AI things that it can do. That's right, isn't it? We're talking about AI

[00:01:16] Mark Westguard: today. Yeah. Oh, talking about AI today. Yeah. And how on earth would you want to use AI In a form?

Yeah.

[00:01:22] Nathan Wrigley: Honestly, I remember when, so there's kind of two pieces to this story. Today. There's something brand new, which markers. Launched, which will be really cool to look at. But there was also ai, you were the first, I think the first WordPress form solution. Maybe you were the first form solution. I don't know that through AI at forms.

And I remember seeing that press release and thinking, why, what? How could I possibly use AI in a form? And then of course I saw it and I thought, oh yeah, that's actually, that's nice. That's a really cool implementation.

[00:01:51] Mark Westguard: Yeah. And I think we're all still learning how we can use it and ways in which we can use it to.

Improve what we do. So yeah, we've got a

[00:01:59] Nathan Wrigley: limited amount of time because at some point it will learn how to use us. Yeah. And then yeah,

[00:02:05] Mark Westguard: it'll start coding itself and then

[00:02:07] Nathan Wrigley: that's fine. Yeah. It'll, we'll be in, we'll be in deep trouble. Just so that if you are joining us live, first of all, I appreciate that very much.

That's really cool. Thank you so much. The, one of the things that I probably should say is we're on this new platform, and if you're joining us in Facebook, you might have to grant permissions to this new app if you were ever watched us before. Basically, we've used this once before, so it's highly unlikely that you've done this.

So if you're in Facebook, go to wave.video/lives/facebook. And click the bottom to authorize us to see who you are. However, if you're on WP Builds.com/live, which is where typically most people end up, you can be logged into YouTube. Sorry Google, yeah. YouTube comments and you can make comments there and they should come through.

Hopefully they will. But if you wanna share this stream, if you've got people who you think might be interested in what Mark's got to say, then share that WP Builds.com/live. And I think that's all I wanted to say, but we do have Rob Cairns joining us, so let's just share his comment. I'm here making my mission.

It's been Rob's mission every week to get to get Mark to do pizzas. And of course, the one time Rob didn't show up was the time that

[00:03:25] Mark Westguard: We did do pizzas. Yeah. So he missed it. That's it. So pizza. No, you missed it.

[00:03:30] Nathan Wrigley: Sorry. Sorry. Rob, it's too late. But yeah, if you wanna drop in a comment, if you've got a question, please do but what I'm gonna do now is I'm probably just gonna hand it over to Mark. I'll put his screen up. Yeah. And if I interrupt, I apologize, but it's probably for a question or it's something I wanted tell,

please do.

[00:03:48] Mark Westguard: That's how we roll. That's how we roll. So yeah, before we get started, let's just remind everyone about the 20% offer.

There he is there.

[00:04:00] Nathan Wrigley: Love that.

[00:04:02] Mark Westguard: WPBuilds.com/link/ws form. If you go to that address, you can then use coupon code WP build, and you can get 20% off in the addition. Yes. We have three additions as a personal edition, a freelance edition, and an agency edition. So they're all included in that 20% off.

What we are showing you today is the open AI add-on for WS form and that is currently free to download. So if you've already got a copy of WS form, you can go onto our add-ons page and actually download it from there. Free of charge. Okay, nice.

[00:04:38] Nathan Wrigley: Yeah hang on wait. I'm gonna,

[00:04:44] Mark Westguard: I feel like we need background music next time I do this. That's right. Yeah, it's the whole way through. So yeah, why use AI inform, and I get asked this quite a bit, I kinda asked myself it as well whilst we were originally developing this cause what we actually used the moderation component of open AI initially, cuz we wanted to use it to try and.

Prevent spam. We're always trying to find ways of trying to cut down spam from forms and open AI has a component where you can feed it some text and it'll analyze it and let us know if there's anything in there that's potentially violent or abusive or anything like that. Got it. And that's where we started off with this.

And then we looked at some of the other features that Open AI could give us, like producing content and thought this would be great. For example, if I created a form to make a post. You could actually type in a description, it would write you some content, and then you could go and use that content, modify it, improve it, and then use that as your post content.

And then we also went a little bit further and went into actually using images as well. So you may have seen the the Dali component website where you can build images from a description. We've actually incorporated that into the product as well. So in general with. Our open AI add-on, you can actually now use it to create forms as of last week.

That's a new feature that we've we've put together and we're gonna show you how that works at a moment. Creating content, you can also edit content as well, so you can give it a paragraph of text, give it a description of how you want that paragraph to be changed, and it will then edit it. And then, as I was saying, you can moderate content too.

So you can use that in WS form to actually identify content that you would wanna flag as spam. So what is open ai? Now Open AI is a, it's a beast of a system. There's a lot of moving components to it, but these are generally three the main things that I'm specific models.

Within a month or two, they're gonna be redundant. We're currently at GPT four, but I'm sure there's gonna be a GPT five or something else that they come out with. And so GPT stands for Generative Pre-Trained Transformer. It's an open AI model and basically what it is, it's gone out onto the internet, soaked up a lot of data, and then that is then used to understand and generate human-like text.

So you can basically ask it questions in a human-like manner. You don't have to code it or anything, you just use natural language. And then it will then spit back language back to you that you can understand as a human. So there's chat, G P t Chat. G p T is based upon this G P T model, and that's something you may be familiar with.

You may have signed up for it, where you can basically ask it questions. It's almost like Google supercharged. So rather than you having to go through results, it gives you an immediate response. Now, each of these models is based upon data that has been collected up to a certain point. So G PT three was up to a certain year.

If you asked it any questions after that, it had no idea what was going on. G GBT four is a bigger library of information, and it's more recent. And they're now producing plugins for OpenAI where it can actually go out and get data in real time, which is really cool. Yeah. So there's a lot going on with OpenAI.

But fundamentally what we're working with in OpenAI is the models we're asking the models, Questions and the models are giving us back information. And we are gonna keep the open AI add-on up to date with those latest models. So as the new models come out, you'll be able to select those within WS form.

And then there's Darley as well which is where you can ask it a question. Ask it to create an image using a description, and it will then fire back. Currently I think a square image of the thing that you have described. And again, that uses G P T behind the scenes as well. So there are four main endpoints that we're working with.

And you'll see that when we come onto the demo, but we're talking about completion. So that's where you basically ask it a question. It'll give you some data back. There's a chat endpoint which enables you to actually interact with OpenAI as if you're chatting to it creating images and moderations.

So let's do a demo. Let's stop looking at the PowerPoint slide.

[00:09:26] Nathan Wrigley: I actually didn't, that was, sorry to interrupt. That bit was really interesting. I actually didn't know that's how it worked. I didn't know that there were those four different endpoints for the different kind of scenarios. Yeah.

We interacted with the, either the web interface for chat G P T Yeah. Or with some kind of app. But you're obviously in the chat interface in that scenario anyway.

[00:09:45] Mark Westguard: Yep. Yeah. Yeah. And there are, so if you're interested in learning more about open ai, they do have some great documentation on their site.

And you can learn about these different endpoints. So they've also got things like a transcription endpoint, like you can give it audio and it'll transcribe it and things like that. We don't get involved in that in WS form. But yeah. And then, there's a page on their site and I get bigger that describes all of their models that they have currently.

And basically what they're doing is, as the models progress, they're getting more and more the library of data that it has available to, it's getting bigger and you could also ask it more as well, so you can data and it'll give you more data back. So you'll see these tokens I think one token's roughly about four characters in the English language.

So you can, as they improve, you can give it more content and it'll give you more content back, which means you can just handle more and more complex things, give it more code to look at and things like that. But again, the, these are continually evolving, so we're not gonna get stuck up on g PT for today, but we're just show works.

Do some fun stuff with, we'll have, look at this AI generated form feature that. What this does is it enables you to describe a form in Ws form. So rather than just clicking on a template and you've got a static template there, you can describe the form that you want and then Ws form in conjunction with the open AI data or then build a form for you.

And this is very new technology that we've put together and it's evolving and we've got lots of more fun things that we wanna do with it. But I'll show you how it works. Basically first of all, you're gonna wanna sign up for open AI account, and that's done through the Open AI site. So you just click on sign up and then you'll create your account and you have to put your payment details in.

But to create a form that we're talking about today costs zero four of a dollar. Wow. It's micro sense to actually build the form and I believe, I'm not sure, but they, I think they used to give you some free credit. I'm not sure. Don't quote me on that. But so it's pretty easy to get started with it when you create the account at OpenAI.

There is a short delay. Just bear that in mind for them to set up your key and actually get it working. So if you sign up and then put the key into WS form and you find it's not working, there's just a small delay. So give it a few minutes to work on itself. And then it should work fine. Then once you've got the open AI add-on installed INS form.

Lemme just make this bigger so we can see it more easily. Thank You're gonna get open AI tab on the add new page. And in here we've got the AI generative form, which we're gonna talk about now, but we've also got some other templates for the other endpoints that we just spoke about. And we'll go through those in just a moment.

So you click on AI generative form and it's now gonna ask you to enter a prompting for the type of website, sorry, the type of form that you want to create. So let's just do a very simple one to begin with. And what I'm actually,

[00:13:07] Nathan Wrigley: would you mind if I interrupt? Sorry. Yes, mark. Go. Go. Sure. Is there, and I know you're about to give us some examples Yeah.

Is there, do you need to be mindful of the structure of your sentences here? In other words, are there preferable things to put in preferable orders? Do you, first of all describe the general purpose of the form and then go into list the fields that you might need? And what I'm saying is I understand that if you are if you're a prompt engineer as they're now calling them Yeah.

You learn how the model accepts certain sentences and certain structures of language. Is that important to hear?

[00:13:43] Mark Westguard: It's not. So with OpenAI, with G P T you should be able to ask it the question or prompt it in just natural language. So it shouldn't matter which order you do things in.

It's really about natural language, so if you wanted to say, Hey, I want a form with a first name, last name, and email address, and oh, this form is a booking form for a hotel. It should work the same as you say. And I want a booking form for a hotel with a first name last. Yeah. So it shouldn't really matter.

No. Great. So yeah, I put together just some simple prompts so you don't have to sit there and watch me type this in cause that would be very boring. So let's create a form for sponsoring the Page Builder Summit, which Nathan is very well aware about. Yeah, and we're going to ask it to have a look at a website address so you can actually feed it website addresses to look at, and it'll then look at the context of those pages and use that to determine how the form should look.

Now, this is experimental, so we'll see what comes back. So

[00:14:50] Nathan Wrigley: that was very basic, wasn't it? You literally asked for a contact form and then you pointed it a website. Yeah. And so in theory, oh, there you go. What was that? Four seconds, five seconds,

[00:15:02] Mark Westguard: tops. That's how it came out. Yeah. So just so that people know what's going on behind the scenes here, it's going off to open ai, giving it that prompt, and we are asking it to give us data back in a certain format.

And we then interpret that data into a form. You'll see that it's create, it's actually put an instruction box at the top saying please fill out this form to sponsor the event. It's asking for their first name, last name, and email address. You'll notice it's actually made certain fields required, so it's determined itself, which fields it thinks should be required.

Now, obviously you can edit this form and change anything on this form you want once it's created, that initial form. So everything is editable. But this is basically giving you a, an initial form for you to play around with. But you've got everything in there like company name, the website address, the sponsorship level.

If we click on sponsorship level and go to options, it's actually pulling out different sponsorship levels and putting them in there for you. So you can modify those. Cause I know you have a micro level as well. Yeah, but it worked out that there were those. Yeah. Yeah, that's remarkable. A logo upload field, cuz you're gonna need that, right?

If you're sponsoring short description. So yeah, so it's built the whole form for you. And you can tweak that, add fields to it, remove fields, and you see it's done that in four seconds. So super convenient at the bottom. That is

[00:16:26] Nathan Wrigley: remarkable that it's thought about things like the logo. Yeah, that is truly

[00:16:31] Mark Westguard: fascinating.

Yeah. Wow. Hell, and it's put a file upload field in there, which is pre-configured and ready to go. You'll notice at the bottom it also adds a note field to the form here, and that tells us which model was used and how many tokens we use to actually generate that form for you. Just so that you've got a note to that, you can delete that note.

That note doesn't actually appear on the form itself. It's just a note that's put in the WS form layout editor. So if we preview that form, You'll see that it's ready to go. You've got your dropdowns working. You'd also notice that it's actually put width on these fields as well. So it's doing layout.

So we're actually asking behind the scenes to open AI to say, hey, if there are two fields that are related, put them 50% width side by side. So we're doing a little bit of layout as well. And hopefully we can improve on that and maybe even do different sections and stuff in the future. So that's, that was literally a prompt of build me a form from this website and it's done.

[00:17:35] Nathan Wrigley: Can I ask you another, can I ask you another question? Sure. If we were to ask it the exact same question Yeah. Is it highly likely that we would get the same form pack or, because I understand that if you go to chat gpt and you give it the same prompts, you get different texts back typically.

Yeah.

[00:17:53] Mark Westguard: Let's see. Let's try it. Okay. Yeah. Yeah. So what we've done, so in, in the a p I for open ai, There's a configuration setting called temperature, and if you set the temperature to different values, you'll either get a very similar response every time, or you'll get a slightly different response.

So we've set the temperature kind of medium rare so that it does give a slightly different response back each time. So you'll see this time. Yeah, look, it's a different form. So we all sorts of country hasn't it? This Yeah. It's only given it just three options on that one. Yeah. So yeah, just slightly different flavors.

Yeah. You are gonna get, if you don't get the result you want, try it again. Have another go. Yeah. And see what it comes back with. So there we can go a little bit further with that and be a bit more descriptive. So we can put the original prompt in and then we can also just be a bit more specific with some of the fields that we want.

So we can say, add a first name, last name, email, logo. Let's do let's add a phone field in there as well, just to see if it picks up on that. Okay. And then, we'll, we're actually gonna specify the four different sponsorship levels. So let's see if it picks up that micro add it, we're gonna add it, add some instructions at the top.

And we're also gonna ask you to fill out the help text fields on that form to improve accessibility. Nice. So let's see if it picks it up. It may not, but hopefully it'll do. Do

[00:19:23] Nathan Wrigley: you typically get something back within you, you said it was probably four seconds or something, was it? Yeah. Is that's what you're

[00:19:29] Mark Westguard: experiencing?

Yeah. That, yeah, that's what I'm saying. Sometimes. So open AI right now, obviously it's still experimental. So there are times where their servers are just overloaded and you may get an error coming back saying, open AI is not working. So all you need to do is just resubmit it. Got, it's just, even when you go to chat gt, they're on their website.

Sometimes that locks up cause it's overload. It's just so many people using this right now. So yeah, so let's have a look. So we've got the sponsorship levels. Let's have a look at that. So there we go. It picked up the micro sponsor. Oh it did it. Gave it out. It added the phone field that we asked for.

Let's have a look. First name. It didn't pick up the help text on that occasion. Sometimes it doesn't. Let's try that. Help text feature again, cuz that could be, let's do a simple form like create form and complete. Let's do add help text to each field. Let's just see if that works.

[00:20:29] Nathan Wrigley: Okay. So the help text is the text that the user would see underneath the field.

[00:20:33] Mark Westguard: Yeah. Orient underneath the field. Yeah. I just wanna see if I can demonstrate that cuz that's, yeah, there you go. So that's actually gone through it. It's now fitting out settings on each form on each field. You can also do placeholder as well.

So if we go back to add new, and we'll go open ai, ai generative forms. So we'll do create form and let's do add help text to each form and add placeholders. Would that be field where you wrote form? Oh yeah, sorry. Yeah, that's. Oh, you should never type live on video. I'm never good at, it's why I'm here.

Yeah. That's a, yeah. Second part. So what did

[00:21:18] Nathan Wrigley: you ask it there? I was concentrating

[00:21:20] Mark Westguard: so much on that, that I thought that one we were asking for placeholder text. Oh God. You'll see It's actually filled out the placeholder. So if we preview, so if you look at the form. Got it. Yeah, there you go. So it's now put placeholder protect in there.

Yeah. So it's weird. Sometimes it picks it up, sometimes it doesn't, and it just depends on how it's feeling at the time. Yeah. But most of the time it's pretty, pretty successful. Yeah. In building a base form.

[00:21:43] Nathan Wrigley: I'd say so far we haven't had an out and out fail. All of them have been utterly serviceable.

Yeah,

[00:21:48] Mark Westguard: absolutely. Yeah. We'll do another one. Let's create a form for creating a product review. So we do that. So we're gonna do create a form for reviewing a product. At the top, add instructions, first name, last name, and email address, which should all be required. Fields include a rating filled and a filled for uploading photos.

That should be optional. Okay. So let's see what that does. Okay. Let's

[00:22:10] Nathan Wrigley: see what

[00:22:11] Mark Westguard: goes down. Yeah. First name. There we go. So there's our rating field. So yeah, so there's your a basic rating form. Let's run exactly the same again and see what we get.

[00:22:30] Nathan Wrigley: Do you need to be mindful of the specific language there? So you have a rating field? Yeah. You have to use the word rating, for example, that has to go

[00:22:39] Mark Westguard: with that example. I would think so, yeah. I haven't tried it with other language to be honest. Okay. It's such a new product. But it just, we are still learning how to use it.

Yeah. So one thing that, I recently discovered is if we go to and. You can actually ask it to build forms in different languages as well. So if we create a form for renting an apartment for a vacation, create the form in Spanish. So if we can create No, it should, fingers crossed. No,

[00:23:13] Nathan Wrigley: there's gonna be no way that I'm gonna be able to tell you.

So now it's created true or not, but anybody in the comments has a vague understanding of Spanish, let me know. But it looks, it's not in English. I know that much. Yeah, it's not in

[00:23:26] Mark Westguard: English. Hopefully it's not offensive. But there you go. So you can actually ask me, do stuff in different languages, which is pretty cool.

You can also That is remarkable. Yeah. Yeah. And you can also ask it to look at different websites as well. If we do create a form for adding a WordPress person to this website, and this is Marcus Burnett's, the WP World website, which is a great website. If you're not on it, you should add yourself to it.

But if we hit create, it'll actually go off and look at a website and then build a form for it as well, which is crazy. So there you go.

[00:24:05] Nathan Wrigley: First, nice job title company, Biograph. Yeah. Look at that.

[00:24:10] Mark Westguard: Yeah, off you go. So there you go. So there's AI generated forms. You can basically use that to get the foundation down on a form, and then you can come in here and tweak that however you want.

You can still modify required and anything that you want about that site you can create multi-step forms and everything else that we've spoken about in the other tutorials that we created. So that is, and we are absolutely remarkable. Yeah. We, and we're still learning how to. Make that do amazing things.

There's all kinds of fun stuff that we can do with that. So that will be evolving over time, that product is literally a week old as we make this video. But pretty cool so far.

[00:24:51] Nathan Wrigley: Very well done, mate. I've gotta say that is pretty amazing. I can imagine the scenarios for onboarding your product through that are pretty cool, aren't they?

With the best will in the world, you've designed a product, but it's complicated in certain respects because it just, it can't be anything other. But if you can go in, drop in a form, and then learn on the job, if you're like, oh, look what it did, where did it put that and get to the, get to the races quicker.

That's brilliant. Yeah.

[00:25:22] Mark Westguard: Really great. Yeah. Yeah, and it's it's exciting to use the technology in a slightly different way as well. Most people have been using it to generate text and generate images, so we wanted to go a step further and use that output to then build something else and. I was surprised that we could get data out of open AI that we could use quite reliably.

There, there are a few things that you would probably wanna change on that form. But 95% of it is there and I'm hoping that as we improve it and it has open AI improves, we can really use this to speed up production. I think the

[00:25:59] Nathan Wrigley: key word there is change, isn't it? It's not like you Yeah.

You saved a boatload of time. There is no doubt you saved time. Yeah. And all if all you've gotta do is just go in and modify it, that's seemingly that's where humanity has ended up with AI at the minute, isn't it? It's, yeah. You give it a prompt, it gives you something back and most of the time you have to then change it in some way.

Yeah. Cuz it's not gonna be exactly what you wanted, but I'm guessing that you'll get better at

[00:26:25] Mark Westguard: this. Yeah. Yeah. You can do silly stuff with it as well. Create a form for designing a dinosaur. Oh, this is great.

[00:26:33] Nathan Wrigley: Go on. Let's see what

[00:26:34] Mark Westguard: happens. Let's see what it creates. You can play around with it as well, but there you go.

Dinosaur name. Dinosaur type it, it even puts in, car horse dinosaur height. To this

[00:26:50] Nathan Wrigley: point. I have to do this.

[00:26:53] Mark Westguard: Exactly. Yeah. So anyway, play around with it. Beautiful. All right. Let's do some more boring stuff. Oh, no,

[00:27:06] Nathan Wrigley: that, that was great. Okay. So that was the bit, the brand new bit. This is the bit which has been around for when did you launch this? I'm thinking it was like four or five

[00:27:13] Mark Westguard: months ago. Yeah, something like that.

Yeah, something like that. So this is basically giving you the ability to use open AI within your forms. So let's let's start with the completion first of all and what a completion is. Is, and this is basically how open AI describes it, is that you're giving it some natural language and it is then giving you some, a natural language response back.

And that, that data you get back is what a completion is. So the way that we do that in WS form is we have a text field here for the prompt. So that is where you're asking the question. We have a bum, which actually goes off and gets that completion from OpenAI. And then we have a field call completion, call it whatever you want.

But there's a field where that data that's coming back gets injected into, and we use conditional logic in WS form to actually run that action that goes and gets that completion. So it's quite straightforward. There's a condition here that says if the get completion button has been clicked, Then this make open AI request action, we're gonna run that immediately.

Simple as that, right? So let's just click it and run it. And if we go to actions, you'll see that make open AI request here and you basically yeah. You just configure this to say you know what you want it to do. We're gonna use the completion endpoint, which is gonna give us some text back. We choose the model that we want, and then below that, we then choose the field that we want for the input.

And I'm gonna come onto this mass feature in a minute. But for now, we're just gonna take the data straight from the field. We're gonna use the prompt field here. We're gonna output it in the completion field here. So let's preview that form and then we can say, what is WordPress? Then we hit get completion, it goes off to OpenAI, it's now asking OpenAI right completion.

And then we've injected that data into that completion field. So you could use this maybe on a form for creating a post, and you could add a prompt to that form that says, type a description for the blog. It will then write the blog for you. You can edit it, submit it, and actually create a post in WordPress using this feature.

Now you can put as many of these prompts and completions on the page as you want. You don't just have to have one. So if you want, if you had a longer form and you wanted to have the ability for people to use open AI to help them complete some content on a form, then you can do that. There are a few configuration settings in here.

So there are things like max tokens. And Max tokens is basically the total number of tokens you are gonna allow open AI to use to accept your prompt and create the completion. So for 150 tokens, you're roughly gonna get about 600 characters allowance. Now for a lot of things, that's gonna be fine, but if you're asking it to produce maybe some code output where there's a lot of content there or a much longer article, you would need to increase that max token amount.

Now they, on the chat completion the max token amount is actually different to a normal completion. So a chat completion, if you leave that as blank, it's basically unlimited and it'll just let open AI go on as much as me. Yes. Yeah. For the completion endpoint, which is the one we're using here, if you leave that blank, I think it's only four or something.

So you probably wanna increase that. We set it to one 50 by default, just to get you started. Yeah. Cause that's kinda, a nice size, but you can change that if you need to. Does that

[00:30:53] Nathan Wrigley: 50 tokens, is that both directions? So is that the prompt and

[00:30:57] Mark Westguard: the report? Yeah, it's the combination of the two. Yeah.

Yeah. And it won't use one 50. Every time. So if you ask something very simple, when you get a simple response back, you're not gonna use that many tokens up. Now, honestly, 150 tokens is gonna cost you, a minuscule amount of money to do it. Yeah. You could do thousands of completions and probably not even hit a few dollars.

It's on the tech side of things, tokens aren't that expensive to use, I don't think I've even used my token allowance on OpenAI yet regard, despite the number of tests that I've done. Yeah. So there are a bunch of other settings in the open ai that you can set. And so here's the thing, like the temperature here that we were talking about earlier.

Oh yeah. Yeah. And you can control that temperature here by using this slider. So the lower that is, the less random the responses are gonna be. The higher that is, the more likely open is gonna give you a different response each time. Got it. So if you wanna keep clicking it and getting a different response back from it to see if you like it, then you can increase that temperature and it'll give you a different version back.

Can I ask that

[00:32:08] Nathan Wrigley: about that? Does that does that constrain, so you've described that it constrains or it loosens up or constrains Yeah. The difference in the response. Yeah. Does it allow it to be, so let's say for example I don't know you've got a very specific question. Does it allow it to open up its own answer so that it is a bit more, for example, if you wanted something to be a bit wacky or go further and explore different websites and things like that is temperature simply what the repetition would do?

[00:32:40] Mark Westguard: It's purely repetition of the expected response, so it won't go off on a whim and start giving you a joke. Okay. It'll keep it within the context of the question, but it'll just change that response, so it's worded in different ways. Perfect. Thank you. Some of these other settings I'm not gonna go into today, but if you wanna look into them, then go into the open AI documentation.

It does get quite complicated but we'll keep it fairly straightforward today. The only other one you may wanna think about though is this API request timeout. So that by default is 15 seconds to get a response back. Now, on a larger response, it can sometimes take open AI a while to get to produce that content for you.

So you may wanna increase that. As the models are getting better and their platforms getting better, these responses are coming back a lot quicker, you saw when we were creating the forms, it's coming back in about, To, we're actually getting response back in about one or two seconds now, which is pretty impressive to produce everything that we need.

And it takes us about two seconds to actually build the form. But if you are doing something quite complicated, you can increase that API request time. Now does

[00:33:54] Nathan Wrigley: OpenAI give you its response in one lump, if you like?

[00:34:00] Mark Westguard: So there's two ways it does it. Yes. The, you can do it just in one lump, which is the way that we currently do it.

It also does a thing called streaming where it will send you the right response as it's being generated. We are hoping to implement that into WS form. It's actually quite a different way of getting the data back and pushing it into the form. But when you are using chat g pt, you'll notice it's.

But that's actually working out the answer in real time. And you'll see in the streaming of that work come back to you as a stream. But at the moment, this, the way this works is it goes off, gets the request, and then brings it back so that we can then inject the whole thing into a field. The thing with the streaming is that as it's streaming it, it can actually edit itself.

So it might start writing somewhere and then change it. So we just, for the, for now we're just taking that full finished response and then putting that. Thank you. Okay, so that's that's a completion. That's fairly straightforward. Then you also, let's go on to, so chat is basically a completion, but it just keeps extending itself and extending itself.

So you're right. You're almost right. Not a scree

[00:35:13] Nathan Wrigley: one-off thing.

[00:35:14] Mark Westguard: Yeah. Okay. Yeah. Yeah. So it takes the output of the previous completion and takes that into account as part of a chat conversation. Let's go to edit and have a look at that one. So the way that an edit works is you have an input.

So maybe you put a paragraph or text in that you've written, and then you give it some instructions on how you want to change that input. So on that one, it's again a very similar layout to what we did before. So we've got the conditional logic, which runs the open AI endpoint. Once the button has been clicked and we have make open AI request.

So in here we've got, we're using the edit endpoint. Endpoint, yep. Using a model. Gonna use this field as the input. Because we're using edit, it's also asking us for the instruction filled. So if we preview that form, I'll show you how that works. So we can say something like, the house is red and then the instruction may be Change the house from red to blue.

So we hit submit. That's now gonna send, oh, nope. Sorry, I hit the wrong one. Let's go review. Alright, so the house is red and I'll say, change the house red to blue. My debug consoles in the way. No, it's okay. There you go. Got it. Got it. So that's gone off to open ai, given it the original input, given it some instruction, and then gives us the output.

Wow, this is basically using an instruction to modify textual content. So you could do stuff like make this more witty make this more enticing and things like that. Change Brian to. Yeah, exactly. Yeah. That's basically what an edit does. So that just that

[00:37:00] Nathan Wrigley: form would be really great if you, if I don't know, if you work in and you've got an editorial team Yeah.

And you just want to yeah. Tidy up an article, shrink it by, we've only got space on the page that, that's gonna go on for 600 words. Shrink this to 600 words or whatever. Yeah. Yeah, exactly. And you could put that on your internal, I don't know, intranet site, if yeah. And and you're off to the races.

[00:37:24] Mark Westguard: Brilliant. Yeah. We've had some people use this to maybe create a blog post, but they may have a field for maybe the meta description. So you can say, create a meta description from this input. And then the output is basically a meta description field, which we then map to the meta description for yo or something.

Got it. Yeah. And you can use it to, generate dynamic contact. That's cool. Yeah, let's go back to completion quickly cause I just wanna show the prompt engineering. So what prompt engineering does, this is actually how we do the AI generative forms. But with prompt engineering, what you can do is you can give open AI some additional text content, some additional input around what the user has typed in and you can use that to then engineer the output that you are gonna get from open ai.

So let's see how that works. So if we go back into the action and we'll go to make open AI request. So rather than taking the direct input that they've typed in and sending that to. We're gonna use what's, what we call a mask, which is how you create a prompt. And I've got one that I prepared earlier, like all good cooking programs.

Nice. So what we're gonna say is the following is a conversation between an agent and a customer. The agent would attempt to diagnose the problem and suggest a solution whilst refraining from asking for any questions related to personal identifiable information. Instead of asking for PII such as username, password, refer the, use it to the help article rocket net.

So we're just gonna basically give it a website and then it will refer to that if it can't answer the question. And then on the field, we'll put 1, 2, 5, 1. So this here, this hash field 2 5 1 that I'm injecting into this input mask. Yeah. Is going take the input from that prompt there. I'm change this one from rocket.net just to go.com because the model I'm using on this one is a little bit older.

And rocket.net is a new hosting, new website solution. Yeah. Yeah. It may not pick it up as much as I love Rocket. We use Rocket for hosting, but let's use GoDaddy because it's probably got some more data in there. So we'll hit saving close and we'll preview this and then you can say what's managed?

Let's do, yeah. What managed WordPress boosting do you have? So this can now be used in a customer support environment. Wow. So if we do get completion, so what it's now doing is gonna inject that prompt into that prompt engineering that we just did. And you'll see we've now got a response back and we offer several different types of managed workers hosting packages.

Depending on your requirements, you may wanna consider a basic package with shared hosting, a premium package with dedicated hosting or a specialized package with cloud hosting. So it, yeah, it basically is using the data that it's got on GoDaddy to. Give a suggested response back. Now there's certain applications where this may not be good, perhaps on a health website, you don't want people asking health questions, right?

Yeah. But for a basic question like what hosting packages do you have? This can, really be a great little tool to put on your website. You'll notice when I hit some get completion because we've got the temperature up. It's now given us a different response. Yeah. It's actually the website address.

Yeah. So each time you click on it, you're gonna get a slightly different flavor come back. But on the whole it's pretty, pretty successful. Yeah. In giving back, the right URLs and the right information. So that's prompt engineering. So we use That's amazing. Yeah. It's really cool. And we use that prompt engineering on the AI generative form.

So we are saying, give us the data back in this format so that we can build your form. So that's basically how that works. So let's have a look at the image endpoint. Oh,

[00:41:33] Nathan Wrigley: this is always a winner.

[00:41:35] Mark Westguard: This is, this works great. So this is actually using very similar tech to Darley the image generation website that you may be familiar with.

So again, we have a conditional logic on here that runs the open AI when the button's been clicked. And here is our action here. So we have an action in WS form called Make OpenAI request. We're using the image file endpoint. So what the image file endpoint does is it's actually gonna go off to OpenAI, generate an image, and then inject that image into a file field.

So you can then submit that as part of your form. We're gonna take the input field here directly. You can again actually use masks on this as well, so you can prompt engineer images so it gets even more complicated. But we're just gonna keep this simple. On this one, we're gonna take the data from field.

We're gonna choose the to and image descriptions or input field. We're gonna output it to this image file upload field here. You can also choose how many images you want it to return. So let's do three. Okay? You can choose the image size that you want, up to 10 24 by 10 24. And we'll leave the API request time out at 15 seconds.

That should be enough. So we'll hit save and close. And then we'll go, now let's just quickly look at that file upload field as well. Yeah. So we've configured that to use DropZone js and the reason that we do that is that DropZone js enables us to populate that field with an image. A normal HTML five file upload field cannot be pre-populated for security reasons, but with drop zone js we can do that.

So that's why we choose that. It's also just a nicer interface. It looks great. I agree. Yeah, perhaps much better. Okay, so let's preview that. And then, so we've got the enter an image description filled on the left, and we've got the image output on the right hand side here. Ok. So we'll do Coffee Cat, and we'll click on Get Image.

So now it's going off to open AI and it's saying give me three images back. And it will then inject those into this images filled on the right hand side with a bit of luck.

[00:43:44] Nathan Wrigley: We could be this typically does, it's creating images, right? It's gonna be, yeah, there

[00:43:49] Mark Westguard: you go. So we have three fluffy cats now, so I like one at the bottom.

Yeah. Is a bit concerned. Look, he's a bit concerned looking, isn't he? Yeah. So these image uploads now when I submit the form, would then become image uploads as if you had direct them onto the form. So a couple of applications I got it. Got, yeah. So this, so they now,

[00:44:14] Nathan Wrigley: the submission process, you could submit Correct.

Submit those into this form. Yeah.

[00:44:18] Mark Westguard: Got it. Yeah. So if I were to hit submit here, that then becomes part of the submission. You can use those images then within any of our integration. So you could push that as a post featured image. You could put, push it to an a c F gallery. You can push it to a third party integration, even push it through Zapier to any third party that you want.

You can even write your own custom PHP code and take those images and do whatever you like with them. You can also use them with our user management add-on and use it to create an avatar image for a user. So when somebody registers, they could describe an avatar image here and actually create an avatar.

And then that would become their user profile image.

[00:45:00] Nathan Wrigley: So can open ai, consume an image, and then amend an image. You have the, you were using edit earlier on text? No, I don't know if it can, I don't know. Yeah, that'd be interesting, wouldn't it? If you sent a picture of yourself. Yeah.

Because I've seen services to create your own avatar, but obviously for that you need to upload a, an image of yourself

[00:45:17] Mark Westguard: and then That's right. Yeah. And it learns it, doesn't it? Yeah. Does machine learning on it? Yeah. That's fascinating. Yeah, and the who knows where the capability gonna go.

But yeah, so we've, we've basically taken what's available in the API right now. And so yeah, sorry, Andrew's asking about alt text there. Yes, you could do that. So on our post management, add-on lemme actually, lemme just show you this. So we go into here and we go into image uploads.

I think it's, let's see. So let's choose. So basically in WS form, we have a thing called a file handler, and that's where the file's gonna be saved. So if you were to save that to the media library, you'll notice in here that we have the ability to select Oh yeah. Look, yeah. The captions, the descriptions and everything else.

So you can actually put ws form variables in there that could come from a different field. So you could run a couple of open AI. Endpoints and do some prompt engineering and say, create me. An alt text for this prompt. And then you could then inject that into that image and upload it using that.

I

[00:46:32] Nathan Wrigley: guess you could also just consume the content of the query, in that case, create me an image of a cat. I guess you could, send that and truncate it

[00:46:40] Mark Westguard: in some way. Yeah, absolutely. Yeah. So you would just put like hash filled, 1, 2, 3 whatever it was. Yeah. In this case it would be 1, 2, 5, 6.

So you can do Yep. Captions, descriptions. Actually, this suggestion here came from yo at Yoast. He, he was using WS form on a project with Michelle Forhe. He wanted to be able to set custom captions, descriptions and all text on images, and so we added this as a feature. So yeah, you can absolutely nice make that dynamic, which is pretty cool.

Yeah. So yeah and you don't have to just use one one open AI endpoint in a given form. You can actually have a button. Trigger two or more of those endpoints. So you could actually create an image and create some text at the same time if you wanted to on a file. And do anything you want.

Obviously

that would

[00:47:32] Nathan Wrigley: be up in the action section, right?

[00:47:33] Mark Westguard: You'd create more actions? Yeah. Yeah. So you'd go up to actions here and then you'd just go to add new, and then you would click on make open AI requests, configure out however you want. Yep. And then in your conditional logic for that button, you can then extend that and you could say, also, Yes, run this one immediately as well, and it'll run both of those at the same time. The conditional logic in WS form, we have another video on that, which I think was maybe the second one, the dynamics, I can't remember. That seems about right. And that describes a lot about the conditional logic and how you can use that.

But the nice thing about WS form conditional logic is you can use it to control actions. So you can run actions, you can also disable and enable actions as well based upon different conditions on the form. You can do pretty much anything that you want with it, in terms of making the form dynamic.

And in a, in ai, we use it to basically take that button, click and run the open AI request. So that can be, any number that you want. The only other one that we have on here is instead of creating an actual file upload field, You can, you actually get the URL back for the image. So images that are generated from OpenAI have almost like a perma link.

And then you can use this to, to generate that url. So you might wanna use that URL somewhere else. Oh, I see that. Yeah. A Google sheet or something like that. But if we do, got Fluffy cat again, number of cats I've generated, I'm not surprised frankly.

[00:49:09] Nathan Wrigley: That's where we're all ending up on the internet.

That's right. That'ss. What it was

[00:49:12] Mark Westguard: for. What it was designed for. Oh, there you go. Yeah. So there's your url. That's a huge url, but that URL will actually, hopefully see wrap that. Got it.

Let's

[00:49:22] Nathan Wrigley: see what kind of cake Crazy cat we're gonna get.

[00:49:24] Mark Westguard: There we go. There's Old Cat. So you can use that URL anywhere you want.

Again, with any integration. Once that has generated, you can then create an action. We can go add action, we could say, or even run JavaScript, we can actually run it, show an alert with that. You already run a WordPress, so anything that you want or send it in an email.

Yeah, so those images that are generated can actually be put in as attachments on emails as well, so you can have it email the user.

[00:50:01] Nathan Wrigley: Yeah. I just love what I would do with this is I would create an iterative cat. So I would ask it to create a cat and then I would like to feed that cat back and the text would simply make it more fluffy and then just keep doing that over and over again,

[00:50:18] Mark Westguard: maybe 10 times in animation.

Yeah. And then just see

[00:50:22] Nathan Wrigley: where you end up. Yeah. Yeah.

[00:50:26] Mark Westguard: Yeah. I know we've got Andrew on the call who has, AI is his product, which is a fantastic AI product that integrates in with browsers and also WordPress. So he, he knows an awful lot about where he knows how this works. Yeah. And I, can I ask you, can I

[00:50:42] Nathan Wrigley: ask, oh, sorry, you carry on.

[00:50:44] Mark Westguard: Sorry. Yeah, I was just, wondering if he was aware of whether or not they're gonna be looking, doing video in future and things like that, cause they've got the imaging down and I'm sure they're gonna be improving on that. But there's all kinds of other stuff that it's doing and I think the transcription thing's quite interesting.

I actually wonder whether we could use that, upload an audio file as a file upload field and then have it transcribe that into a text field. That might be

[00:51:09] Nathan Wrigley: Yeah, there are there are software as a service products that are, yeah, possible.

[00:51:15] Mark Westguard: Yeah. Sorry, you were saying.

No. I was just gonna say the one thing that I thought was of interest that I would want to know, can you stack. The fields, cuz every, everything that we've seen so far is a discreet field. So you've added in one field, but could I, for example, consume, oh, I don't know first name field, last name field.

[00:51:36] Nathan Wrigley: Yep. Here's an image. And so for example, could I say to open ai? Okay. Consume the first name, the last name, here's an image. Yeah. Combine those to make a picture of that person with their name tattooed across their head. You get the idea? I'm doing multiple things. Yep. Yeah, you

[00:51:55] Mark Westguard: could do that.

Here we go. He's gonna do it. Yeah, we'll do, yeah. We'll quickly create one. So let's do first name field, a last name field. And then maybe you'd want like a description of Phil. Yeah. Whatever you wanna put together. And then you remember we would plan around with that mask. Yeah. So where it was putting in the field, oh, that was a bit where

[00:52:20] Nathan Wrigley: you could modify, you could instruct it how to Yeah.

[00:52:23] Mark Westguard: Cope with the request. Yeah. So you would go, you would create your AI action. And so rather than say a specific field, you would say mask, and then you could say the person's name is Hash field two.

They are, and then maybe do something like that. So you can use multiple fields on the form to create Got it. An input mask from, as many different fields as you want. And you can actually use any of our Ws form variables in there as well. So you can actually put in things like, hash blog name or.

The blog date or whatever variables that you want to use in that input mask as your prompt engineering you can use. Which makes it totally dynamic, basically. And you can build some quite complex prompts there. So for example, you could have a select dropdown on the field, that was department, right?

Ah, network you may have yeah, yep. Sales support, whatever. And you can inject that into the prompts of saying this, you, this customer has a question related to this department. And then put their question in there and it would change the output based upon which department that you're working with.

[00:53:43] Nathan Wrigley: The sky is the limit really,

[00:53:45] Mark Westguard: isn't it? Yeah. Yeah. It's interesting how you can use a form plugin and gel that into prompt engineering. I'm quite excited about the prospects of where it can go. And we have customers using this as they're using it on their customer support forms now. Where it's totally remarkable.

Yeah. So just

[00:54:08] Nathan Wrigley: mind boggling. I have one more question, if that's all right? Absolutely. So on the screen at the moment, if you're listening to this, apologies, but on the screen, mind you, you probably wouldn't have got a great deal out of this if you were listening to it anyway, cuz lots of visuals.

I'm looking at a bunch of fields. So I've got text area, email. Range, slider, and so on. Which of those fields, going back to the the open AI bit at the beginning where you were creating forms. Yeah. Which of those fields are you able to use in an AI created form? For example, can you say, give me check boxes with these options, can you use the color, the, can you get it to make a progress bar?

Are there some that you can and some that you can't?

[00:54:50] Mark Westguard: Yes, there are. So at the moment we've got text area number, phone, email, U R L. You've got the three main choice fields, which are the select checkbox and radio fields. Yep. And just to, some people dunno the difference between a checkbox and a radio.

So a checkbox is basically you that you could have three check boxes and you could choose any of those that you want, any number of them. So you could check all three of them if you wanted to. And a radio will always be just one of those. So if you choose a different one, it'll unselect the one that you've selected before.

It'll do date time. It'll do rating, it'll do file upload fields. We add a submit button and a G D P R checkbox by default on every f every form, just to make sure that those two things are there. Cause we wanna make sure everything is GDPR compliant. Yeah. It handles text editor fields as well.

So if you ask it to write a description, it would inject the description into that. And we're gonna be adding more fields as time goes on it's got all the, kind of the main ones in there right now, the ones that primarily people use. But we can easily add to it things like the color field and other fields in future.

But if we go, just go add new open ai, generate a form. So create a form with check boxes that allow you to choose a color. I've never tried this before. We'll, ok. Let's see. See what it comes back with. I could possibly go wrong. Yeah. Yeah. Oh, there are check boxes with different colors. Yeah. Yeah.

So it, it'll, yeah, it'll do. And also like select dropdowns as well. So we could do open ai, AI generated form, create a form that allows you to choose a country from a select dropdown field. So I'm, again, I'm just writing free language in here. Yeah. Any, anything specific?

[00:56:52] Nathan Wrigley: Hoping that something comes back.

I tell you what, hopeful that something comes back. You've been very lucky with the tech here. Nothing has gone wrong so far. Yeah.

[00:56:59] Mark Westguard: Oh, we didn't put the countries in, but it Yeah. Sometimes it'll actually put the countries in there. Yeah. Let's try it again. Just for fun. We'll just try it one more time.

Yeah.

[00:57:07] Nathan Wrigley: Yeah. Bet. Now it'll work because

[00:57:10] Mark Westguard: that allows You did it twice.

[00:57:13] Nathan Wrigley: Yeah. Yeah. Object form, credit form that allows you to choose a, maybe you needed to be more specific in your language. Yeah. Dropdown drop

[00:57:22] Mark Westguard: down let's say put five countries in the dropdown. That's sounds this will be interesting cuz we're using the word dropdown list.

I wonder if it'll interpret that into a select cause we always use the term, say, this may not work, but, bit of fun. There's our country select dropdown and there's our five countries, so it works. Yeah.

[00:57:47] Nathan Wrigley: Oh, look at which countries it shows. Yes. Yeah. Just, yeah. That's fascinating.

Honestly, I feel like you've stumbled into something pretty remarkable here. Yeah. It's, and you are gonna save a lot of people a lot of time. Just run us through the pricing model for this. Yeah. It's, yeah. Did I hear you right? Did I, you say it was free?

[00:58:12] Mark Westguard: Yeah, it is right now. Okay. So basically hang on, lemme bring up our pricing package.

Yeah, why not, so that people know what we've got. So there are three flavors of WS form. You've got the personal edition, which is a single site license. There's a freelance edition, which is a five site license, and that comes with some of our add-ons. And then we have the agency edition, which is unlimited sites, and all of the add-ons that we have now at the moment, the Open AI add-on is free because it's basically in beta.

We're playing around with it. And as much as it, you've seen it working today we're still playing around with it. Grab it while you can because it's a free add-on for these. We usually sell add-ons for between 19 and. I'm not quite sure what it will be eventually, but at the moment it's free.

And that includes the AI generative forms feature that we show today in all of those endpoints that we spoke about. So yeah, for $59 you can start playing around with it on the personal revision. Plus we've got our 20% off for WP Builds views. Oh, yes. With that cheeky with Nathan included.

[00:59:24] Nathan Wrigley: Yeah.

You get a free head, a free Nathan's head. So yeah, look at that. WP Builds.com/link forward slash ws form. Use the coupon code WP Builds and you get. 20% off. Honestly, mark I am in awe of what you've been able to do with WS form and the fact that you've done it more or less by yourself. The coding, the marketing, everything is truly amazing.

I know you've got a lot of really hardcore fans and yeah, a few of them in the comments here. We, a few nice comments as we were going through people saying that this is really amazing. I dunno if you saw those by the way. Excellent. Mark says, John. Thank you, John. Oh, thank you John. That's really excellent.

And Elliot says it's very nice. Hello Elliot. Pleased. And also Mark, sorry, not Mark. Andrew Palmer said you were mentioning about transcriptions. Yeah. He said that has already been included in Oh, great. So

[01:00:22] Mark Westguard: that's in Bert. That's brilliant. Yeah. Just

[01:00:24] Nathan Wrigley: add whisper. Whisper is whisper. It's like an rival to OpenAI.

Am I right in that or is Whisper a part of

[01:00:30] Mark Westguard: OpenAI? Not sure. Sure. So yeah, I'm not very familiar with it, but yeah, I'm sure if you go to bertha.ai he'll tell you all about it. Yeah.

[01:00:39] Nathan Wrigley: Yeah. But honestly, thank you. It's been a wonderful series. I hope that people, use it and get the knowledge that you've given from it.

They're all gonna be on the WP Builds.com website. If you go to the archives at the top and you scroll down to the last archives section, it's called demos. And all the six that we've done are dropping into there. So Yeah.

[01:01:02] Mark Westguard: Yeah. And we've also put those, a link to those in our WS form community Facebook group as well.

Oh, have you? Oh, nice. Yeah. Yeah. And we're gonna put them all on. We'll put 'em on a page now that we've got them all done, we'll put them on a page on Ws forms knowledge base as well. And it's at this

[01:01:17] Nathan Wrigley: point that

I'll try a few more. Let's see what else we've got here.

[01:01:26] Mark Westguard: Oh, I was ended. We've ended. Oh, there, it's, that's, we were looking for that earlier. That's,

We

[01:01:33] Nathan Wrigley: were trying to find that one earlier. I'm gonna do it again just for fun. No, I'm not. Yes I am. I think we should I think we should round this off with the

[01:01:44] Mark Westguard: oh yeah, absolutely.

We just mellow out. Have a cigar out and we don't need to do anything now. Cause open AI is gonna do it all for us. That's right.

[01:01:51] Nathan Wrigley: The what's the point, mark? Just give off. Kickback, relax, take it easy. I've really enjoyed this. I really have. This series has been absolutely wonderful. Sadly though,

[01:02:01] Mark Westguard: thank you.

Thank you so much for having me on. It's

[01:02:03] Nathan Wrigley: been great. I'm gonna turn this music off. It's doing my head in. There you go.

[01:02:08] Mark Westguard: We should have played that the whole way through.

[01:02:10] Nathan Wrigley: Yeah, that's right. It would've really calmed everybody down. So I'm gonna end it. Thanks for joining me. I really appreciate it. I hope that everybody has a lovely day, and we will see you all later as late as June.

Take care.