How To Make A Website Quickly Using AI w/free domain in 2024 guide.

The Easiest Way to Create a Website

In this article, I’ll be showing you how to make a website in probably the easiest way I’ve ever seen. Now, making websites used to be very difficult. It used to be HTML, then it turned into WordPress, which made things a lot easier. Then we got some website builders, and now AI is making it so incredibly easy that absolutely anybody could do it with basically no learning curve at all. And the best thing is, the method I’m going to show you in this  article actually does use WordPress, which is one of the most powerful tools on the internet, powering more than one-third of the entire internet. But the AI does all of the work for you, so you get all the benefits of WordPress with basically none of the learning curve.

Reasons to Create a Website

So, there’s a lot of possible reasons you’d want to use this. For one, maybe you want to make a personal portfolio—that’s what I’m going to do in this article. But many other things could be done. You can make a website for a brick-and-mortar store, maybe you’re just trying to go online, maybe you want a resume or a CV, maybe you want to make a blog, maybe you want to make a nonprofit or a fundraiser, or even online stores as well. There are tons of reasons that you could be using this tool I’ll show you in this video to make a website. And even learning curves aside, this allows us to make a website so incredibly fast—like, we can legitimately make a professional website in about 15 to 20 minutes.

Utilizing AI for Website Creation

Over the past several years, AI and large language models have really come a long way, so there are a lot of tools out there that can be used to assist you in making a website. The tool that we’re going to use in this video is called 10Web. It does make it very, very easy.

Using AI to Generate Your Website

So, we have three options right here. I’m going to generate a new website with AI. But if you wanted to, like I said, you could recreate another website using AI right here, or you could auto-migrate if you have another website and you actually do want to move that entire website over to 10Web. So let’s start off with the first one right here. I’m just going to click on “Proceed”.

Customizing Your Website with AI

Now I’m going to ask a couple of questions. I’m going to say in the beginning, I want to create an informational website. I’m not doing e-commerce. This, like I said, is going to be a personal portfolio. In this example, the business type, let’s just say “personal profile”. See if they have a “personal profile”. Or maybe I could say “photography”. That’s probably more likely what I would be doing here—personal portfolio. I’m going to take some pictures from when I was in Iceland. Maybe I’m a landscape photographer. Now click “Next”.

Enhancing with AI and Finalizing Details

Now I can click on “Enhance with AI”, and it’s going to fluff it out a little bit more. And there we go! That saves me a lot of effort in doing that. Now it asks, “Do I own a domain for my website?” I currently do not, so I can enter the desired domain that I want to get right here. Say “Next”, and now it auto-populated this. The services we offer: landscape photography. Maybe we could say “engagement”, “stock footage”. Say “Finalize”.

Signing Up and Reviewing Your Website

Now, wait to sign up. You can sign up with Google; that’s what I find to be easiest. But for this article, I’m going to sign up using my email address, first name, last name, and my password. Then I can click on “Sign Up”.

Editing Your Website

Alright, so now I’m going to say “Preview and Edit”. And this, I think, is looking pretty solid. This is like a pretty nice layout. In the beginning, we got a little parallax going on there. I’m going to change that photo for a landscape photo because I really like that parallax effect going down. We’ve got services down here, portfolio. So, a little pop-up—they want us to get 10 Web Pro free for 7 days. I will get that in a second, but we’re not going to get that just yet. I’m going to close out of this, just keep looking at this website here. And like I said, a pretty good starting point here. So, photography got cut off; there’s a couple of things that we want to edit, right? We see a couple of things. But for the most part, it’s a really nice starting point.

Customizing Layout and Design

Now we can choose on the right side. Some other things we can choose: the colour palette. I think this colour palette looks pretty solid right now. I definitely want some cooler colours—some blues, like Iceland, maybe the ocean would be a good one. Let’s go with the ocean, see how that looks. I think that’s probably the one for me. Now I’m going to say “Save”.

Upgrading to 10Web Pro

Now we can get 10Web Pro, so I’m going to say “Try 10Web Pro for seven days”. Like I said, free trial, so we don’t have to worry. If we don’t like it, we can cancel in five, six, whatever days. And there are a couple of different prices here. So, one thing to note is that this is the annual pricing here. If you toggle over monthly, if you plan on paying one month at a time, it will be a little bit more expensive—actually, a lot more. It’s about half the price if you go annually. So, it kind of just makes sense to do annually. There we have e-commerce; we have agencies as well. I’m going to go with “Business” right now, just a single website here, and I think “AI Starter” really makes the most sense for what I’m doing here. And by the way, notice that you do get a free custom domain valued up to $30. So, that’s a really nice positive right there. I’m going to say “Try for free”, enter my payment information.

Finalizing Your Website Details

All right, now we have a whole bunch of things right here: SSL—I love to see that, that’s very, very important. And we do have like 5,000 words in AI assistant, chat support, website speed boost, and stuff like that. Let’s say “Proceed”. Now we can choose the store name, the subdomain, and the data center that would be closest to our audience. Say “Finalize”.

Domain Setup and Editing Tools

