Hey everyone, Kevin here. Today, we're going to learn how to build your very own website using WordPress. If you haven't heard of WordPress before, it's free and open-source content management system that makes it super intuitive to build your very own website. You don't even have to know how to code. It's also very popular. It turns out that over 46% of websites online use WordPress. In this video, we're going to start by customizing your very own theme. Then we'll look at how you can add pages and posts and media. And finally, we'll also publish your site. By the end of this video, you'll have your very own fully functional website. Let's check this out. To get started with WordPress, head to the following website. You can also click on the link down below in the description. Once you land on this website, right here near the top of the page, click on the button that says, get WordPress. On this next page, you have two different options to get WordPress. Over on the left-hand side, you can download and install it yourself. This is a little bit more technical and also complicated, but it also gives you full control. Over on the right-hand side, you can also set up WordPress using a hosting provider. This is where they install and also maintain WordPress on your behalf. In this video, we're going to use this approach. Let's click on see all recommended hosts. You have thousands of different hosts who host WordPress for you. On this page, you'll see some of the recommended hosts. You have Bluehost, Dreamhost, and also Wordpress.com. You could choose any one of these. In this video, we're going to use Wordpress.com, and the reason why is they're a pretty good host and they also offer a free plan, so there's no barrier to testing it out. Let's click on Wordpress.com. This drops us on Wordpress.com and you might be a little bit confused. We started out on Wordpress.org and now we're on Wordpress.com. Wordpress.com is a service that hosts WordPress. It's a little confusing, but props to them for getting a really good domain name. If you scroll down just a little bit on the page, here you'll see all the different available plans. And right here, we have the free plan and that's what we'll be using today. But there are also other plans. Here, we have a personal premium and you also have some more advanced plans down below. With the free plan, you get a tremendous amount of functionality and also capabilities. The primary downside is you will have a banner at the very top of the site that says that this is hosted by WordPress. But then again, you do get it entirely for free. Right here, let's click on this button that says start with free. Once you finish signing in, it'll ask you to personalize your site. First, you can add a site icon and this will be used throughout your website, say in the headers. Right here, you could also type in your site name and also a brief description. I'll go through and add all these different items. And just like that, I've now filled in all the basic information for the Kevin Cookie Company website. Down below, let's click on continue. This now drops us on a page where we can choose the design for the website. And you have so many different designs that you can choose from. Up on top, you can also click into all of these different categories to narrow down the different available templates. I run a cookie company, so let's see if maybe there's an appropriate category. Oh, there's restaurant. I think that one sounds about right. And here I see a few more templates. One thing to call out with templates is you can fully customize these. You could come in, you can modify the text. You could also modify the images so you can make it your own. Also, another thing to keep in mind is that although you may pick a template right now, you can always go in and you can change to a different template in the future. For now, I would like just a little bit more control than what these templates offer. So right up in the top right-hand corner, I'll click on this button that says design your own. And look at that. Welcome to your homepage. There's not much on the homepage yet, but we're going to change that very soon. Over on the left-hand side, we can start selecting patterns. Basically, we can start constructing our website simply by clicking our mouse, it really couldn't be any easier. First off, we need to pull together the header. That's the first category over here. And within header, we see all these different possible headers that we can use to start constructing our site. Here we have some very lightweight options at the top. Here's a dark background one. Here's also one with an image. So, we have all these different options. One thing you'll probably notice is that icon that we uploaded earlier. Here it's incorporated it into some of the header options. Now right here with this one header option, you'll see this large image included as part of the header. You could always go in and you can modify this image. So, think of this more as a placeholder versus the final image. Now I'd like to go with something a little bit more lightweight and I like this dark background option. I'll click on this and over on the right-hand side, we see that it's now integrated this header into the website. That was really easy. Over on the left-hand side, I now want to start adding some more content to this page. So, let's click into sections. This now opens up sections and over here, I'm currently in the intro category. So, think of this as the section that you might see at the top of your page. Here, you can simply click on one of these sections and that'll now add it to your website. We're basically building it from the top down. Now I'm not sure if I really wanted this section in here. When I hover over it here, you'll see this overlay and here I have the option to remove this section or to delete it. I'll click on that and that section is now gone again. Here, I can look through all the different intro options and at the very bottom, I can even show more patterns. And here I get this expansive list with all of these different options that I can add to my website. Now I would like to show the tagline of the Kevin Cookie Company, along with a beautiful looking picture of a cookie. Here I see this one intro section that has a large image. Now, remember we can always swap out the image later on. This is simply a placeholder. Here I could place a tagline right here with a little bit of a text, and I also have a call to action. I think this will work well, so I'll click on this option and this is now incorporated it or integrated it into my website. Over on the left-hand side, I would also like to include maybe a map of where the Kevin Cookie Company is so customers can find it. Over on the left-hand side, again, I have all these different sections that I could choose from and well worth looking through here to see what all the different options are. Now for a map, it's probably under contact, so I'll click on this and here I see all these different options. Here you can include a contact form so customers can reach out to you. Down here. Oh, where to find us, and there's also a large map. I think this will work perfectly. I'll click on this and this is now added this section to the website. I would also like to include some photos of cookies. We're a cookie business and it's really the image of the cookies that really sells them. So over on the left-hand side, let me click into gallery and here, this opens up all of these different gallery options. I like this one, which is the two photos. I think we have two really good-looking photos of cookies that I can include on the website. So let me select this option and this inserts it down at the very bottom. So again, we're constructing our website or at least the initial state of the website. When I look at this, I think I'd actually rather have the gallery ahead of the map with our location. So right here, when I hover over this section, I have the option to move it up. I'll click on this up arrow and that switches the order of these sections. As we start building out this website, don't feel like you have to have everything final right now. This is just trying to help you get an initial website down. You could always come in later and you can add more sections. You could switch the order. We'll go in and we'll modify some of the text. Again, this is just the initial state of the website. I think this all now looks good, so in the top left-hand corner, let's go back to patterns. The last item that we need to add to the homepage now is a footer. Right down here, let's click on the footer category, and just like we saw with headers and sections, we have all of these different footer options. I kind of like this one right here. I’ll select that, and that way I have this banded effect where I have kind of the darker color at the top, lighter, darker, lighter, and then darker at the very bottom. I think that looks good. In the bottom left-hand corner, let's now click on select styles. This now drops us into styles and right here, we can customize the colors and also the fonts. Although with a free account, it's somewhat limited. Right up here, we only have one option for colors and with fonts, we also only have one option. So, I guess I'll be sticking with that one option. One other thing to call out. Over on the right-hand side, here, we can see a preview of what our website looks like. And at the very top, you'll notice these different icons. This first one is a laptop. This gives you an example of what the website will look like on say a laptop or a desktop computer. You can also preview what the site will look like on a tablet. So here we get a preview of what this looks like. Here we see with the photos, it places them one on top of the other instead of side-by-side. And lastly, we can also preview what the website looks like on a mobile device or on a phone. So here we see an example of that. That way you could preview and make sure that your site looks exactly how you want it to look irrespective of what device someone happens to be accessing your site on. Down in the bottom left-hand corner, let's now click on save and continue. And lastly, we now land on a screen where we can activate this theme. If you've used wordpress.com before, this will replace your existing homepage. I'm using a new account, so this isn't a concern for me. Down below, I'll check this box and then click on activate. And look at that. They're making you cookies. How did they know? This now drops us into the site editor and we can use the editor to completely customize what our website looks like. Now, as I hover over these different items or objects on my page, you'll notice that I get this rectangle or box around the different items. All of these different objects or items are referred to as blocks. And this page that we pulled together, this is composed of many different blocks. If I go to the very top, here we see the icon or the logo that we loaded earlier. And here, if I click on it, I get this overlay. If I hover over this icon, this will tell me what this block is. Here, this is the site logo. Here, if I click on the Kevin Cookie Company text and I hover over this icon, this is the site title, or here, if I click on this main cover image, here if I hover over this icon, this is the cover image. At the very top on this toolbar, I can click on this list view icon, and here, this opens up all of the different blocks that make up my site. So, let's expand the header. Here, I'll expand the header block and it's made up of a group. And here there's a row and within these rows, I have different blocks. So, here's the site logo. Here's the title. Then over on the right-hand side, I have the navigation and then I have the buttons. So again, a website is composed of many different blocks. Let's close out of this list view by clicking on this button. I now want to start building out my website. I'll scroll down just a little bit, and here I have these text blocks. To modify a text block, all you need to do is click into it, and there I have a cursor. I could select all this text and I'll remove it. And here I could enter in my own text, deliciousness in every bite. That's our tagline here at the Kevin Cookie Company. I also want to modify the text below. Here, I'll click into this block and I'll select all the text and let me enter in some of our marketing speech that we use here at the Kevin Cookie Company. With any single block that you click into on the page, you get this overlay that appears, and this allows you to customize or tweak the block that you have selected. Again, we can see the type of block. If I click on this, I can see that it's currently a paragraph block, but I could also transform it to a different type of block. For instance, I could change it to a heading and now I have heading sized text on my page, but I don't want this much heading text. I can click on this and I can change it back to a paragraph or to undo a change, up on top, I can click on the undo icon, or I could also press control Z on my keyboard and that undoes that change. I'll click back into the text, and here again, I also get that overlay. Now over here, I could drag the position to a new spot on my page. I'll click on this and here I could place it above my heading. I'll place it there, but that probably doesn't make sense, so let's use these arrows to also move it up or either down. Right here, I'll click on down and that places it under the heading. I could also adjust the alignment. I can make it left aligned, center, or right aligned. There is also an AI assistant that you can use that helps you with your text. You can also bold, italicize, add links, and you have many other formatting options down here in this dropdown. I could also click on the ellipsis and here you also get some additional options. I'll click out of this and I think this text now looks good. Let's now go back up the page and I want to swap out this cover image with an image of cookies. I'll click on this block and just like we saw with the text, I get this overlay with all of these different options. Of course, because I clicked on an image, I get a different set of actions within this overlay. Here, I can apply different filters, or if I click on this, I could also adjust the alignment. Here, I could adjust the focus points. I can make it larger. I can make it smaller. So, I have different image adjustment tools. And right here, I see the option to replace the image. That's exactly what I want. I'll click on this and I have a few different options. I could select from pre-existing media that I might've uploaded. I could also upload an image or I could use a featured image. Now I haven't uploaded any media yet, so I'll click on upload. This opens up the file picker and right here, I see that picture of the cookies that I baked just this morning. I’ll select this one and in the bottom right-hand corner, I'll click on open. And look at these cookies. If this doesn't make you hungry, I don't know what will. Now, I think the way to complete the top of the page would be to include the logo of the Kevin Cookie Company on top of this image. Luckily, it's very easy to include an image or an additional block anywhere on the page. When I hover over this image, over on the right-hand side, I have this plus icon and I can click on that to add a block, but you could also add a block anywhere on the page. Here, for instance, I could hover over here and I could add a block here, or I can go to the top left-hand corner and here I can also add a block. I want to add a block directly on top of this image. So, let's click on this plus icon that sits on top of the image. This opens up a pop-up and right up on top, I can search for specific block types or down below, I can see some of the most frequently used blocks. Here we have a heading, a paragraph, an image, and a few others. If I go all the way to the bottom, I could also browse all of the different blocks. Let's see what's in there. This opens up a pane over on the left-hand side with all the different types of blocks that I could add to my site. And you have so many different options that you could choose from. It is a truly extensive list of options. Up on top, you could also click into patterns and you'll probably recognize this from the beginning of the video where you could insert different sections onto your site. You can also click into media and you can add media directly to your page. Now I want to add an image, so up above, I'll search for image and here's the option for an image. I'll click on this and this has now added an image block on top of this image. Over here, I'll click on upload. This opens up the Windows file picker. I'll click on the Kevin Cookie Company logo and then click on open. This is now inserted an image block on top of my cookies. Look at that logo. That is beautiful, but it is covering up these cookies, so I want to make the logo a little bit smaller. With this logo selected, I have these handles on the edges. I can press and hold on them and I can adjust the size of my logo. So, let's make that a little bit smaller. Now that I've made the logo smaller, I also want to center it. With the logo selected, I get that overlay here with all these different options. I'll click right here and this allows me to adjust the alignment. Let's align it in the center. That looks a lot better. Here, I'll click out of this logo and I noticed that it's a little far down on top of this image, and that's because there's another block on top where I could enter in a title, but I don't want to enter in a title. I'll select this block. With this block selected, I'll click on the ellipsis. And at the very bottom of this list, there’s an option to delete a block. So, if you no longer want to block, you can very easily get rid of it. You'll also see the associated shortcut key shift, alt and Z. I'll select delete and that moves the logo up a little bit. This is really starting to look nice. Let's now scroll down the page to see what other changes I need to make. All of this looks pretty good, except I think I need to swap out these images. So just like we did above, I'll replace these with other images. And just like that, we now have some great looking images. I'll scroll down just a little bit more, and here I have the map where I would like to show a location for the Kevin Cookie Company, just like we've seen with text or images, you can simply click into the block and here you get that overlay with context specific actions. Right over here, I can add a marker and I can now type in a location. We have a new location opening up in Times Square in New York City. I'll type in Times Square and right up here I see Times Square in Manhattan, New York, New York. I'll select that and that updates the location. Again, with any different blocks on your website, simply click into it and you can modify the different attributes of that block. We've been making so much progress today and I would hate to lose all of the work that we've done. In the top right-hand corner, let's click on the save icon to make sure we don't lose all of this work. Right here, it asks me if I am ready to save. I am indeed ready to save. Let's click on this. Now that we've saved the website, let's preview what this looks like. Right next to save, let's click on the laptop icon or the view icon. And here I could preview on different device types. But at the very bottom, there's also the option to view the site. Let's click on this. And look at this. The website looks beautiful. I think customers are going to love this website and hopefully they order a lot of cookies. Up on the top bar, over on the left-hand side, there's an option for next steps. Let's click on this. This opens up next steps. And because I'm using a free site here, I could see what my web address will be. It'll be kevincookiecompany7.wordpress.com. Of course, if you would prefer a domain name for your website, you can also upgrade your plan and then you can choose whatever domain you want, assuming that that domain is available. Down below, let's click on launch your site. Congratulations, the website is now live. Over here, I can see my website address. And if you type this in, you'll see this website. Over here, I can click on view site and this shows me what it looks like. Because this is a free account, I get this banner up on top, letting everyone know that I can remove this banner if I decide to pay. Now, looking at this website, I still have a little bit of work that I need to do. Up in the top left-hand corner, I'll click on my sites. This drops us into the admin experience for your WordPress site. Over on the left-hand side, you have all of your navigation. So, let's explore some of these. Right here, we have stats for the website. And look at this. My website is not that popular. It looks like we've had zero visitors. I probably need to add some more valuable content to this website. I don't think I have enough yet. Over on the left-hand side, to add more content, there are three different categories. I could add posts, media and also pages. And we've actually already added some media. Let's start by clicking into this one. Here we can see some of the media that we've already added. You could add images, documents, videos and audio. And here I can see some of those images that I've already added to my site. But so far, this isn't quite enough to attract people to this website. So, I think we need to add either posts or pages. So, what's the difference? A post is content that changes frequently. So, think of a news article or maybe a blog post or an update or maybe even a press release. A page, on the other hand, is something that's static and timeless. So, think of maybe an about us page or a contact us page, or maybe you have a privacy policy. Those are usually included in your site's navigation. Let's start by adding a post. I'll click on this. This drops me into posts, and here I can see three placeholder posts, but they have nothing to do with a cookie company. Let's click on the three dots, and right here I can delete or trash these different posts. I'll remove all three of these. And now I don't have any posts. Right up here, I'm ready to add my own, so I'll click on add new post. This drops us into the post editor and it might look familiar. That's because the editing tools here are just like what we used earlier when we edited the homepage. Up above, I'll type in a title. Down below, I'll type in some text. And here you get access to all of the same blocks. I can click on this plus icon to add a block. I could also click on the plus icon up above or alternatively, a neat shortcut key, you could press the forward slash key, and this also gives you access to all of the different blocks. I just want to insert a basic paragraph. Here, I'll enter in my text and I think this post looks good. Up on the top bar, let's click on this icon, and this exposes a pane over on the right-hand side. Currently, it's set to the block tab, but let's switch over to post. Here we can see a summary of the post. And if we scroll down just a little bit, let's go into categories. This is how we are going to categorize or group this article along with other similar articles. This is a press release, so I'll check this box. You can also add your very own categories by clicking on this link. You can also add tags to your article, and this helps your website viewers find your article. Now, this is talking about opening a store in New York. So let me add New York as a tag. We're also opening a new store. So let me add a tag for new store. And this is also a flagship location, so I'll add that as another tag. Lastly, you can also add a featured image. And this way, if we highlight this post on our homepage, it'll use this featured image. Click on here and you can now select an image. This opens up a pop-up. I'll select an image from my media library. And look at that. Here's a nice photo of the Kevin Cookie Company location in Times Square. I will select this and then click on insert. That looks great. I think I'm now all ready to publish this post. Up in the top right-hand corner, click on the publish icon. Here it wants me to double check, but I think everything looks good, so I'll click on publish. And look at that. The post has successfully published. Right over here, I can click on this link and this will bring me to the post live on the website. Down below, I can see the post address. I can now copy this and share it with others. And down below, I could also very quickly share it to different social networks. Right up above, let's click on this link to see the post live on the website. This now drops us directly into the post and look at this. This looks beautiful. Everyone's going to know about our new flagship store opening up. Up on top, I can see the category that I selected for press releases. If I click on the category, this opens up a page that shows me all articles that have that category. Currently, I only have one, so we just see this one, but in the future, we're going to be opening many more stores. I'll click on the back button to bring me back into the post. Right here, I can see the featured image as part of the post. That looks beautiful. This location is going to drive so many sales. Down below, I could also see all the texts that I entered in. Here, visitors to my website can share this article with others. And at the very bottom, you can also leave a reply or comment related to this article. Now, one concern I have is I'm not exactly sure how people are going to get to my press releases from the homepage. Right up on top, I'll click on the Kevin Cookie Company, and this brings me back to the homepage. And currently I don't surface the press releases anywhere. So, let's change that. To do that, I need to edit the homepage. In the top left-hand corner, let's click on my sites, and this brings us back to the admin experience for WordPress. To edit the home page, we need to edit the page. Over on the left-hand side navigation, you'll see a category for pages. Let's click on this. And here we can see all of the different pages that are part of this site. Now, currently we haven't added any additional pages. We just have the home page. To edit this, let's click on this text. This drops us back into the site editor that we worked with earlier. I'll simply click on the page and that way it adjusts it to use up my full screen. I want to add a block that displays all of the different posts directly here on the homepage. To add a new block, in the top left-hand corner, let's click on this plus icon. This opens up a pane on the left-hand side. And right here, I see a category for blog posts. I'd like to include posts on the homepage. This sounds right. I'll click on this and this expands the pane. And here I can see some different options for surfacing posts on the homepage. And right here, I like this option. It has a slightly different background color, a header, and then it'll feature all the different articles in a column format. I think this looks good, so I'll click on this. And here it tells me that it's added the block pattern onto the page. Up here, I'll close out of this pane. Let's now scroll down the page to see if we could find this new block that's been added. And here it is at the very bottom. Now I would like to change the title here to say latest news. I'll highlight all of this text and then type that in. Now I don't want all the news to be at the very bottom of the page. At the very least, I would like to have it above all of the contact information. When I hover over this block here, I have the option to move it up here. I'll shift it up. And now we have the map and we show the latest news. And then I have all the contact information at the bottom. And there's my article. If you click on this now, that'll bring visitors directly to this place. That's great. Down at the very bottom of this block, it's included a button to go visit the blog. But rather than saying visit blog, I would like it to say, see all news. I'll highlight the text and let's change this to see all news. If you try to click on this right now, it doesn't go anywhere. I would like to send this to the press releases category. Right underneath this post, there's a link to press releases. If I hover over this, in the bottom left-hand corner, you'll see the address where it sends a user when they click on this or the URL. I'll right click on this. And right here, I have the option to copy this link. Let's click on that. And that link is now on my clipboard. Let's click on this button that says, see all news. And this opens up that block overlay with all these different actions. Right here, there's the option to insert a link. I could also press control K. When I click on this, I can now paste in the URL for press releases. I'll paste that in and here we see the link. Now I'll press enter to add this link to this button. Now, if someone clicks on, see all news, this will take them to that press releases category where they can see all of the news and all of those posts that are attached to that category. Let's now save our changes. In the top right-hand corner, let's click on save and then let's click on save again. And it has now successfully saved the website. Let's now scroll to the very top of the page. Right up here, I have the header for the website. Over on the right-hand side of the header, I have some in site navigation, but I currently don't have an about page or contact page or even starting a project. Let's change that. In the top left-hand corner, let's click on the Kevin Cookie Company icon, and this opens up the navigation. To go back to the admin page, let's click on this back button. Back on the dashboard, I would now like to add a page. Remember a page is something that's more static. So, this is like about us or contact information, unlike a post, which is time sensitive. To add a page, let's click into the pages category. Within pages, over on the right-hand side, let's click on add new page. This now opens up an overlay that will help me construct my page and I have many different options. However, I just want a really simple about us page. On the left-hand side, I'll click on blank page. This now drops us in a blank new page and you probably recognize this experience. This is the same site editor that we've been using throughout this entire video. Up at the very top, I'll type in a title for this page -- about us. And down below, I simply want to enter a paragraph of text. Here, I'll enter in all of the story of the Kevin Cookie Company. It's well worth a read when you have some time. In the top right-hand corner, I'm all done adding content to this page now. I'll click on publish. I am ready to publish, so let's click on publish. And look at that! It has now published this page and it's now live. However, we need to add it to our header of our site, so visitors are able to navigate to this page. Right here, I can see the page address. Let's click on copy. Let's now go back to the dashboard. In the top left-hand corner, let's click on the icon and right here, let's click on this back icon to bring us back to the dashboard. Back on the dashboard, on the left-hand side navigation, make sure that you're in pages, and right here, let's click into homepage. We click into homepage to modify the header navigation of the website. I'll click into this. To modify the header, let's click on the header block that selects it. Let's click on it again, and this opens up that overlay where I could edit the different attributes. Here, there's the option to edit. Let's click on that. This opens up a screen where I can start making modifications to my header. Let's start by updating the site navigation. Right here, I have that about link. I'll click on this and that opens up that block overlay. Let's click on this icon. This allows me to modify the link. Then let's click on this edit icon. Right up here, I can change the text. Let me change this to say about us and down below I can type in the link. So, when you click on this, this is where it'll send the visitor. I would like it to go to the about us page. We previously copied this. This looks good, so I'll hit enter and that's now attaching that URL or that link to this text. Let's now click on home and right up here, let's click on link. The text says home, but currently the link goes nowhere. So, let's click on this edit icon and here let's delete that and paste in that same URL. However, here let's delete the text that says about us. This will send the visitor directly to the homepage. This is our homepage address. Right down here, let's click on save. I don't currently have a contact us page. I’ll select this block, and right over here, let's click on the ellipsis or the three dots. At the very bottom, let's click on delete and that removes that block. Also, I don't have a need for this button right now. I'll click on the button and over here, let's click on the three dots, and at the very bottom, I'll click on delete. And again, let's go up to the three dots and click on delete. And that button is now gone. I am now satisfied with this top-level header. In the top right-hand corner, let's click on save and let's click on save again. Now that I've made all of the changes to the top-level navigation, let's go back to the dashboard. In the top left-hand corner, let's click on the icon and then click on it again, and this will send us back there. Back on the dashboard, I'd like to highlight a few additional settings that you have available. On the left-hand side, let's click on comments and here you can see all of the different comments related to your posts and look at that. We already got a comment for the flagship store opening. Woohoo. I can't wait. I can't wait either. Over on the left-hand side, you can also click into users and you can add additional members to your team. This way it'll make it a little bit easier to maintain your website. Back on the left-hand side, let's go down a little bit more and you also have settings and you have a wide variety of different settings that you can modify. So well worth looking through here to see if you would like to change anything. Back on the left-hand side, let's click on my home and let's now look at our final website. In the top right-hand corner, let's click on visit site. And look at this. We now have a fully functional website for the Kevin Cookie Company. Right up on top. I have my header and over here I can click on about us and that navigates to the about us page. Right up here, I could also click on home and that navigates us back to the homepage. Here I can scroll down. There's that beautiful logo. Here we have some of our texts. We have these images. Here, we have the map block and we customized it to look at a specific location. Here, I could go down and I see all the different news and here we have all of the different posts featured. Right over here, I can click on this button and this will bring me to all the different press releases. Right up here, I'll go back and this is now a fully functional website. Of course, we can continue building it. We could add more posts. We could add more pages, but this gives us a really good starting spot. All right, well, hopefully you now have your very own website and I think you'll agree with me that it was relatively straightforward to build a beautiful looking website. To watch more videos like this one, please consider subscribing, and I hope to see you in the next video.