How To Make A Professional WordPress Website & FREE Domain! | James Stafford | Skillshare

How To Make A Professional WordPress Website & FREE Domain!

James Stafford

How To Make A Professional WordPress Website & FREE Domain!

James Stafford

Play Speed
  • 0.5x
  • 1x (Normal)
  • 1.25x
  • 1.5x
  • 2x
5 Lessons (1h 20m)
    • 1. Get Free Domain & Hosting | Install WordPress

    • 2. Install Elementor & Envato Elements | Create Home Page

    • 3. Completing Homepage

    • 4. Creating About Us & Contact Us Pages

    • 5. Finish Contact Us & Email Marketing Setup With Convertkit

  • --
  • Beginner level
  • Intermediate level
  • Advanced level
  • All levels
  • Beg/Int level
  • Int/Adv level

Community Generated

The level is determined by a majority opinion of students who have reviewed this class. The teacher's recommendation is shown until at least 5 student responses are collected.





About This Class

In one click, you can have a professional-looking website in just about any market you can think of.

My name is James Stafford the creator of websites made easy.TV

In this video —

My goal for you in this video is to make a WordPress website that is so simple and fun to do and not only that ..

But also personal and unique to you.. you are going to love it!

Meet Your Teacher

My name is James Stafford. I am creator of Websites Made I have been working with WordPress for over the last 7 years and have become proficient with the platform. I have taught thousands of people how to properly setup their first website with my simple step by step video tutorials.

See full profile

Class Ratings

Expectations Met?
  • Exceeded!
  • Yes
  • Somewhat
  • Not really
Reviews Archive

In October 2018, we updated our review system to improve the way we collect feedback. Below are the reviews written before that update.

Your creative journey starts here.

  • Unlimited access to every class
  • Supportive online creative community
  • Learn offline with Skillshare’s app

Why Join Skillshare?

Take award-winning Skillshare Original Classes

Each class has short lessons, hands-on projects

Your membership supports Skillshare teachers

Learn From Anywhere

Take classes on the go with the Skillshare app. Stream or download to watch on the plane, the subway, or wherever you learn best.