So, now if you click “Edit Website”, that’ll open a new tab, but I want to go back to the original tab right here so that we can get a domain. Now, if you’re seeing this little site lock thing right here, that’s because we don’t yet have a domain. So, if we go down to “Domains”, we can click “Add a Domain”, click the little drop-down and say “Get a New Domain”. Remember, we have $30 towards a domain that comes free, so if we just look up, let’s just say I want to have “Mike’s Icelandic Photos”. We’ll say “Search”. I guarantee that’s going to be available. There we go, and it’s free like I said because this is only $17 per year and we have that $30 allowance for this right here. I’m going to say “Get”, we can say “Secure Checkout”, and that’ll automatically attach our domain to the website. It’ll point it out and we will be able to have our website visible to anyone out there.

Navigating and Editing Your Website

All right, now that we’re done with this, let’s go back to that second tab. Remember where we can edit our website? Or you can just click on “Edit Website” from the dashboard here, and that’ll bring you to a new tab. We’ll be ready to get started. If you have any pop-ups, you can just close out of them.

Website Editing Features

That’ll bring you to new tab; you can close out of any pop-ups, and it should look something like this. So, quick little rundown of what we’re dealing with here: across the top, these are the different devices or the different modes you can have your website in. So, you can view it and edit it in desktop mode; you can view it in tablet mode and on mobile as well, as many people will be visiting your website on mobile. So, by default, 10Web did a really good job of kind of making this responsive and removing some stuff from mobile. You can see the diagonal line suggests that that is hidden from mobile. Let’s go back to desktop and edit on desktop first.

Customizing Sections and Elements

So, this is using a section layout. You can see the pink block kind of outlines one entire section here. Then we have another section down here; this one is going to be mostly for mobile. You can see it’s greyed out on the desktop. Then down here, we have another block, then we have this block down here. So, within each section, you have multiple columns. So, we’ve got one column here and one column over here. These are usually outlined in gray. We can see this one right here again has two columns; this one down here has three columns, and it goes on like that.

Element Customization and Design

Alright, so for every element that you want to edit, you can click on the little pencil icon there, and on the left side, you should be able to edit the contents of that block. So, right here, we can edit this image, we can replace the image by uploading our own. So, I’m going to upload this photo right here and click on “Select”. There we go, so we have our first photo there, and then we can click on the text over here, and we can change this. We can change the size of it, looks like it’s a little bit too large right now, so we can make this smaller.

Enhancing and Personalizing Your Website

And then down here, this was already written for us; you can edit anything on the left side. If you want the “Hire Me” button, you can change how that looks, where it’s going to link to as well. So, you could have it linking to, for example, just your email if you wanted it to go to an email, or to a specific page. Usually, the page is probably what most people would end up doing there, so you can link over to like the “Contact” page, for example, and that’s what we’re going to do later in the article.

Finalizing Your Website Layout

Scrolling down, you can change; let’s say we want to change this right here. So, this is interesting, this little parallax here—it’s actually an image behind this entire section. So, I’m going to click on the section right here; you can see “Image” pops up. We’re going to choose an image, and I’m going to use this landscape photo right here. So, that looks a lot better. Anyway, the guy was kind of half cut off, so this looks good. I think I would say.

Adding and Customizing Website Features

Now, there is an overlay on this; if we wanted to change that and make it a little bit more or less opaque, I think that looks pretty good right there, a little brighter. I think that looks good. And then down here, we have our services, and again, we can change this photo in the middle or any of these elements. Any one of these elements you just click on them and change them individually.

Finalizing Your Website Footer

Now I’m going to click on “Portfolio” down here. Here we can select the images, let’s get rid of all of these and upload our own. Now, you could add captions to these; I’m not going to add captions to all of them, but let’s just say, like, I see “Mountain”. So, let’s say “Insert Gallery”. Now that whole gallery is in here, and if we wanted to change the aspect ratio of anything, we can go to maybe this column right here, and we could either kind of drag it over so it’s a little bit smaller, a little bit less of a buffer on that side, or you just delete it altogether.

Customizing Website Footer Details

Then on the bottom, we can edit the footer. Click on “Edit Footer”. Let’s save our changes; definitely want to save them. By the way, save is up on the top as well; you can always save up here. Save it, but on the footer, we want to change this phone number right here, and we could change the email as well. And over here, these are going to be buttons to our Facebook, our different socials. So, we can click on any one of those and paste your URL there. So maybe for Twitter, for example, we could say, and that way when somebody clicks on that, it’ll link over to my Twitter in particular.

Publishing Your Website

So now we can “Save and Publish”. I think this looks really good for basically zero effort. Everything’s been written for us—pretty nice website for a basic landing page right there. Now, if you want to add anything or change anything on this website, we can click on the little “plus” elements button on the top left. That’ll bring this up right here, and while we have a bunch of Elementor elements up top, we can go down to the premium 10Web widgets, and we can just bring any of those in. So, maybe down here we want to have testimonials. We just click on testimonials; that’ll be added to the bottom.

I hope this article was helpful for you. Thanks for reading.

Leave a Reply

Your email address will not be published. Required fields are marked *