1. Get Free Domain & Hosting | Install WordPress: one click, you could have a full functioning professional looking website and I'm gonna show you how in a minute. My name is James Stafford. I'm the creator of websites made easy. And in this video, my goal is for you to make a wordpress website step by step. That is so simple and actually fun to do. And not only that, but something that's personal and unique to you. Now, if you're not familiar with WordPress, it is by far the most popular way to make a website in the world to choose by Sony GM Best buy in your time's Katy Perry Jay Z just to name a few. See, you're in good company Now we're gonna be doing this just using a couple of free tools that make it fully customizable so you can create anything you want. It's awesome. So check this out. All you do is choose the website. You want to import in just about any market you can think of, and once you find it, then you just click import. After you do that, you can literally change anything. Think of it like playing with a simple Legos kit. You have various blocks or individual sections that you can put together like Legos, a contact Section feature section footer, Header, hero section, portfolio pricing services section, team testimonials, video section. You get it, and you can customize all these sections and build it out however you want. It really just is tailored for your specific needs. I'll put it to you this way. If you can send an email, you can build your WordPress website just simple, step by step instructions. One step at a time section by section in What's Killer is is the site that we're gonna be creating. It's gonna look like you hired a Web pro to build this bad boy for you, so I can't wait to show you Now. Over the years, we've helped lots of people all over the world just like you get started with their first website in the team. And I over websites made easy love doing this and just real quickly. I want to share with you one story of someone who started with his website a couple years back, and he said that it's just changed his life. So take a look. Hello there. My name is Chris Haider. I have a YouTube channel called Handy Dad TV that has over 100,000 subscribers in 2015. It wasn't doing all that well, but one of the things that I did was I created a really pretty popular project and made blueprints for it. But I needed a website to sell it, and one of the places that I found that was really easy to understand was websites made easy. And so I watched their entire 2015 guide on how to create a website. I installed WordPress. I used host Gator hosting, recommended by websites made easy. I got a free male chip account which I'm still using. I got list builder and I installed woo commerce and all of that other than the hosting fee , everything was free thanks to James and websites made easy. And I have sold thousands of those copies of those blueprints and it has. It's been great, and if you could see on the wall back there, that's my badge of honor. When I reached 100,000 subscribers on YouTube, and part of that success is due to such a cool website and a blogged that all my users and all my viewers can can go to for additional information that's not contained in all the videos. So thank you, James and the rest of the staff at websites made easy for helping me and handed at TV be successful. So let's get into it. This is the website that we're gonna be creating today. And remember, this is all customizable and really easy to do. This is just one of many different sites that you can choose from. And if you learn how to do this the way I'm gonna show you, then you can pick and choose and customize whatever kind of site you want to create. So just imagine for a minute as I take you on your website tour what you will do to make your site personal and unique to you. So for the first section, we have this killer hero image that will really capture audience with these layered effects and called action. What I love about this hero section it just really polished. As you'll see with this site, it's just very clean and professional. Next, we have another section to highlight a service of yours or something that's unique about you or your business. and this is a great way to really spotlight something unique about you to create a connection with your audience. And I love this section. We have a clean image carousel to showcase your portfolio of work or just pictures of yourself are things you enjoy. Then you have your services section, which I refer to as your road map for the journey that you're gonna take people on as they get to know you or your business. Then we have another spotlight section here, and if there's a section you don't want, you just click and it disappears. Or you can move these around like I said and stack them like Legos. Next we have this cool footer section with these awesome social share buttons. Check these out and then we have this really cool about us page with this video hero section in some other cool sections to highlight your goodies. And next we have a streamline clean contact this page, and lastly, I'll show you how to add a contact forms. You can stand touch with your visitors how to create a cool logo and add that to your site . And if you'd like to add a blogger. At some point, I'll show you have add that functionality to your side as well. I think really gonna love your new site. I've taken the best elements of what's working now is inspiration for this site, and that completes the tour. So now there's only three steps to getting started with your website, and Step one is your domain and website hosting. Step two is installing WordPress, and Step three is creating. Your website now is mentioned. We're gonna be using WordPress, which is just a simple Web building tool, which will allow you to have your website up and running in less than the time it takes to make a drink. A cup of coffee. It's the preferred platform of many big name brands who use it to propel their business. Four. Because it's just super easy and intuitive to use. Okay, so to get your website live online, we need to get set up with your domain name and website hosting. Now. Hosting is crucial to getting started. Online is no different to you moving into new home and letting people know where your home is. So when they search for you, they know exactly where to find you think of it like virtual real estate. Were all your website content, we'll have a safe place to live. This is really the only money well spent in this tutorial, and it comes in under just 10 bucks a month. And depending on the package you choose, it gets cheaper. Okay, so the next step is to click the link in the description of this video. After you've clicked the link, you'll see that you can save up to 60% off your website hosting. Now you should know that we do get a small affiliate commission for anybody that signs up, and we're going to save you money by getting you the lowest price possible. So it's really a win when you get the lowest price possible and we get a small commission for you signing up. So it's great for everybody, and it helps support us to continue to make this content for you. Okay, so now for the domain, which is your website address, go ahead and decide what you like and then tight that in here and choose between dot com or whatever you'd like here, Then go ahead and enter a user name and security pin and choose the billing cycle you'd like. I'm gonna go with the whole year as it's slightly cheaper this way. Next interim billing information here and make sure use an email address you can access as host. Gator will email you with your log in details afterward. Next you'll see it's add on extras. Here. You wanna and check thes as you don't need them, and now you want to enter the coupon code here. So inter WordPress hero. To be sure to validate your savings and you'll see the cost will go right down. Saving up to 60% offer entire hosting depending on the hosting package you choose. Now, when you're happy with everything, click on check out now and you'll be the proud owner of your very own new website address. Okay, awesome. Now you'll receive a couple of emails from Host Gator with your log in details and some links to different things. This is very important. You want to find the sea panel link here and click on that the sea panels recon install WordPress, your domain name, and also do lots more stuff with your website. So log in using it the user name and password, which you chose. And in case you can't remember, they're both in the email you just received at first, despite look a bit overwhelming it did for me when I first saw it. There's lots of different things you can do here, but all you need to do right now is find the software and services area. So scroll down and you'll see it here. Now you need to find the PHP selector and we want to click that and then change the PHP software to the latest one. Currently, the latest one is 7.0. As I'm creating this video by default, it comes set at 5.4. So we want to be sure to update this now. This will ensure your WordPress website is using the latest software, so make sure you update this now click back and in the same section software. Find quick install and click on that and click on WordPress here. Okay. All you need to do now is fill in a few things such as the email address, the person who'll be looking after a website. So if this is you, you can put in your email address, then your name or the name of the person as well. Now give your website a title, then your name and last name and click on Install WordPress. Once you've installed WORDPRESS, you'll get a success message that it's complete. Your user name and password are here. You're gonna use these to log into your website. You'll also get an email with all of this in it as well. When you're ready, click on this link here, which will take you to the log in or back end of your website so you can edit and start creating it. And you might get an air message saying that the page isn't available yet, and you might have to wait until everything with your new website is set up. Then click the link again. Now this is completely normal. Just takes a little bit for your website to become live online. Now you should be able to click on that link again. Enter your user name and password toe log into WordPress in your end, you're now on your dashboard and you're the proud owner of an online website. Congratulations Well done for sticking with it. It's a huge achievement. And this is where the real fun is about to begin. Okay, so now we're going to start building out your website. Okay, so now we're going to start building out your website. Now, this is the dashboard area. Think of it like the heart of your website, where you can edit and change different things. Now, there's lots of different things going on here, and we're gonna talk about these very soon, so don't let it scare you or make you feel overwhelmed. It's not daunting at all. It's actually super easy to work with WordPress. And I'm gonna show you how in this little video. So first, what I want you to do is let's go ahead and ex out all of these little notifications. Okay, Cool. So let's take a peek at what your website looks like now. So head up here and then click on visit site. It's like a diamond in the rough. It doesn't look like much, but that's about to change. Just wait and see. So head back to your dashboard by clicking dashboard here. Now you'll see. It says that your side is displaying a coming soon page. We want to go ahead and activate this. So when we view our site, it's not showing a coming soon page with the actual website that we're creating. So go ahead and click on our click here, and this will activate your website. Awesome. Okay, so now we're gonna really get the foundation of your website set up properly. So the first thing that we want to do is go over two pages and then add new. So for this 1st 1 go ahead and ex out this notification right here in just titled this one home and then go ahead and click publish and then publish again, then had right up here where it says the plus and then click on page just to add a new page . Entitle this one about publish and then publish again. Perfect. Same thing. Head back up page, name this one contact and publish. And then publish again. And then one more at page and we'll name this one blogger, just in case you want a blogger, I'm gonna show you how to do it. And if you want a blawg, you can always add it. So we'll publish and then publish again. Okay? Perfect. Now you've got all your website pages created and you're ready to start customizing each one, which I can't wait to show you were gonna do that very soon. Now, let's very quickly go to settings over here to finish setting up the foundation of your website. So let's start on general. Now. What you want to do is remove your site title and tagline and make sure you have a good email address here. And just so you know, you never want to change this here. It'll stop your website from working properly. Now, what you want to do is go down and save at the bottom and then move on to reading. Okay? Now you wanna head up here where it says your home page displays and you want to select a static page and for the home page, select home and you're going to see our pages that we created right here and then for post page. This will be your blawg. That's really the difference between pages and post pages air. Like your static pages about his page Contact us page in posts are typically used for your blawg. Just you know the difference and go ahead and save changes, then had down here to Perma links and then click on this. So here you want to go ahead and select post name. And this makes it much easier for the search engines like Google to find your website. So people searching for your business or your services will be able to find your website. So make sure you go ahead and save everything in your set. A jet. Okay. Awesome. Now you have a strong foundation for your website and you're ready to start customizing this bad boy and making it very personal and unique to you. And the way I'm gonna teach you is killer. I mean, you can literally create anything you want within clicks. It's literally like playing with Legos. When I first started doing this about 10 years ago, you were stuck with a theme you couldn't customise anything. Those days are gone, so I can't wait to show you. OK, so now let's head up to appearance and then click on themes. So a theme is really the look and feel of your website. And there are thousands of different themes to work with and some are great and some are not really so good. And that's why we've gone through and found the best one to use, which is called Ocean WP. Now, this is gonna work perfectly with the two free tools that we're gonna use to create your website which are element or and in Votto elements. So go ahead and head down here and click the plus and then right here we just won the search type in Ocean WP in there it is right there and then go ahead and install. 2. Install Elementor & Envato Elements | Create Home Page: inactivate. So you've just changed your entire website. It's still blank canvas for you to make is you like and that's what we're gonna do right now. Now, I'm gonna guide you through this with a very unique and personal website so you can model that I'm gonna include all the images and everything so you can get it done faster than ever before. So go ahead and click the link in the description below, or you can find it at websites made easy dot tv ford slash blawg ford slash Begin dash your dash website. So now we need start adding some plug ins to change the functionality of the website so we can customize it just how we like. So let's head over here to plug ins right here and then add new. Now, if you're wondering what a plug in is, it's just a little tool which enhances your website. It adds functionality and plug ins can be amazing. It can really boost your website and the plug ins that we're gonna be using or called Element or and in Votto Elements and a couple of others. So let's go ahead and search for right here. Element or and it's right here. So and look at these reviews, just amazing. Install and then activate. It should take you to this page right here. And this is just getting started with element, or we're gonna come back to this. So let's go ahead and just close this out, and then we'll head back to plug ins and then we want to add another plug in. So click on, add new and in search over here for in Votto and Votto elements. Install now and then activate. Okay, Cool. And then right here You should see a notification. This theme recommends the following plug in ocean Extra. Now this works alongside the theme Ocean WP So let's go ahead and just install this one. Install now head back down to plug ins and then installed plug ins. Let's go ahead and deactivate some of the ones we're not gonna be using. So we can deactivate this. This, this this We'll go ahead and select those and then just deactivate and apply this way just kind of improves the optimization of your website and make sure that nothing is being bogged down or slowed down. So we're only using the plug ins that we need. Okay, Awesome. I can't wait to show you this, So check this out. Let's head back over here to elements. This is one of the plug ins and bought two elements that we just installed. Go ahead and agree to this and continue. Check this out. 85 free template kits over 1500 individual page templates. These air full websites Look at all these different niches are markets, you know, clothing, Mexican restaurant recipe, surf, digital products, interior design, marketing, business, online tutorials. I mean, they have everything. It's so amazing. And if you click on one of these, I mean, look at this. It's incredible. And what I really love about involved two elements is that they're just so polished and refined. There's other plug ins that do something similar to this, but they're just flat. You're just not gonna get this kind of professionalism with any other plug in that I found . I mean, when you see this website finished that we'll be creating, you're gonna think you spent thousands of dollars on it. I mean, it is so the level of detail and refinement is it's awesome. And as you can see here you can create any page here. You can import this one. You know, Try this one. Try this one. Or you can take bits and pieces from each one and make a truly unique one. And I'm gonna show you how to do that and let me explain real quick element, or is the page builder. So if you didn't use the tool like involved two elements, you would have to go in and create the page block by block, which there's a learning curve there, and this is just a faster and just more efficient. And I feel like a better way of doing it because literally a designer created these, and all you have to do is just customize it to your liking. And I'm gonna show you exactly how to do that here soon. So I hope you can see the power in this. It's amazing what you can dio. So let's head back here. So every one of these websites, all this really is is just a bunch of pictures in words with different fonts. That's it. And I'm gonna show you the one here in a minute that we're gonna be using so you can create anything, it doesn't matter. You just pick one that you like the feel and functionality and add your images in. That's all you got to dio. And, of course, if one of these templates is your industry, use that. Just put in your content so real quick. Check this out. So we want to check this surf and ski. We'll click this we want. Let's say this home page right here. All you do is import template, and then we'll import that through element or right into our pages that we've created. And then you get this whole page created instantly within one click. Pretty awesome. All right, so let's head back to pages and then all pages. And then I want you to click on your home page, which is your front page, and then click on edit. And as you can see right here, it says, edit with element or and this is the main tool, which makes creating websites so easy. Just drag and drop. Just click to edit anything on the page, and you'll soon see how great this is. Ultimately, you're taking a short cut to success. Plus these air still all completely customizable, so you can make something truly unique and personal to you. And that's my goal For this video is to create a Web site that is not a theme that could be completely customized to your liking. So before we get started using these tools, we need to ensure that our pages are set up properly so they will work with element or and involved two elements. So we're gonna do this for all the pages we set up except the blawg page. Now, it's very important that you get this set up for each page. Otherwise it's just not gonna look right. Okay, so I'm gonna go ahead and start with the home page and all you have to do just follow along , head down here and right here where it says Header, go ahead and click on that and then disable. This didn't head down here to header style. And we won't select transparent, then had down here to title click Disabled, then for footer. We want to disable this and disable this and then right over here for Paige attributes Select element er full with Okay, I'm gonna update it. And now we're gonna do this for the rest of the pages. And remember, this needs to be set up properly for any page that we're gonna be using, Element or with. So if you haven't make sure you update your page and then you want to head back to all your pages. So now we're gonna finish the about page in the Contact us page. So let's go ahead and click on about and then edit and then head down. Click on Header Right here. Disable had downed a header style transparent element of full width. Let's go down Teoh title disabled and then for footer. Disabled, disabled. We have this element or full with. So we're good there and then update and then head back. And the same for the contact us page. So click on Edit had done the header. Disabled title. Disabled Ellipse Missed one on header header. We got to go down to head her style and that's transparent. We got title disabled and now we gotta get a flutter, disable, disable, and then for the page attributes. Elements are full with and then update. Okay, why backed all pages and we're not gonna make one for the blawg. The bloggers just for Blawg Post. That's it. So any time you write at Post, they will go into your blawg roll like a traditional blawg. That's it. So just in case you wanna blawg, you have the functionality to do so. That's why we created the Blawg page. Okay, so let's get started with the home page, adding these elements and bring your new websites alive. And it's so easy I can't wait to show you how so. Let's get going now. Go ahead and hover over home and then click on edit. Now click on the button up top. Edit with Element or now this is your element or dashboard and where you'll see your website come to life with all the different beautiful elements on the left. Again, you've got a toolbar with lots of different elements that you can use, such as headers, images, videos and lots more. Now, just before we jump in with element er, head up here and find in Votto elements. It's a little green circle right here. Here is where you're going to pick the look of your website, starting out and again, all of these air customizable, so anything you choose isn't set in stone, and you've got the freedom to choose what you want. It just makes it super quick and easy, and it looks amazing. And remember, I'm gonna be helping you through this every step of the way, so do not feel overwhelmed. Okay, So before we get started, let's take a peek at what we're going to be creating. In this way you can see the direction we're headed and how you can create anything that you want and you're really only limited by your imagination. Makes you a couple of cool places where you can also get images which are royalty free. So you can basically download these for free and not have to worry about copyright stuff. So check take a look right here. Unspool ash dot com. This is where I got all the images for this site, and you could just go to collections up here, and they have all sorts of collections that you can choose from that are really cool. Just beautiful images for your for your website. So and this one's really cool. And then there's also pixels dot com p x e l s dot com So really, all you do is just search in, say, like adventure, inspiration, landscape, anything pretty killer, right? Saying within Splash, Use keywords and you can find some great stuff. So that's how I'm gonna be creating this site with these images. Just unbelievable images that create a beautiful experience, and you could do the same as well. Now let's head to the third page and we'll find what we're looking for. And it's called. It's right here. It's called Tattoo Studio Now, before you think, Wow, I don't want an all black website with tattoos. Don't worry. That's far from what we're creating here. And you're about to see the power in this and how we're gonna transform this site very shortly into what I just showed. You were gonna customize each one of these elements and make it very personal and unique to you. And that's actually why I chose this one, because it's created this experience that feels very, very unique and personal to this business just clean and streamlined. So your content will be very focal, and there's just not a lot of business going on. And all we're gonna do is change out the images, change some colors some animations, so it's gonna look completely different. And I can't wait to show you and you will learn how to do all this yourself. And the best part is it's super easy. So I'm gonna go ahead and import home one and home to because I'm going to combine elements from both. So I'm gonna go ahead and click on Home one and then click Import Template, and this is gonna import it right into the element or library, which will see here in a minute. Okay, Perfect. So let's head back and I want to import home to Okay, that's done. So let's go ahead and close this out for now. And now we're gonna do is click on this little file in right here is the element or template library. And if you can see, if you look at some of these, I'm not gonna go through him. They're just a lot flatter and just a little bit more plain then in Votto. So anyway, that's there. If you want to take a peek at those as well. So let's go to my templates. And here they are right here. Okay, Now check this out. So here is tattoo. This is the 1st 1 we want import. So all you have to do is click insert. And yes, you want to import the settings, so click. Yes. And this is gonna import all the animations and anything that they've created specific to this home. Page one click. You have an entire home page. Now tell me that is an amazing. So cool. Now we're gonna customize this home page. Like I said, change up the headings, the language, the images, animations. Just make it look really clean, slick and professional. Now, I remember the first time I looked at this, I became very overwhelmed. And I don't want you to feel that way. So I'm gonna show you how this works. It's super easy and explain to you how to customise each one So you fully understand how to use element or in a very user friendly way. So let's head down here to the bottom left and click on the little icon that looks like a little block of Legos. Now this is called a navigator. Click it and you will see it open up a little window with several sections. Now, each one of these sections represents different elements of your home page. If you click one section, it will take you to that section. So let's click on the first section that will take us to the hero section of the home page . Now, if you look to your left, that's your element were toolbar and you have three columns. Layout is where you can edit the settings for each section. We're not gonna do too much here because we're using the settings that came with this specific template. Next this style and this is where it gets really cool. It's where you can change images. You can add video. You can add ingredients. You can change typography. You can change font colors pretty much everything here and you have advanced. And all we're gonna do here is just edit some animations. That's about it. 3. Completing Homepage : And as you can see, there's lots that you can do with Element. Or but that's why we're using these pre made templates from in Votto you're not having to do tons of custom is ations. And all really have to do is swap out some images, some text ads of animations and change some colors. Okay, so now check this out. I'm gonna show you its head appears section one. So remember, click on the section two This section you want to edit So set of this section one and say, for example, I wanted to Well, first of all, let me show you this. There's these set. You can't really see it there. Six dots right here. And if you right click this, you can edit the section, you can duplicate it. You can copy, reset, save as template, which that's how we're going to a machine here in second. How we're gonna bring another element from home page two and import it into this home page . You click the navigator or you can delete they want to delete this. Whoops. Say accidentally do that or just made a mistake. Whatever. Here, you can head down here and click on this little time icon with says History. Click that and there's revisions or actions. So it says background type, edited or removed. So I just wanted to go back one step. Pretty awesome, right? So if you make any mistakes or whatever, you can go back or than you have revisions and then you can go back even further. Okay? Pretty awesome, right? So that's about it. And I'm gonna show you you're going to see we need a little more granular as we go through each section to edit, and then you'll really understand how this works. But it's very simple. So don't let all this stuff overwhelm you. It's really, really simple to get started with element or Okay, so let's get your home page built. Let's go and close out this and we're going to start with adding a new element to this home page. I'm gonna show you how to do that real quick. So go ahead and head over here to these three lines and click this and then click Exit to Dashboard. And now I want you to head to elements and in template kits. And I just realized I wanted a different template or different hope age than the one that home page to. So no big deal. I'll show you how to do this real quick. So it's so cool about this. You can pick anything you want. So I instead of warning this hero image, I want this one. So must select this. And an import template. This hero images. Awesome. Just wait to see what this looks like with what we're gonna do with it. Okay, so that's important to the library. So let's go ahead and go back back again. Templates and then saved templates. Click on Tattoo studio home for And then we want to do Click Edit With Element. Or Now, just imagine what I'm gonna do here. You can do this pick and choose from any of these not just tattoo studio, anything that you want any of these other templates and piece something together. That's really cool. So we wanted to save this hero section, so check this out. I right click this and save is a template, so I'm just saving this section. Save it. There it is. We can close this out now. We're gonna head back just like we did before, click on the three lines and then exit to dashboard. Then we want to go back to pages, all pages and then right here, home, front page at it with element. Or now I'm gonna add in the new section so you can add it. Here, let me just show you. You can add the sections anywhere, like Legos, right? You can just piece it together. So just click the plus and then all you do is click on the file. And then we want to import my templates in this one right here. Excuse me, Home hero for this one, and you insert and then do not bring in the settings because this will bring in the settings from the other template. So you just want to say no killer, right? So now you can either drag this up, which is kind of finicky, or I can say, OK, which section Let me go to the navigator. And I like to do this, but way better. And then you can click on the section. Okay, so it just populated that section right there. So I know which one. That one. And we want to drag this all the way up to the top. Cool. Right. So then we want to get rid of this. Just exit out. Uh, a completely new hero image. Okay, so now let's be sure to update our page to save color changes for good to go. Okay, so let's go ahead and start editing this section. Now, let me show you something real quick. Let me go ahead and close out this navigator and I will show you why I really love this template and also this hero image right here. And there's a little arrow right here, and this will make it full screen. Now check this out. How cool does this look? See this layering that's going on right here, says tattoos in the background. Then you have this called action right here. And then just another image back here. It looks just extremely clean and professional. Love this effect. It's really refined. So let's go ahead and click back on this arrow. So we consort editing and we want to change this main image in the background here. So what I'm gonna do is click on the six dots and that insurers were editing this section right here with the main images. The main background okay, Wouldn't click on style. And here's the image. So I won't delete this image and they don't click plus select files. And then I'm gonna head to my desktop. And here is my folder with all the images. And you can get this on the block post too. And everything is nice and organized. We have all the hero images for the first page and everything. All the content for the entire website. So I'm gonna click on Hero one, two and three, and then we want to have two options for the hero image. You can pick whatever you like. I mean, import this one. I'll show you the here's hero one. Okay, so that imported and I'm gonna import hero Tuas. Well, so upload files and you could pick which one you want Both of our amazing images. And I got both of these on un splash. Go with this one. Check this out. It's just killer. Now that has an overlay on it. Now let me show you the overlay. See what it looks like now let's remove the overlay and then head down here to background overlay and it's at 0.7 and it's in black. So if we just move it all, you change colors to see watch and then opacity gonna bring that all the way down. 20 Looking good. Just a beautiful image. And you can try this image as well. I'm gonna go back with the blue one just for now. Now let's start editing this section So different parts of this section. So if we click in different parts of the section, you can edit it and you can always tell where you are by editing where the clip of the pencil is. Okay, so it's clicking here Now, if you don't want this, you could just erase it. This text in the background will just go away. So I'm just type in, create you got looks really cool and then right here the pencil, click the pencil. So type in 10 years and clicking here but a content looking good. Now if you want to make this bigger, let me show you get a style and then click on typography and then you can just raise the size right here. I believe it's 70 and you can change the font right here in the color as well right here. Some of it back. And in this little section right here I remember you can if you don't want the East little sections, all you have to do is right. Click it and you just delete it and that's it. So if I delete it, it's gone and say I want it back. Remember, just go to history here in the bottom, and then go right there. Pops back in. So we click back into it, and now we can edit it. I'm just gonna race this. All right. Just about done with this section. So I want to change these colors of these called action. Here. Someone click this and I'm just gonna type in first and they want to click on style paste in that color. It's a nice orange and you can use blue. You can use whatever you want, but if you want to copy this color, it will be the color I have this orange. It will be in the downloads in the text editor. Next, click on hover and then change. This is well here and for right here. Good. We're good to go. And I want to change this up here. Style. Yeah. Looking good. Take a look at the page. Big difference. Right? Cool. So we're done with this section. I'll check this out. I'm gonna show you one thing that's really close. Well, make sure we click on the six dots so we can edit this main background and say you wanted to put in a video. Check this out. Any YouTube video? It's pretty awesome, Right? Could change this back. Delete that save changes an update. See how versatile it says you can do anything you want. Really? Just your limited by your imagination. Okay, so let's move on to the next section. So this is just you can put something kind of unique about you. Maybe one of your product, Highly warning products or services here. I like this little area. It's cool. So what we can do is just at an image and in some text right here. So I'm gonna go ahead and click on the pencil and then delete this image and we're literally gonna go through the same process getting the hang of this right. So click the plus. We'll upload files, select files, Gore folder. So we want This was hero One and hero 12 This is hero to for this area shoes that it's a real clean image. And by default, the theme sets it at black and white. Now, let me She had to change that. Okay? So you would make sure you clicked into the image, go to style. And then right here, it says CSS filters. Click this pencil, and then you want to bring saturation up to 100% and then we'll bring it right into color. Perfect. Looks good. Okay. To save a little time, I just went ahead and fill these areas in. But remember this area right here? You just put in something I just put in one of our products are W T C system and just changed this by clicking there. And then it changed this. And then, of course, down here. But look how slick this looks. And let me just change this color real quick. If you want to go bold and leave it gold, go for it. So that's Ugo. And let's take a look. That looks really good. Way to the sea. Little animations we're gonna add. Okay, so now we're gonna add in a care cell for your portfolio of pictures. So let's head down here, update this. Now let's head down here. And for this care sell, all you have to do is click in here and all the images will pop up and we're just going to delete them all and at our images. So just click one of the images and delete a mall, select files, and then you can just go into carousel. I'm just gonna copy em all in there. Now, you have a whole care cell full of your portfolio. You can put any kind of images in your stuff Maybe from the work that you've done with clients or, you know, stuff that's really unique to you that you're passionate about. You do anything who had insert gallery, and this moves to You'll see it when we go live looking so good. It's good update. Okay, so coming along, we're done with this section. Let's head down here to the next section, and this is really easy. I'm just gonna fill this in. This is what I like to refer to Is your roadmap or area of transformation services. Basically, the journey you're gonna take people on. So let's see him. Go ahead and fill this end. So click on the element you want to edit. So studio I'm gonna put So if Ghana hadn't filled in some of this content here, real simple just clicked in that box. Added that, you know, you just basically click in the element you want to edit and add it your texts. So I'm gonna show you how to change these the Lai Khan's You just click in there and then the icon just go down and this one was a gear I want for that right there. That's when his bullseye and for here just rocket cool. Pretty simple. Now that area is done. We got to change the color here. 4. Creating About Us & Contact Us Pages: Okay, cool. So we're done with that section. Now let's head to the next section. This is kind of a cool area. Can highlight how you started your business or why you're starting your website or something unique about you. So and also, you know, bear in mind that you can You don't have to add all these sections just whatever you like. And now you're seeing how you can do all this So you can just x things out that you don't want to add more things or, you know, literally playing with Legos. It's, you know, you can pick whatever you want to dio. So I'm gonna show you real quick how to add this. Let's change this image real quick back in there and let's grab Hero three. It's a really cool image. Click back of the eventual to style when it changes to color. So go down to CSS filters and click the pencil and bring the saturation upto 100% Looks good. Copy this peace to write in looking good and we'll grab this color real quick. Got a style. Copy the color style peace that in now the button change the text. I'm gonna show you had a link this button to to a form here later. Both the buttons. Okay, now we want to go to style. Change the color. Well, it's got a hover. Same thing right here. So there's three of these that you want to change. There's the border, the hover in the normal, and that's it. Looking good. Okay, so let's update and let's head down here to the footer. Same process here. Why have the color pasted in and then for the East? And I love these buttons style. Paste this in good and check this out. Check out these buttons, These animations. How cool is that? Now let's grab the footer image. So click on the six dots style. Delete this image, get back to a folder and look for footer. What's update and also here, your social. Let's go to content, and for these you're just clicking them. You can arrange them, and you just pasted your your else for your social channels. It's a real simple, and then once you pay for your Ellen, it'll link right to it from the buttons. And if you don't want one, you just exit out. Can you believe this was that Tattoo website Looks so good. Okay, so now I'm gonna She had a polished up a little bit at some animations and a couple of other things. Okay, so let's head back. Click the little Red Arrow. Now you got to make sure you click the six dots and that you're under style. And then right underneath the image was his attachment. Select fixed. Check this out. Pretty cool, right? The image stays in the background and everything else moves. Okay, Now let's go. While we're editing this image, let's go down, Teoh advanced and in motion effects. And then right here it's his default. Go to fade in and then do slow, okay? And there's several effects that you can do here. I mean, there's just a lot you can play with it. I think this was the clean. Is the fade in and slow in the same here. Let's click on this element right here. Go to advanced motion effects and this one sliding down slow. Let's go ahead and update. Now let's head down here and same thing. Go ahead and click. The six dots. Go to advanced motion effects. I stayed in slow advanced potion effects and this one's drop in a plea are sliding down. We'll do that slow and the same thing for here. Advanced motion effects date and slow. Same thing here. Advanced lotion effects fade in slow, advanced looking good. And just last one right here we have two more and right here that's it. We're done with the home page. Now let's update. I'll show you what it looks like life, and you can always preview to with this. Clicking is the libel. They open a new window or tab seal clean, that is. And as you scroll down, okay, awesome. We're making some great progress. And I hope you're seeing the power in this. And it's really pretty easy once you get the hang of it. And as you practice this, it will become easier as well. And now what we're gonna do is go and start the about us page. So let's head back to the element or dashboard here. And what we want to do is just click on these three lines and then exit to dashboard and then let's head to all pages, then head over here to about and then go to edit and then click Edit with Element. Or then we want to click on the green circle here, which is the in Votto Elements. And it should be on page three and scroll down. And it should be here and we're looking for about. And there's this one, this one and also like this one. It's a services one, but you can use this for the about page as well. So let's just go back and I'll just use this one for now. In an import template, we'll go ahead and close this out. Then we want to click on the file Here. My templates. Here it is, right here. And then we just want to answer it. And then you want to click? Yes. Here. Okay, looking good. So we're gonna go through the same process. Just edit this, you know, section by section here. So let's click on this six dots up here and you can access all the images. Of course, that I have included in the content folder. So let's go ahead to click on style and then just delete this upload files, select files, and it's good to, I mean, the main folder here This image is awesome. And remember all these air free to use on on splash passion. Let us hear good. Entered that to cool. And I'm gonna change up this real quick, spurred over 10 years and change this. Let's keep it simple. Add a little quote here and we went out in a video here. So if you click that, it's pretty cool. Just pop in a YouTube video, pop it in there and check that out. Self hosted Utkan from other services. So your own video video cool. And we can close this in an update. And let's preview the changes. So yeah, obviously would want to use something about your business. Or I guess you put anything in there. But you know, something about your business would be preferable. Maybe even, you know, a customer testimonial or something. So let's head back. Okay, So let's head down in the next section. I'm gonna change this color here. I'm gonna do it. Passed through when we do all the animations for all this. So we'll head down to the next section right here, and I was gonna click in here and then for this area right here You can just put stuff in, if you like. I'm gonna leave that just as is for now. Or you can erase this stuff if you like. I'm gonna erase this clicking here, right Click on the pencil and then delete that and I'm gonna change this image right here. So click on the pencil you want to delete and down here Same thing. Now, these images are pretty big. Ideally, you want to have him around 2000 by 1200. This is 6000 by 4000. So something to be aware of You can edit thes with preview or there's other tools online. So let's go ahead. An insert media looking good. And then let's edit this last image. Okay? This one has an overlay on it. Remember me? She had a change that just in case you want, so were you. Just click on background and overlay, and this is set 2.9. Bring it up a little bit more, leaving a 0.7. And you can also change the overly color by going to color and then selecting this and selecting any one of these and that will change the color. So now what? We're gonna do is just go ahead and add the animations, change the color here and just polished up. So let's go to this one. Click on style Color. - Why keep doing that? Okay, we go change the button. We're gonna add the contact us page in a minute. Style. That's it. Animations. So click on the six dots up here. Let's go to advanced motion effects. When did you fade in? Slow This one. Advanced potion effects? Yeah, we can adhere to or not. 5. Finish Contact Us & Email Marketing Setup With Convertkit: I'm sorry. I'm going kind of fast, but it's pretty easy when you get the hang of it and that's it. We're done with the about page. So let's go ahead and update and then preview. Okay, so we're finished with the about US page. Now let's head to the contact us page. So head back and click on Dashboard and then head down two pages, all pages, and then go to contact and then click edit, and then you want to select, edit with Element, or then go ahead and select on Votto and head down to for three. We're going to select just a real simple contact this page. Just make it real clean. So click on Tattoo and had to Yeah, let's do this one contact to and then import template. Close this out. Click on the file here, my templates and then contact to and then just insert. Now this is just one section, so it's gonna be really easy. So let's change the main image. It's like that go to style. I don't even think this has an image. Actually, let's go and had an upload. A file Select Files 2019 and contact I just picked something kind of inspiring for this one . Just the mountains. I'm gonna put a little overlay on it, make it look kind of hidden in the background a little bit. All right, let's go ahead and insert media. And as you can see, it's just showing one piece of this image. We're gonna change that by heading down here to size in select cover there. And now we want to change the attachment to fixed. Now we're gonna change the background overlay, so get onto background overlay. It's like that then right here. You want to select the background type, which is normal. Classic. So select that. Then you want the color. Select this. Go with black Nice. And then you could hand down here and you can adjust it if you want. With five. Now, we're gonna remove the button here because we're gonna add a contact form. So right, click on the pencil and just delete. And then, of course, down here, you have your social and you can move these around. Same thing is last time. Click on him. You pop in your link and you're good to go with social. Now I'm gonna change the color of the East style. Poppin are orange back appear to contact us style. And now I'm gonna add some animations. Very top advanced feet. And it was slow. And then we contact us. It's advanced. Thanks. Sliding down slope perfect. And this'll area right here. Of course. And you could put your address in here too. And we're about done. Now remove this map. So right, click this and we'll put a contact form in here. So right, click this and then just elite. And then I want you to click the plus right here, and then we're gonna scroll down and we're gonna add in a short code, and you're gonna see how this works in a minute to drag that right over there. And they're gonna paste your short code in right here. So let's update the page for now because we got to create a contact form and we're gonna paste the short code of the contact form right in here. So let's just leave this page open. And if you have another page, you can head back. If not, just head back to your dashboard, exit to dashboard and then head to WP forms and then add new and then select simple contact form. And I would just recommend for now, just to not overcomplicate this just to use this simple contact form. And I'm gonna talk more about this here in a second. But just go ahead and leave all this for now and go ahead and click, save, and then click in bed. And then all you got to do is just copy this short code, close this out. It's that simple. Go back together, page here, and then just click back in that box and then paste in a short kid and it's gonna look different than this and then actually gonna head back here real quick. And I want to change the submit button. So it's good to general change the button. Just put get started to keep incongruent, and this button is gonna be blue. Unfortunately, this is free. And if you want to get more advanced with this specific plug in, of course you have to upgrade it to get more functionality and pay for it. So were limited with the blue for now, but that's okay and update and then preview page. Okay, so now we're all set up with our contact form. But let me tell you something. This little contact form by itself is not gonna do anything. And this is something that's very important that you need to be made aware of. Because once you start getting new website visitors, you need a way to communicate with him. And really, the only way that you could get subscribers and continue the conversation is through email . I mean, think about it. How many times have you gone to a website and just never returned? And that will be the case for your website if you're not getting people on an email list. So let me show you what I mean. If we head back to the former, just created right. And if you go to marketing, take a look at this. These are all email service providers, and in the past, I've recommended mail Chimp, they're great. So if we click on this Oh, guess what? You have to upgrade. Let me see how much it is. So you get the idea gets kind of costly. Now, what WP forms really is it kind of acts as a middleman. It needs to be connected to an email service provider, and to do that you have to upgrade and pay for it. And they know that this is really the goal of this. Plug in is to sign up for their upgraded service so you can get more advanced features, which is connecting with email service providers. And we can completely eliminate the middleman to go straight to the source, which is a service I recommend and is geared towards online content creators. And it's called Convert Kits and Email Marketing Service. And here we can create a form in one minute ad. It's your website. So when anybody puts in their email address, it will go straight into that service and you can begin to start email marketing and sending and receiving emails. No middleman. Now convert Kid is the ideal service to start email marketing with them. What I love about him is that their platform is specifically set up, like I said, for online content creators. So if you're looking to grow your website blogger online business now this is for you and I've previously recommended, like I said, mail chimp, because it's a great service. But for folks just starting out it can be overwhelming and complicated with just a steep learning curve. And the automation and email marketing tools that you need to grow your website are just simple to set up in on point with convert kit. So let me show you how brain dead simple this is and let's get a little form created. So go ahead and click the link right below this video in the description and head over to convert kit with me and just follow along. So let's go ahead and click. Try it for free. I'm brand New River. Do you have a website? Yes. Board press Put in a good email address here. Get started. Just watch how simple this is. So go over here. Creative form Click form right here in line. This one. Let's name the form up here. Just put name this new website, then head over here clicking the button. We want to change this to get started. Click back in the button. Let's change the color. Perfect. We're done. Will save it. Click in bed. Grab the HTML. Copy this HTML head back to our form. Right. Click on the pencil. I want you to delete the form. Now click the plus button head down, grab the HTML, pop it right in there and then just pastry HTML in here and you'll have a new form. That's it. And then update as a bonus. It all matches. Everyone's happy. So click preview. Perfect. Now you can effectively start email marketing when you're ready for this. Now you have two ways you can pick the other way that I showed you. Or this way, whatever serves you best right now. Okay, Awesome. So we're just about done. Now we need to add a custom menu, a logo and just a couple other things to finish off the site. So we'll have a appear and then click on dashboard that had down here to appearance and then click on menus and then head down here and then just title mint your menu, just main menus. Fine. And then create menu. Then go ahead and take off main right there, and we want to select about home in contact. And if you want to select the blogger, you can if you want to have a blawg. If not, let me show you what that looks like real quick. So this is where your blood post will live. Just a traditional blog's. So anytime you write a new blawg post, if that's what you want to dio with your website as well, you you will see them populate here almost like a Facebook feed. So for now, I'll just leave that out and you can select that if you like, and then go ahead and click on Add to Menu and we can move these around good to G O and then save menu. Okay, really pay attention here. We need to adjust several settings to make sure that our menu we just created shows at the top of our website. So this is really important. So the first thing I want you to confirm that you've done is head to pages and then all pages and then for home select home and then go Just select edit for your home page, and you want to make sure your home page is set to L. L. A mentor right here. You want to make sure this is set to full with and then update that so this is really important. Make sure it's set toe element or full with. Then we're gonna have to back to appearance and then customize, then head down here to header and slight general, then until off header border bottom. Now, if your menus not showing up for some reason or you want to adjust this, you can go all the way over and we'll bring it down and you should see it. But most cases, it will be right at 74. I'm gonna leave it at 74 and then for style, select, transparent and then head back and then for Clinton menu. Then head down here and click a link color. And we wanted to like the white nice right, and that's it. Go ahead and publish. Now, let's be sure our menus on all the other pages. So go ahead and click contact and all we have to do is just change. Yep, so we'll close this out for now and then just click on edit page. Let's go back, Teoh all of our pages and we'll start with about and just click edit. So go ahead and select element er full with and then update. Now we head back to all pages and in contact, click at it and select Elementary full with and then update. And we did this at the very beginning of the video, if you don't recall. But sometimes when you're adding different elements by defaults, which is back to canvass, so not a big deal. We're all set now, So you just want to confirm and we'll go back to the home page and our men, You should be showing it all pages now. So now let's add in a site title or logo. So head over here to customize and then for site identity. Click that and then you can write in, you know, the name, your website or business, or I'm just gonna put W m e websites made easy And you can see it's kind of this like grayish color. So what I'm gonna do to change that if you go back and we go down to header and then logo, we can select this color right here and then change this toe white. Here we go. And then you can upload your logo right here. So you would select your logo and you want it 1 64 by 45 Gonna go and select this one right here. It's our websites made easy logo, for example, and then selected. And here it is, right here. You should see it. Pop up right here. Here it is, right here. Awesome. So we can publish and we will close this out. Now, let's just visit the site. Wow, that looks really good. Really came together now just real quick. If you want to create a logo like this, you can head over here. Two logo l o g o M A k r dot com And they have a cool little tutorial that shows you how to get started and you can make anything. It's really awesome. So, yeah, pop, over here. If you don't have a logo, create a logo and then just add your logo. So congratulations. You are now set up for success with your new website, and now it's up to you to apply this stuff. And remember, information not acted on is just useless. So it's my hope for you that you take action on this and put this to use. And I really hope you've enjoyed this process as much as I have. And be sure to celebrate this accomplishment. This is awesome. You're in a very exciting journey here, and there's so many ways to create a website that is truly unique to you. So if you've enjoyed this video, please give me a big thumbs up and make sure you subscribe to my YouTube channel. So you're always first to know when I released new videos. And now if you want to take your website to the next level, be sure to check out the W T. C system over at my website of websites made easy dot TV and also leave me a comment below just saying you love this. It really helps my channel grow. So until next time, this is James Stafford and thank you very much.