Customizr: Learn WordPress with the ultimate Free theme | Daniel Boudreau | Skillshare

Playback Speed

  • 0.5x
  • 1x (Normal)
  • 1.25x
  • 1.5x
  • 2x

Customizr: Learn WordPress with the ultimate Free theme

teacher avatar Daniel Boudreau, I love empowering folks!

Watch this class and thousands more

Get unlimited access to every class
Taught by industry leaders & working professionals
Topics include illustration, design, photography, and more

Watch this class and thousands more

Get unlimited access to every class
Taught by industry leaders & working professionals
Topics include illustration, design, photography, and more

Lessons in This Class

60 Lessons (4h 22m)
    • 1. Overview

    • 2. Introduction

    • 3. webhosting

    • 4. login to wordpress admin

    • 5. about passwords

    • 6. WPC 6 How to log in to cpanel

    • 7. WPC 7 create subdomain

    • 8. WPC 8 Change your admin password

    • 9. WPC 9 Customize + donate

    • 10. WPC 10 installing your theme

    • 11. WPC 11 wordpress install

    • 12. WPC 12 Change skin color + tagline

    • 13. WPC 12 create page img and text

    • 14. WPC 13 Link to any page of your site

    • 15. WPC 13 wordprocessor

    • 16. WPC 14 upload to media library

    • 17. WPC 15 content workout page

    • 18. WPC 16 content add other pages

    • 19. WPC 17 create a menu

    • 20. WPC 18 create a submenu

    • 21. WPC 19 create a submenu for page

    • 22. WPC 20 set your front page

    • 23. WPC 21 FI resize images pixlr

    • 24. WPC 22 set your featured pages

    • 25. WPC 23 Intro to slider

    • 26. WPC 24 resize images for slider

    • 27. WPC 24

    • 28. WPC 25 install your slider

    • 29. WPC 26 social media

    • 30. WPC 27 change your fonts

    • 31. WPC 28 wp google fonts plugin

    • 32. WPC 29 contact form

    • 33. WPC 30 recaptcha setup

    • 34. WPC 31 delete about sample page

    • 35. WPC 32 assign a posts page

    • 36. WPC 33 posting your first post

    • 37. WPC 34 Image gallery post

    • 38. WPC 35 Edit image gallery

    • 39. WPC 36 add social media sharing

    • 40. WPC 37 social media more button

    • 41. WPC 38 discussion settings

    • 42. WPC 39 categorize your posts

    • 43. WPC 40 categorize your posts to one or more

    • 44. WPC 41 setting sidebars

    • 45. WPC 42 set up your sidebar widgets

    • 46. WPC 43 Front page layout

    • 47. WPC 44 change posts and pages sidebars

    • 48. WPC 45 breadcrumbs

    • 49. WPC 46 footer widgets

    • 50. WPC 47 footer area 2

    • 51. WPC 48 Footer area 3

    • 52. WPC 49 create logo and upload

    • 53. WPC 50 replace logo

    • 54. WPC 51 blank front page

    • 55. WPC 51

    • 56. WPC 52 create thank you page

    • 57. WPC 53 setup mailchimp account

    • 58. WPC 54 download these plugins

    • 59. WPC 55 connect wordpress to mailchimp

    • 60. WPC 56 finalize your signup form

  • --
  • 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

Create as attractive, fully functional and mobile ready site with the Customizr theme on WordPress. Take advantage of the many customizations that this theme offers. You will be able to add a slider, right sidebar, left sidebar, footer and dropdown menus to your site within the first few lessons. With a five star rating on WordPress and an average of 1 500 downloads a day this theme is a trusted solution to your web design needs. Ok ready, set, let's get started! 

Meet Your Teacher

Teacher Profile Image

Daniel Boudreau

I love empowering folks!


I teach web design and music.

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.

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. Overview: Well, hi there. And thanks for checking out this course. You know, the biggest trouble I had when I was starting to you design a WordPress sites. It was finding a free theme that I could work with and customize and that I wouldn't feel stuck with. I've started playing around with a lot of different WordPress sites, and I found that it was hard to use and there were certain things that I just couldn't customise and make it look the way wanted. I went on blogged posts and I took it. I looked at lists which were the best ones, and after so much research, I stumbled upon customizer for WordPress. Now the Customizer theme is a free Web template that you can use with WordPress to easily create any type of website, whether it be business blog's portfolios, landing pages, forums, shops, etcetera. I was so amazed with all the options that the Customizer theme had to offer with a set of life preview options. Customizer does not require advance technical skills to design and add content to your website. This theme is responsive, meaning it adapts nicely on any type of device, whether it be a desktop a tablet or smartphone, and it's compatible with all modern browsers. Now let's take a tour of this mock website that you're going to design in this course. It's a site called Home Fitness, and it's devoted to giving people work out ideas. It's focused on nutrition, and it gives people ideas on how to craft their positive mindset. So in the course, I'll show you how to set up a logo, how to shut, set up your social links, how to set up your navigation with a drop down menu, and we're gonna add a tagline here to your website. Rob, obviously gonna add this slider, and we're going to set up a speech. Erred Pages section now featured pages works much like a navigation menu in that its features an image and a little descriptive text. So this could be anything it could be like. A mini short bio could be like a product. Or it could just be a little hint of what people are gonna find on a page. So thes images air clickable and they send people to the any page that you specify. Now. What's great about the customizer theme is that you have a footer with three widgets sections. So we have one here, one here with this image and one here with this video. So within these three sections, you can put any widget that you find in WordPress. Let's check out some of the other pages of the site we have what's called in that WordPress world. It's called a static page here. We've set up a left sidebar on this page. We're also gonna find out how to create this email sign up form. So in this case, what I've designed is an image that when a user fills in their name and information here and they click on this green button, they're gonna be sent to a thank you page to get this free. PdF. Now it's a secret page that you can't access from any menu items, so it's only accessible when somebody fills out their information from here. In some Internet jargon, it's called a lead magnets. So this is a great way to start building your list and make your website super functional. Here's a search bar recent posts, recent comments, archives categories and a meta section. And down here we're gonna learn how to add social icons so people can share your content on Facebook on Twitter on Google plus Pinterest, they can even print this at home, and you can add a whole bunch of more options for people to share your content. Now, in her block section, we're gonna talk about how to publish blocked pages, how to set a specific page to accommodate all of your block posts. And all of your block post will show up in a nice image gallery like that with featured image, and so people can browse around that and check out your different articles. We're gonna set up a contact US page, which is an email form. This makes it so you don't have to you display your email address. You could just have people right on your contact form and email you straight for your website. This is a special capture. Once people click this, they can prove to the website that they're not a robot and it'll reduce your spam content. So we'll also learn how to set up a beautiful image gallery. With this, these tiled thumbnails And once a user clicks on any thumbnail, they're gonna be brought to this really nice image carousel. And just by clicking on this arrow, they can browse through all of you the images on your image gallery and notice also that on these post pages waken set the side bar to the right side so way have so many options in this theme. It's incredible. So I'm also going to show you obviously how to work with your dashboard, and we're gonna be in and out of the front page of the of the website, which is what people see on the Internet and the back end. I'm gonna show you how to create a sub domain for this website. So if you already have your domain, you'll be able to create a sub domain that will piggyback on your domain. Still, you'll have two separate websites that you can work on and take what you learn in this course and apply it to your real website that you want to create. And if you don't have a domain yet, I'm gonna go through all the steps right from scratch. We're gonna purchase a domain purchase of Web hosting plan, and I'll show you how to create your sub domain so you can get started with this course and you'll also have your real domain so you can start building your riel website in parallel using the customizer theme. This course has a 30 day money back guarantee. If at any time during your first month year unsatisfied with the course, you can just ask for your money back. I'm really looking forward to working with you and developing your website with this awesome free theme customizer on WordPress. 2. Introduction: Hi there. Thanks so much for joining this course. I'm so excited to start working with you and creating this mock website. And, ah, you'll be able to create your actual riel website in parallel with this one, which is great. I'm just gonna take a moment to orient you around the WordPress dashboard. Now, you get to see this once. Ah, you set up your domain. You You've bought your web hosting and I'll tell you how to get to this page. But, um, let me just show you around the section so you, when you get to this page, you won't make a jump. So up here we see ah, information about WordPress. Here is the name of our site that's gonna be, um, part of our domain name. And, ah, things like comments air here. Here's ah, where you can add new things to your website, like post media at a new link at a new page at a new user. Um, so this is the dashboard. Ah, Sometimes you're gonna have plug ins to install. So these are, uh, down here is ah, list of installed plug ins we have for the site. These add these all these at extra functionality to the site and why I mentioned that first is but because if we go to the dashboard here, will see this menu item called Jetpack jetpack is a plug in. So this ad adds a whole bunch of functionality to our sights. This menu item is posts. You've probably heard the term block posts while this is the section where you can create block posts. This is the section where you add all your media like pictures, any type of file you on upload like P d efs. You can even upload videos, but most the time we just in bed videos these days. Ah, here's our links category. Ah, going down here, we have pages. We're gonna work a lot with this section and here we have comments, contact which we won't be looking at this too much. We will be looking at appearance will be installing our theme from here and will be working a lot with this customized menu on This is really particular to this this theme called Customizer. And this this lets you customise so many things about how the about the look and feel of the site so Once you change things out of here, you save them and ex out of this and you'll be taken back to the dashboard. Eso just ah, we're just doing a fly Fly by here so we can just get a good orientation about what this dashboard is all about. Now, plug ins is, um we saw that before when you were checked out. Jet, uh, jetpack. Ah, users is you be able to see your own account, your website account with your user name and password that you used toe log in and ah, that's pretty much it. That's pretty much all we're gonna be. We're gonna use this, um, dashboard for there's a lot more settings of, obviously, but that's that's what we're gonna work with. We're gonna work a bit with the settings menu item here, modifying some things in ah, writing and reading. And we're gonna also look with this work with this plug in called easy forms that will enable you to create, opt informs. So that's that's the basic, um, orientation that I have to offer you. At this point. It's just to get you to have a look of of where to find things in your sight very often will be going back and forth from this page and will be going to which is called the back end. So this back and page will be using to customize your site. And this link here that we were gonna click on is gonna take us to the front end of our website. So this is what people actually see when they're visiting your site. And if you want to go back to your back end, you click up here on this Ah, this menu here and you can go straight to different parts of the back end. You can go straight to the customized section. You go straight to new Post Media Page. Or you can just edit this page that you're watching and you can log out from your account right here. So that concludes this introduction again. Um, I I hope you re really excited to get started with creating your website with this awesome free theme called customizers. Sometimes I can't even believe that this thing is free. So I hope you really excited, and I'm going to see you in the next video 3. webhosting: So now you've gotten your cash back account. Or maybe you've decided not to get the cash back. Account whatever is more worthwhile for you, and it will redirect you to get go, daddy, Or just type in godaddy dot com. You'll get to the same place now, depending on your country. I'm in Canada, so it's going to bring me to see a dot go daddy dot com. It's all the same site, but the difference is that it's already ah picked out Canada English for me and the currency it's put to Canadian dollars. So here you have a whole host of countries that go. Daddy supports quote unquote supports, um, meaning that will have language interrogation for these countries. And they will also have currencies, multiple currencies for most countries that you might find yourself in if you're watching this course. So that's one of the reasons why I chose Go Daddy over a previous Web hosting company that was with that offered Onley payment in U. S. Dollars eso. When my credit card got charged, I would have to pay certain extra fees because thea amount was in U. S. Dollars, and it calculated the exchange rate really badly, so I was just paying too much. So I just switched to go Daddy, and they had this multiple currency option. Um, never go for fancy stuff when I'm, um, choosing a Web hosting company as long as it works. And the the offer is similar to other Web hosting companies. Um, that's ah, that's good enough for me. As long as the site works and it's up, I don't have any any preference or ah, or any Presumptions about the company. So go Daddy is finally that they're a big company and ah, they I haven't had any problems with them. I recommend them. So once you get to the go daddy site, all you do is go to providing that you don't already have hosting or a a, um, domain name. Just go to the hosting right here and go to a Web hosting once you're at Web hosting and you think you're just going to make one site just go for this economy package here, which is for 99 a month. Now that is 4 24 months. I believe this price. So you'll see later the different options. There's a deluxe here where you get under limited websites and limited storage and so on and so forth. And an ultimate package that Ah, I forget what, Thea Two times processing power and memory. But if you don't have a very large site, you don't need that. So let's just go with the economy package. This is some more options that you don't really need. For now, if you're just building your site, you can always add them on later, so click continue. Ah, this is where you find your perfect domain name. So type in what year? What you the domain name he would like with the extension. Ah, they've got a whole bunch of extensions here and you get to choose from even more after that. So let's say Ah, let's see. I could go with flamboyant flowers for this is just an example dot c uh, let's see if that dot com is available. Search? Yes, it's available, so I could actually ah, by that domain and use it for a website. So this is what you're order Page should look like. You have the economy. Lennox hosting with C panel 12 months, which the unit prices 6 99 a month, and the 49 I was mentioning before was for 24 months. So you have to kind of make a decision whether you want to get that for dining at a month, Price or ah, you want to I get the 12 months because you're not sure if your websites gonna be up for that long or they also have monthly plans for 7 99 a month. So the price goes up, the shorter the duration is Ah, for my last website I got there. I just paid for the 36 months so it locks that it locks that price in, Um, I don't know what the billing is after that period, but this is the best. The best price. So I guess for now, just, uh, just we're just gonna take the 12 months. This is all in Canadian dollars. So 6 99 a month times 12 months. That's 83 my domain flamboyant flowers dot com Ah, $00. And this is just a This is just a an example by the weights on. And here's a an option to make my domain private. Also, more charges You could just keep public. And, um, you have to be sure that what's on your order page is just the hosting and the domain, because they're gonna try to up sell you on all kinds of things, as any Web hosting company will do. They offer you by more domains with the different extensions like dot net dot ceo dot info . Of course, you probably don't need those. There's just extra costs. So Ah, that's that's about it. All you have to do now is proceed to check out. And if you don't new to go, Daddy, you press. Continue here where you fill out your info, address and account information with user name and password, um, email address. This is very important that it's, ah, a working address because they will send you information. Ah, once your payment goes through of your account details of how to log into your your C panel . So here is some options credit card PayPal to pay your Web hosting and domain registration . So I'll let you get to that and I'll see you. I'll show you what the email looks like Once you've done all this once you've done this process 4. login to wordpress admin: All right. So now I'm gonna show you how to log in to your WordPress administrator panel to make changes to your website. So you go into your browser. I'm using safari, but it's the same process for Google, Chrome or Firefox. And basically, what you do is type in your domain name, so it will be www dot your site dot com So I'm gonna dio I'm gonna type in mind. It's going to it is home. Here we go. I'll just delete this right home Fitness not session Fiddler on dot com and Home Home Fitness is my sub domain I've created and it's kind of piggybacking on session fiddler dot com, which is the domain now. So after dot com or not, See a or dot net Ah, what have you've chosen? You would type in a forward slash WP dash log in dot p h p. All right, Make sure you see that. So whatever the extension you have dot com dot c dot net forward slash WP dash long in dot PHP it enter and you'll be right to this page on. I have something really handy. Ah, installed on my browser, So let me just log in here, Okay? This is called last passing Next, and you see it. It's an extension. Meaning it's a little plug in that you can plug into your Web browser and last past stores your passwords so you don't have Teoh, right? The mountain. Remember them every time. So with last past, all you have to do is remember your master password and then last word will populate anything like this where you see a little star, you'll be able to click that and select the rate website. So with this, it's already found the right one, because in your index for last pass, you just have your u R l here and that's associated with the user name and password, and it's really secure and things that are really, really secure. I don't put in it just because I remember them. So with things like websites, I think it's a good, good option. So after you feel that out, just hit log in. And there you are in your WordPress administrator dashboard. So you got your website here? Um, here we can do new posts, add media links. New page at a user will get to those steps. And here is your administrator. Um, with your administrator name, you can edit your profile and you can long out so long out, and we're back to this page. 5. about passwords: so I just want to clarify some things about passwords. There is one password that you got from your Web hosting plan. That's to log into your C panel. It's the user name and password you created when you make made your purchase for hosting and your domain name. Now the one that you got when you're setting up your WordPress blawg When you did the installation within See Panel, that's another user name and password. So you should have two distinct user names and passwords. 14 the C panel and 14 your WordPress, um, editor. So the way to get to this screen here that you see to use the user name and password that you created that you created when you install the WordPress, you simply type in your domain. Ah, if you bought your domain, it should be www dot your domain dot com or whichever extension that you chose forward slash WP dash log in dot PHP and that will bring into this screen. You can type in your user name and password and log in Now. Since I have a sub domain that I'm using on this domain, I don't have the www eso It just says home fitness dot session fiddler dot com And that's this is gonna This information is going to be different for you. But what will remain the same is the forward slash WP dash log in dot PHP. So once you have that filled out, just hit log in and you'll be logged into your administrator section for your WordPress site. 6. WPC 6 How to log in to cpanel: So right now I'm gonna show you how to log in to your C panel. See, Panel is used for anything that relates to creating a sub domain, creating creating an email with, for example, info at x y z site dot com Anything you want to manage in the back end of your website, you log in to see panel for and anything you want to do with the Web pages themselves. You go into your WordPress administrator panel. So here were at the go daddy dot com site and we're gonna click sign in. And right now, I've got my, uh, customer number and password filled out its sign in that's going to sign me in. And now I get to this page here and I'm gonna do is click on Web hosting and manage That's going to bring me to this page. Why? I see this my main domain here. And, um, it's a C panel here. Click Manage, and it's gonna bring me straight to see panel in just a couple of seconds. There we are now. I mean, see, panel and I can go into my WordPress here and see all my installations here. Will this tab. It's called my applications. Hit that. And I got Oh, my websites here. So that's it. That's how you log in to see panel. 7. WPC 7 create subdomain: Now, if you want to follow along exactly with every step that I'm doing with this fictional a site called Home Fitness, I suggest that you create yourself a sub domain, and it's very easy to do and show you all the necessary steps to do it. So if you're but you're hosting from Go Daddy, just go to you. Go, daddy dot com If you're with another company, just go and follow the steps. Pretty similar. All you have to do is sign in. I've got my last pass filling out my user name and password, so I'm going to sign in here. Okay. Lets asked me to fill out a survey. Distress no and navigate to Web hosting. Once you're in web hosting, it's gonna tell your human domain and you're gonna click Manage, that's going to bring you to you see panel. So this is gonna make it so that you can, ah, work on this exercise. Ah, and you're gonna be able to construct your riel site some simultaneously without having to purchase and extra domain. So here, we're going to navigate to we're going to navigate down two domains section and then we're gonna go to sub domains. Okay, so here, I'm just gonna name it. Test. You can name it Anything you want. You can name it home fitness dot your domain dot com. So ah, And here, if you only have one domain is just gonna display one domain. I have a whole bunch of them, so let's see. I'm gonna speak. Pick this one. Ah, document root. It's gonna Otto suggest something for you. And just leave that as it is, so just hit, create. And now it's gonna create that sub domain on your server. Now go back to home, click home, and now we're going to install wordpress that sub domain. So now we're going to navigate to install this application, and here it says location. So now we're going to choose your sub domain to make your test. So now you should have two to pick from in your list. I have a whole bunch because I have a whole bunch of domains and submarines, so I'm going to go locate the wanna just created, which is test don't session feeler dot com. Ah, directory. You can leave that as blawg. Ah, or take it off. I usually just take it off. Um, it's up to you, Really? And here are some user names and passwords, but you can access all this through See panel. So, um, for me, personally, I don't bother writing it down. If it's just a sub domain or a test, it's not that important. But you can always change this information and keep it in your records. So at this point, just click install, and it will process. Which means that in installing WordPress onto your some demean you've just created and you're some domain will be in this list. Here, you just have to go into applications and then your submarine will, and then your new site, your test site will be in this list right here. I forgot to name mine, so a. But I know that it's this. It's the right one because it's named test dot session fiddler dot com forward slash blawg . Okay, so that's where you can test out all this stuff that we're learning and you condone. Build out your riel website on your real domain right here in parallel eso. That's where you can have test site and a rial website. And by the way, you can have as many sub domains as you want, I think with depending on your Web hosting plan. But it's a really neat way to testing things out. And, um, Teoh keep your learning separate from your wheel riel website that you're pointing everybody to all right. 8. WPC 8 Change your admin password: So I just want to show you one more thing before we get started with that designing your Web site. It's how to change your administrator password. Maybe you ended up with something that was auto generated and really hard to remember. And so if you want to change that, just go up to this right hand upper right hand corner and click. Edit my profile, and you can also access this page by going to users and your profile. Same thing. So just scroll down to this place where it says account management and new password and click the generate password. Now the WordPress is going to generate a new, um, very strong password, but you can change that to anything you want. If you want to change it to something that's really easy to remember, you can do that right here. Or, if you change your mind, just hit. Cancel. So that's about it. And then, once you're done, don't forget to update profile because if not, you're a new pro New password won't be saved, so that's it for how to change your password. Once you're done that, just head back to the dashboard and, ah, weaken. Get started with editing your new website 9. WPC 9 Customize + donate: So now we're back in the administrator dashboard, and I'm going to show you where everything is customised in regards to the theme. So here, go to appearance. Ah, and right under themes you're going to see customize. So click on that and you'll he led to a page like This is it's gonna open up. And these are all the settings in the customizer theme. So it's a really generous amount of customization is and these are all sections under the sections. You can go and customize a lot of things so you can take a moment and just browse around, get familiar with the different titles. And, um, there is a bit of jargon in there. So I mean, if you ah, if you're not familiar with things like sidebars or footers or menus widgets, we're gonna be going all over all that. But just take a moment to you, browse around this section and get familiar with the terminology. What's great about this? Um, this theme is that in this page, you're going to see your modifications right away, so I'll show you an example right now. Ah, workout. Nutrition mindset is my tagline. So ah, how about training. Change that to equipment, and you see the modification of made is right there. You don't have to jump back toothy front end of your Web page to see that this is a free theme. There is a pro version that has, um, a couple more things added on to it, but for a free theme, I think it's really it's really quite extraordinary, and it gives you an option to donate here. Eso Maybe once you've gotten your site up for a while and you start using it and ah, it's working. If it's really working out for you and you like the theme and you've gotten some, ah, some traction with your website, see if you can donate a couple of dollars. Eso Here's a PayPal button, and once I click on that, it brings me to over people and, ah, here it's gonna you can put in your donation about so you can put it in just a couple of dollars to help out the developers. So that's what I wanted to show you about that just that's this Ah, section here to customize your customizer theme and press on this little X, and that's going to take you out of the customer customizing section of the theme and you're back to your WordPress dashboard. 10. WPC 10 installing your theme: The very first thing we're gonna do now that we're logged into our WordPress administrator section is to install a theme. Right now, we don't have any theme installed. So if I go up to here, that will redirect me to the website as it looks now, Theo Internet and you can see there's not much going on there. So just go back to your website name Hit dashboard, and we'll go down to you. Appearance and themes. Okay, now we're gonna go hit, add new and search themes, and you're gonna type in customizer and note that it has a particular ah spelling. Here it's finishes and said Are So here's the customizer theme and you just have to go down to install hit Install, and it will install on your Web server. So just wait for a minute for that to load. It's installing the files as we speak. So once it's finished installing, you'll see a page like this pop up, and all you have to do is hit, activate, click on activate and they're your theme will be installed. And here you're gonna know which theme you're on because it's gonna say active and customizer so That's how you install your theme on your WordPress site. Now to see what just happened there in the front end, go to your site and you see a whole bunch of things that changed and your website and tagline are there. 11. WPC 11 wordpress install: great. So now you've purchased your hosting, you've purchased your domain and you've opened up the email associated with your account. So just go and log into your email and find that those emails that from go Daddy with your log in information so you should have an email with this type of address. See panel support at goatee, Not go, Daddy, don't come or a similar, and this will have your log in information you'll get. You'll probably get a receipt and a email from C panel support. If you don't just check all the ones that you got from Go Daddy and one of them will have you log in information. Just make sure the the address says Go daddy dot com and one of them will have this information. So here we go. Um, it says You're hosting is ready to go. It's time to get started. Building your site. Sign in to see panel. We've got our customer. I d hear my user name the domain name servers, which is information that is very technical that you don't need right now. But a slowing is ah, you have your domain here. Verify that that's correct. And the password is the one that you created when you purchased your domain and hosting. So hopefully you've written that down. And now all there is to do is sign in sissy panel. So click this link right in the email that's going to open up a new tab and filling your information here, Click log in. And now you're going to be logged into the main domain of your hosting. Now, mine happens to be cutting go dot c A and you have two choices here, manage or settings. Let me just show you the settings tab. What's in here? Just wait for it. Load. So here, my main domain is counting go dot c A. And I have I actually got the second hosting plan that lets you have unlimited domains on a single accounts. Will have three active domains right now, so I can choose to switch the main domain of my account. So if you upgrade your plan or if you choose the unlimited one and you want to switch the main domain, this is the place where you can do it. Switch your C panel password reset account. You don't want plus this because it it. Ah, I think it erases everything. So stay away from that one data center. So if you're based in North America, you want to keep the North America when that's the default. One. If you're in Europe, choose Europe. That just makes your site a little faster. Load a little faster for the people in those areas. So let's log out of this. And now we have to do is kit manage? And that will bring us to see panel now See Panel is also known as or is part of the back end of your website. Now the back end of a website is the place where you manage things like images, text anything that goes into the management of your website. The front end is what the user sees on the Internet, so just get used to distinguishing between the front end and back. And it's a terminology just to make things faster. When you're talking about Web design, Uh, just I just want to catch ah, show you. Ah, quick, quickly what the C panel is all about. You're going to get used to navigating in this pain because you're going to see it often and um, you have a lot of choices here of things to do. You probably won't see all of them in your Web designing experience because there's a lot. There's a lot of things here, and some of them are very advanced. But, ah, for example, here, this is the file manager, and this will give you the files that are on each domain. You can actually access all the individual files. So these are all of these files, and I could click on one and download it. If I want. I can access that different domains that I have on my account. So that's just example what you could do with C paddle. Let's close out of this. And but for now, all that we're concerned with is Web applications. So go down to the section you got files, preferences, databases go down to Web applications. And if you're in, if you signed up with go Daddy, this is what you're going to see. If you signed up with another hosting company, most of them use steep panel, so you'll see something very similar to this that colors might be different. But it's essentially the same thing. If you're not using C panel than you probably have Most Web hosting companies will have a one click WordPress install. It's pretty common these days. So Web, lack of applications hit WordPress blood. And what we want to do is go to install this application. This button right here on the upper right hand corner. Okay, this is gonna bring us to the install pain. So we have our location, which domain? We're going to install it on. So I have multiple domains will have a long list of domains here that I can install it on. But if you've just purchased your plan and you have that one don't mean that's included with your plan, you you're just gonna have one on this list. I'm going to church, choose the one that I created. So that is a sub domain. And a sub domain is like a domain that's piggybacking on another domain. So the real domain I have is www dot session fiddler dot com. And I've created a sub domain that saves me from paying the registration for a domain to create this course because I'm just creating a fictional website to show you, uh, the amazing things that the customizer theme theme conduce. Oh, and the amazing things that you could do with that. So this is the sub to me that I created. I miss like that. This is the directory. Ah, it's kind of technical language, but I usually delete that. So the directory will just be It says right here. Home fitness dot session filler dot com. And this is your WordPress version language. If you're in a using and another language other than English, you can select it here. Ah, you can always change these things later. So you're not gonna be stop stuck with it. So here we go. And, um, here's some important information here. Administrator, User name. Um, so you wouldn't want to write that down. You can also create a new name and an administrator password That's toe log into your account, your email and the title. You can fill that up, fill that out right now title of your website. So mine is called home fitness and fill out your tire lines, so ah, I mean a rate. Um work out nutrition. Trish Yoon mindset. There we go. So the rest you can you can leave on default. So once you've written down your administrator, user name and password just hit install, and this will take a little moment to install and C panel All is doing now is copping all the WordPress files to the directory you mentioned. So we've got installing right here, and it's installed. Now you have three options. Here you have go. This first option is to go street to the domain and let's just click that and see what happens. So not much going on there because there's no theme install. There's no there's not really anything installed. 2nd 1 is where we do our administration. And here is ah WordPress support with, ah, a discussions on different facets of WordPress and problems that people encounter when they're doing their blog's or Web sites on WordPress. So the one you're mainly gonna uses this one. You can access the website through this anyways, so you're probably always gonna be clicking this one. Other things to note here that are really handy is this little wrench Here is view at it, details. So here we can go in, and all every all the information that we entered in the first time we can go in and manage . So things like title language and so on and so forth. And we can also choose to back up have automatic backups of our site. So, Savo, um, other things we can do is what we will go into it. Now I'll go into another section, so go ahead and click on this second link and you will be will be able to access your WordPress panel. 12. WPC 12 Change skin color + tagline: Okay, so let's make the first change to our website. So from the administrator dashboard, I'm in this dashboard section here. We're going to navigate to appearance just below themes we have customized head on over there. And now we're going to change the tagline, this tagline Over here. So under site title and tagline, we're gonna keep that site title the same and we're just gonna change this to integrate fitness into your household. So integrate this into you're household, okay, and you can go back, and we're also going to change the colors. And another term for colors is skin. Any time you see em A like a video player or something like that, this has, like, uh, artwork or buttons around it, and you can change the the color scheme that's called the skin. So the skin is basically what the general appearance of the website. So here it's got some colors that we could use room. I'm gonna go with this nice deep green, and you can also randomize the skin so and the next couple of videos we're going to customizes slider. We're gonna be able to add our own images and replace the text and have it 0.2 pages we want. And we're also gonna be modifying piece this featured pages section. So what's great about this? It's telling us exactly how big these images are supposed to be. So this is 270 pixels by 250 pixels. So I'm gonna show you how to get your images down to that side so you can fit them nicely into here. And, um, basically featured pages is basically like a navigation that you would have here if you have your navigation here, like your home, your about page or contact page. Um, the featured pages kind of works in the same way you can have thes whole areas link to a page. So if you click on this image, it would send you to in any page that you want that you link up to this picture as well as this button, and you can change this text as well. So right now we're gonna go and ah, exit out of this now to save your changes you made in this section. Just hit, save and publish. Now it's saved. We're gonna click out of here by clicking on this x and then we're going to go visit the front end of your site. So we're going to go to our site name here and visit site. And now we see that we've changed the color and we've got Earth tagline here, which is new. So that's your first couple of changes to the site. And to get back to you are other changes that we're gonna make just head on over to dashboard. 13. WPC 12 create page img and text: So now that we've got most of our house keeping out of the way with passwords and setting up our WordPress site, we're ready to start creating actual pages. So we're going to navigate to the pages section here, click on pages, and then you're going to get two choices go for add new click on add New. And here's our new page. This is gonna be in about US page about us, okay? And the first word thing we're gonna do is we're gonna want to add media. So since that we don't have in any media in our media library yet, you can check that out. Uh, we don't have any here. If we go into this tab, I don't have any images or anything, So we need to go get an image, and I'm going to show you a great site where you can get free images, but you don't need to reference or give credit for their totally free. And the site is called picks obey dot com. Okay, so P i x a b a y dot com. So head on over to there. And here's a place where you can download high quality images so I'm gonna type in the word fit in this and let's see if it pulls up the image that I want. So I've selected this image and I have an account with picks obey. And it means that you don't have to fill in any capture details once you want to download the image. So all you have to do once you find an image that you like is click free download and their size I recommend for a website is 12 80 by 7 20 So this is a good size because you will really have to use a size bigger than this. This is the image at pretty much its full size. So on your website, this is unless you have some requirement, you won't have to use this size. So that will make it that your site will load faster your images of load faster. So click download. Okay, Now we're going to go back to our other tab here, and I am going to you click on add media again. So now I have that picture that I want to put into my website. So I'm gonna go select files and this goes to my directory. And just make sure you know where your files are being downloaded onto your computer. If they're going to your desktop, where they going to the download folder. Make sure you know where that ISS. So here is my file, and I'm gonna say choose okay, and then I'll have to do is press insert into image. Now, by default, this image is sent to know alignment. And what that means is that the text will not wrap around it if you put text. So if you want to change that, we're going to change that. All you have to do is right. Click on the image and you'll get these options. And if I hope hover over that, it will indicate to me what these little icons actually means. So you have a line, right? You have a line center you have line left no alignment. You can edit or remove the image, so we want to align left and there we go. So let's go ahead and add some text to our page. I would refer you back to the download package of this course, and in that package you'll find a file called Home Fitness. Tex dot txt. Just double click on that. It should open right up on the Macintosh with program called text Edit. If you're on a PC, I'm not sure what program it opens up with, but it's ah really universal type of file. So it should open right up with, um, one of the applications in your computer. So I just grabbed the first portion of text right here. Copy that. Go back to your WordPress editor. Click on that page and peace the text. Now, right now, sometimes the WordPress changes Theologian mint back to center or no alignment. But all you have to do is go back to the image. Right? Click on it. Let me just do this again. Right. Click on right. Click on the image and it will bring up these Ah, these icons. And then you can change the orientation of your image. That's a right alignment. You could have it center, or you can have it left. So if your text doesn't end up on the right side that you want, just go back and check your image and make sure that the alignment it's still set toe left , and also you can check exactly what's going on. If you go back to your text editor here, you'll see the HTML for your image. You'll see here it says a line left. And whereas if we changed it to the line right right here, you would see a line, right? So let's just change that back the left. Now, once you've made those changes, you're already to publish your page. So just click this button. It's either going to say publish or update go hidden. Update that, and you're going to be able to view your page right up here. So hit that and we've got our website home fitness and the about us page. And this is there by default. We're gonna set that as we want a bit later. 14. WPC 13 Link to any page of your site: You can also link images to anywhere on the Internet and in the same way as you would any portion of text. You just need to go to the image of her over it and click and then hit the insert link button and type in your You are all that you want. Copy paste that and pieced it into you. Look right here and click. Apply. Okay. And I'm just gonna remove this link so I can also link to any page of the site with this picture or any text link or any picture link, and I'll show you what I mean. So just click on your image, go to the link button, and here you'll see a little gear wheel for link options that's gonna bring up this little box. So here is the destination. You are l that's the same thing. Is the bar that was there before you just add in your you are l like C b c dot C a r the www dot c b c dot c a. Or you can link to a page in your site. So this is the default kind of a mock site on my excuse me a mock page that's comes with your WordPress installation, and I can add link for that. So now when I click on my image, so we're gonna have to you update it first. So now I'm thinking view this page, I'm gonna click on this image, and it's gonna bring me to that other page that WordPress created when installed the theme . This comes installed with your WordPress theme. But we could remove it, and I'll show you how to do that later. So there you go with a couple of functions of the basic editor inside WordPress. 15. WPC 13 wordprocessor: So let's take a little walk around the text editing functions and your basic functions inside your editor in Wordpress. So here, with this section of text, I can do what A lot of the same things that you'd find in a regular WordPress, sir, sir, Like, word Aiken. Bold attacks. I can make it metallic straight through. I could make it a block quote and insert horizontal line. I can align the text left or right. But since we've already learned, that's ah, it's not going to affect this. Also, what's interesting about this is Aiken, insert a link. So let me show you how you can link to you any page on the internet. Um, you know, go to CBC news, and I'll copy this u R l here. And then I will paste it in this bar for the link option trophy, and I'll hit. Apply. So then, when everybody who over hovers over this, they're going to be taken to CBC News. That will be, um it will open a new tab. Oh, my God. Prince died. That's terrible. Well, ok, eso that's for links. So I just removed that and you can have fun exploring the different options here. I'll just show you one more. If you're creating a list, then you would go to this tab here and create a list enter and is gonna put your bullet points. So that's pretty common in websites. So have fun exploring with that, and I'll see in the next video. 16. WPC 14 upload to media library: So what we're gonna do now is upload the images that you've downloaded from the course in the course materials. We're gonna take those and upload them to the media library. So this makes it really fast to insert images into your pages because you just have to grab them from this library that's already uploaded. You don't have to go browsing around for them on your computer and uploading them one at a time. So what I'm gonna do is I've navigated to this media section and you're gonna hit, add new. And here I have two options. Dropped the files anywhere to upload or select files so you can drag and drop into this box area or select files. I'll just select files. So here I have my home fitness images. I'll just select them all and choose. So now they're all uploading. So if you don't have these exact images, don't worry about it. I've These are some of the images that I might choose to make the site, but your folder might be Sepp might be different. I'm just gonna be putting in the ones that I end up using into that folder, so just wait for them all to upload. And there you have your media library. Now, in order to access this, all you do is I'll just make give you a quick example. Here, here's the last page. We're working on the about us page and I go here, hit, enter and it add media. And then you have two choices here upload files that straight from your computer or the media library. I can choose this yoga mat here and here I have ah, a lot of options. Ah, a caption. That's a little short description that will appear below the image. I can add a description if you had a description here. It helps the search engines references or sight better. If because Thea, um search engine doesn't really recognise what this image is, it doesn't really know it's a yoga mat. So you could se yoga mat sports fitness keeping fit. And here it's got some display settings, like the alignment linked to media file and so on and so forth. So insert into page and there we go and I want to show you another option that you have with this. Let's go to admit he again. Choose this nice exercise, bought a ball, and here you can go and choose the size. Now it's the last one. It selected the medium size. So remember the all the images are downloaded at 12 80 by 9 60 from from picks obey. So I'm gonna choose the full size here and watch what happens. It's gonna put in the full size image into you. The page and Aiken choose to center this or align it left line, right or no alignment and usually no alignment. The default is a line left, so there's a little quick review on how to populate your media library. It's asking me to Here, it's asking me, Teoh, publish the page. I'm not gonna do that. So now your media library is populated with all these great images that you can just grab from when you're designing your pages. 17. WPC 15 content workout page: So let's go ahead and start creating the pages in our website. So from dashboard, I got to go to pages and add new. So we got a blank page here. We're gonna enter the title, and style is gonna be called. We're gets. So I've got some text for this in the text file that's in the materials, Vile here. Home fitness, tex dot Text Txt. Sorry, and I'm just going to grab the workout page text here. Copy. Piece that control. See and control V right into my page. Okay, it enter. And now I'm going going to add media. So I'm gonna try to find this. Find this image here, this workout image now the here it says the U. R L title. When the caption I entered this before it says, Don't give up. So that's gonna appear on the There's a really neat carousel that's going to display your images when you have multiple images on a page. So that's gonna display under the image when somebody's viewing on that carousel. So here I'm gonna add a description for search engines to recognize this image. So I'm gonna work out at home, Okay, Alignment. We'll be set to none linked to media files. So make sure you're linked to is set to media file or else the carousel won't bring up the image. So insert that into the page, and right there, I'm just gonna hit enter once, and I'm gonna get I'm going to You go ahead and insert another image, this little boy on the exercise ball and just make sure I've got a caption. Are you written here? Exercise with simple equipment and I'm just gonna write X, sir Size. Well, there, Lyman. None linked to media file. And there's, um I could set this to known. I could set this to media file attachment page and a custom your ill Those are my options. But for the carousel toe work, it has to be Ah, Link has to be to the media file. Okay. And insert into page. So there it is, right below it. And now go ahead and hit. Publish and hit view page that's gonna bring me through the front end of the site. Okay, Now, I've got my nice page called workouts, and I've got my images with the captions under them Now watch what happens when I click on this image, it's gonna bring up this lightbox effect, so it's got a nice shadow around it, and it's got the X up there and magically, it's. Since I have two images, you can have two more. Two or more images will create this carousel, and I could navigate back and four words. So if you have more than like six, let's say, for example, you have 10 images on your page. All your images will be loaded up into this carousel, and you can turn this honor off in the customizer preferences. So there you go with the workouts page. 18. WPC 16 content add other pages: Let's go ahead and add two more pages to you are site so I never get to pages here. Add new and into the title Appear this one's gonna be called Nutrition and just go ahead and grab the texts from the home fitness text file. So I grabbed that copy, paste it into your page right here Gov and just hit. Enter add media. Let's put in the nice bowl of strawberries and you are else here, Um, caption but as well, just add a caption. Uh, What? We only have one image. So we're just gonna add the descriptions Strawberries, Okay, alignment None linked to media file and full size. Insert that into page and I'm gonna new now is published. So that's published. I'm gonna go ahead and add another page. This one's gonna be called my mindset. So same process. I'm just gonna go copy this copy and peace this texture Copy on and pieced, right. And then insert a media mindset. We're gonna use this image here, so all the settings air the same. Go ahead and add a description Mind set. Here we go. Alignment. None linked to media file. And I'm gonna keep it at full size insert into page and there we go published that. So we're gonna go ahead and create another page. So we're gonna go to pages new. We're just gonna name this one whom and then in the in this ah text field, we're gonna say this is are a wonderful home page there and published that. Now we're gonna go ahead and create another page, and we're gonna set this to be our blawg page plug. And that's all you have to do for this. Just fill in the title hit publish, and we're gonna create another page. This one's gonna be our contact page. So we're gonna right contact this and there we're gonna fill in the content leader so it publish and we're gonna go to our site here, and you'll notice that nothing has really changed. We I don't have any featured images. We don't have any posts going on. We don't have a carousel and we don't have a menudo. We don't have a way to get to any of the pages we've created. So we need to create a menu so you can either manage it through here and the great thing about customizer when you first install it. When you first open it up, It's got a lot of little hints that direct you to the proper section, where you can modify exactly what you're looking at. So I can I can navigate to this. It says, Manage your menus in the header. Now click on that. And here it says, Which menu to assign? So the main menu is there now. What happens here is that I haven't created a menu in my WordPress back end yet, so I can't really modify any of this. So we need to create a menu first, and I'm going to describe that in the next video. 19. WPC 17 create a menu: All right, So now we're ready to set up our menu. And for that, we need to go down to appearance, go to menus. So here we get to this page is the first thing we have to do here is named the menu. So since the site is called Home Fitness, just type the later H letter F capitals and I'll see HF menu. Next step is just to click on create menu here on the right. So now it's created my HF menu. So here on this in this little box area, we see that all the pages that we've created, we've got contact us blawg, home mindset, nutrition workouts about us and the about the default about page that wordpress ah inserted to our site as a sample page. Now we just have to click on the ones. Actually, I'm going to show you something else. Ah, we're going to select all even the sample page that we don't want add to menu. So it's created this menu for us now, the one we actually created was about us. Now this page here we click on this triangle toe open this box and we have the option to remove this another. Another option you have is to go and change the actual label. So instead of about us, Regan, and just have about and you would just click it Ah, I could get back up like that to close this box and save menu once you're ready. But for now, I'm just gonna leave it as about us. The other thing you can do in here is rearranged all these items thes menu items. So I'm going to move my contact us right to the end, the home appear and just be careful that you don't move it to the side because then you're going to create a sub menu and we don't want that for now. So home blawg, maybe we'll move down to here. There. I'm happy with that. Now. The theme locations, we're gonna want it as a horizontal menu. That's the typical menu that you see in a website. So save menu. Okay, so now we've created our menu, will go to visit our site here, and it's created our menu with the about page and we'll click on all of these. There's our about page. There's about us, actually that the there is one step. It's see it. It put it in this about which we didn't want. That's because we didn't. We forgot to do one step and I'll show you what it is we go down to customize here, and this is gonna be We're going to customize something in the header. It's in navigation menus. Okay, now the reason it's doing this is because there's an extra layer of configuration in the customizer theme, and it's it's all handled by this section, and I had trouble with this when I first started. But it's it's this little selection that will make it so that your menu items actually reflect what you chose. So a sign menus to locations. Your main menu is going to be the one that we just created the HF menu before it was just set to nothing. So it didn't really know what to grab, which design that we want the regular. This is the horizontal and your other choices aside, menu vertical, and it will look something like this. You see this on sites more and more sites that wanna get rid of clutter and things like that. There's a little pop outside button and you can go to any page like that. So for now, we'll just keep our menu. Um, regular horizontal. Let me see if there's anything you have to change here. No, this is all pertaining to sub menus. So we're done here. Saving publish that saved. Let's go check out the actual front end of our site. And there you go. We have our home page. We have our mindset page. We have our nutrition page. We have our workouts page. We have our blogged about his page and the contact ISS. Now, remember that in these pages, contact us and block. We haven't actually created any content, but we'll be getting to that. But we added contacts, content for workouts, nutrition and mindset. So that is how you create a menu within the customizer theme. 20. WPC 18 create a submenu: All right, Now we're gonna set up a sub menu, so navigate back to appearance and go to menus. So what we want to do is create a one a group thes three pages under one heading called Body. So what I'm going to go do is go to custom links. The link text is going to say body, and you were l we could have this point to any any Web web site or a Web page that we want , but we're not going to do that. We're just gonna type in the pound key, and WordPress is going to know what to how to interpret this pound key. So we're gonna add that to menu, and the body is going to be right here under home. So reposition that now what we want to you have within the under the body menu section is the mindset, nutrition and workout. So all we're gonna do is distract that to the side of it and let go. And now it says, sub item. So that's what we want. We want to move this 12 comes, becomes a sub item. And with the workouts to So now we have three pages under this body. Ah, menu title. So click on save menu and let's go check out the front end of the website. Go up here and click on home Fitness. So this little box is just telling me that Ah Aiken view this menu as a vertical and mobile friendly side menu animated when revealed. So it's just a notice it doesn't actually appear on the site. So I'm just gonna click out of that. And now I've got my home, I've got my body and remember the settings there. Certain settings in the customize customize it. Ah, section of the of the of the back end. So you see that this is a pretty cool effect when I come over here and first of all, they just lighten the color lightens and over this sub menu, it's got this little pop up, and it's all nicely animated, so I can go to my mindset page and I can come back here and I go to my nutrition page and I can come back here and get again and go to my work out speech. And the awesome thing about this site is that that it's called a sticky header. So that means that when I start scrolling down the page, notice what happens to the to the This whole header section is called a heather header, and what happens is that it shrinks and it stays sticky. That means it stays stuck to the top of the page. So even if I'm down here, I don't have to scroll all the way back up, which is, ah, time consuming thing to do if you've ever been on a block blogged post or something, and you've had the scroll back up all the way up to get back to the menu. Usually sites have their foot or menus, but they're kind of hard to see because the writing is usually really small. But this is amazing feature of this customizer theme, and it looks really professional. So there you got your menu with your sub menu here and let's go on to the next video 21. WPC 19 create a submenu for page: So it's going to show you a different way to set up your sub menu instead of it having it attached to a custom link here. We're gonna attach it to a page. So what we're gonna do is just go over to this body menu item and remove it, and instead we're going to have all these pages just be a sub item of the home page. So save menu and let's go check out the front end of the site and see what it looks like. So now home has little arrow and we can navigate to mindset. Perhaps we could navigate to nutrition and we can navigate the workouts. But obviously when we click on the home, we can also navigate toe a page. So that's the little tiny difference between the sub menu that we created before where this top menu item was not clickable to anything. And these were all the leads to other pages. And this one where this is this home is actually a real page within your sight. So those are two ways to create this sub menu 22. WPC 20 set your front page: Okay, so now we're ready to create our home page from the dashboard. Here, let's go and click up here on the home fitness, and we're going to see the front end of our site What? It looks like, so right now on the front page, we have our header. You've got our menu, and we have all this demo stuff that comes installed with the customizer theme. Now, we haven't done anything with this letter. We haven't set up our featured pages, and the section that we're gonna be working on right now is this section. So right now it's it's loading up our block posts automatically. That's the default, what it set for? So to change that we're going to go back to actually weaken go right to the section that we need to go to, which is customised here. So go to customize and we're going to go into global settings. So once you're at the customize it Ah customizer window here, we're going to go down to you content right here. So click on content. Open that up. And then right now, what's concerning us is front page, so you have to set your front page to what the viewers going to see when they first opened up your site. So right now I'm arrest. I showed you that sample block post there because it's set to the front page displays your latest post. Now we want to change that, and we want to change it to a static page. That means a static page means a page that we've created. Now you see, it pulls up the sample page from WordPress, and now we select our front page, which is going to be. And here's a list of all our pages we've created and we're gonna set it toe home page. So right now, um, that's our home page. And for now, we have no sidebars for with the layout and her post page is going to be the blawg, obviously, but we have to set it that way and hit, save and publish. And let's go visit our site now the front end of it. Okay, so now we're at ah, front page, and this is the little sentence that we wrote in inner inner front pages that we've created is this is our wonderful home page, so we know that it's displaying that section. So we have other options in this front page. Let's head back to content here. I got the front page. Okay, so below no sidebars. OK, we've selected full with layout and this is called the Slider. We could also choose no slider so it would look like that We have our home page here, and this section is called The Featured Images on DSO Right now it's enabled, and we can choose to disable it like that. So all what we see now is our home page. So let's turn with those back on because we're gonna be modifying them in the next couple of videos. So select a French peach slider. I'm gonna move back down to Demo slider and let's see, there's an up into interesting option here, auto generated slider from your block posts. And now if you write a lot of block posts, that might get your visitor interested in checking out your material. So let's just leave it on the demo slider for now and turn back on this featured pages section so enable save and publish. And let's navigate back to our site here. And we've got our demo. Slatter, we've got our demo featured pages, and we've got our home page now. It's really small, but WordPress adjust itself because it's only and only it knows that there's only this much content. So that's because that's why your pages that high and so that is how you set your front page. 23. WPC 21 FI resize images pixlr: Okay, so now we're going to work on our featured images section. So we've installed our front page here. It doesn't look like much now, but this is it. This is our wonderful home page. And now we're gonna work on this section here. The featured images. Now, the featured images are basically, like links like this navigation section here. But instead of displaying just one word and linking to the page, it displays an image around image and a little bit of text from your page. Or if you want to make a description, you can write that and this little button. So let's go find out how to you customize that. So hit, customize, and you'll go to content and then go to front page. Now on front page. You're going Teoh, make sure that down here you're featured pages option is enabled, so make sure that's on in your sight. And that showed images is on and the button text says what you wanted to say. If it's in another language, this is where you can change that. Okay, so if you've noticed here, it's asking for 270 by 2 50 So if you want to display something that it actually resembles something we're gonna have to resize her images, cause if you put the full size image in there, you might not get something that you want. So in order to get something you want, you want toe center it properly. So that shows up well in this circle and that the viewer will be enticed to click on this and to spend more time on your site. So I'm going ahead over to pick slur dot com. And if you have photo shop installed on your computer, you can use Photoshopped to do this is well, but pick slur isn't online tool that's available to everyone with a computer and the Internet. So p x l r I'm going to search for that. And here it is. First, first result pick, slur. Well, okay, so this text isn't showing up for some reason, but I'm thinking it's this okay, it's the right one. I don't know why the text wasn't showing up, but ah, Bixler Editor. So this is an online tool. It looks a lot like photo shop if you've ever used photo shop. So this is where you can do things to your images for, um, anything that you need on your website. So here, I'm going to go to this option open image from computer, okay. And we're creating those featured images for three pages. We've got our mindset page, nutrition page and work out. So let's just start with mindset going to start with one page for now. And this is a PNG file with a creek clear background. So that's no problem for this. And what we want to do it is up here. It's his constraint. Right now. It's set to no restriction. So we're going to change that, and we're going to change it to output size. And the output size is we're gonna put the value that we need on our site, which is 270 by 2 50 So and this one, we're gonna pay it put to 70 and that was for the width. And for the height, we're gonna put 2 50 to 50 Okay, now that set. Now, by default, it's on this crop tool. That's what we need. So all you have to do is go up to this corner here and drag that over your image. Okay? And you see this grid, You can move this around with this round here, so make sure that it centered on what you need. So I'm gonna center it on this head here so that the person looking at that circle Comptel , that it's the shape of the head. So if I'm happy with that, the press enter and it shrinks down to the size that I need. Maybe I'm not happy with that. And just press control Z and that's control z again and do that crop again there. Okay, so right now Ah, all I have to do is save the image as mindset. I'm gonna have to change the name. So for featured images, I'm just gonna say f by capital F Kameli mindset format, P and G. Transparent, full quality. It knows what that is. Save it to my computer. Now it's gonna ask me where I want to save it. And I wanted to go to this home fitness images folder, So save it like that, and that saved. So that is how to do a a cropped image. So if you've understood that you can stop the video right now and modify your images. If you feel like you wanna, you need some more hints than I'm going to do a 2nd 1 here and you can watch this section of the video. So I'm one pixel. Er, just go to you open image from computer and I'm in my home fitness images here, and I'm going to you mindset, uh, I'm gonna do the second one's here. Sorry, I'm gonna go to nutrition. Got her. Strawberry's here, and my width and height are still set. So just set your output size. Make sure it's ah, you constraint is set to open size. They're changed it back, so my width is gonna be to 70 and my height is going to be 2 50 50 There we go. And I want my crop tour and drag my crop tool across like that. I've got a nice square, and that looks pretty good. Tell him and press enter and it's gonna shrink it down to you the size that I need. Now I just have to go to file save. It's gonna be as a jag jpeg. I just have to rename it something that's different from the original. So I'm gonna say F I nutrition for featured image. Nutrition quality is that 80? The formats good saving to my computer press OK, and it's going to my home fitness images fuller. So save that. So that's how you use pix slur to resize images. 24. WPC 22 set your featured pages: Okay, now we're gonna add the images that we've resized to our featured in featured pages section . So let's go to our front end here. And once again, this is the section that we're gonna be modifying the's air, going to be links that are going to go to our mindset, nutrition and workouts pages. So thes pages can be anything you want on your site. They could be pages that are not even in this menu. And you can move him around as you wish. So let's start doing that. Let's head back toward dashboard. Now, the way this works is that in order for the feature pages to to appear in your website, that page has toe have a featured image. And so now you should be at the step that you've resized your images and they're in the folder on your computer. Now you need to add them to your media library so that they're available. So navigate from the dashboard, navigate to the media library, and you're going to add new items. So here we're going to select files and you to find this home fitness images folder on your computer, and I need mine f I So I knew so that I would know how to easily find them. So I cosign select these three. It chews, and I got them here. So one thing about this, this, um, section here is you have different ways of finding your files notice here that I've got this image here, and I've got pretty much the same one here. So how do you tell these two apart with several several different ways right now, I'm in the the visual viewer here. Let's see if this gives me anything else that looks like it's kind of stuck out. Okay, this gives me that. Oh, right here. Perfect. So right now, I've got all my titles with my images. So Aiken tell which ones actually looking at this one is just called number one. And because that hadn't named it at that point, and I just named it I just named all these images numbers, But this one I've renamed, it's the one of Ivry sites. So? So there's different ways of looking at your media library here. It's just the images, and you can search by images, audio, video, and you can search by dates to Okay, so right now, the most useful thing for me is this f if I workouts. Okay, so we've added are resized images. Now we're gonna go to pages, all pages and what we want the page you want a workout is workouts. So we're going to go at it that page and what we need to do now is set the featured image right here on the lower right corner. So we're gonna click on set, featured image, and we're going to go to images. And strangely enough, enough, it's not. Let me I have that same views before, but I know it's that one. And I could make sure by clicking on it and checking the title, it's F I workouts J Peg. So that's the one said That is the featured image and click update. Okay, now go back to all pages. Now we used to modify our nutrition page, so click edit and we're going to do the same thing. Set featured image, and we got our strawberries here yet it's the right one. It's F I nutrition. So that's the featured image. Nutrition set that as the featured image, and we're going to go back to all pages. Now we're looking for a mindset page click edit on the mindset page and do the same thing said the featured image and the mindset is gonna be this one. We're gonna make sure it's really the one we're looking for. F I mindset. And we're not worried about anything in regards to caption or a description here. Okay. And hit update. Okay, so from here, once you've updated that, you just go back to appearance here and go to customize. And now we're going to go back Teoh our content section and in the context sent content section. We're going to find settings for our front page, and we're gonna go navigate down here where we have our Slatter options and then below we have featured pages options So our feature pages is enabled. The buttons says, Read more. Okay, now we have three featured pages to set. And what happens is that the little this'll it'll circle this theme grabs the featured image of the page to put in this section. So that's why it's important that it's resized and it's gonna be showing what you want. So home featured Page One, we're gonna set to mindset and it doesn't matter what order these air in 2nd 1 we're going to set to nutrition. And 3rd 1 we're going to set to workouts, find workouts in the list. There we go. So that's pretty neat. You get this, really? The zoom in effect, and like this one, you have no idea what it is. It looks like a hand and part of a knee. But then you see Okay, it's somebody coaching somebody working out, which is pretty neat. And so the next section is the description part. So the featured images section grabs automatically grabs some text from your page and puts it into this section as you notice here. But you can also type in for featured image text one. You can say something like this is the mind set page, and that's what it's going to show. Okay, so that's ah, option you have. But for now, I'm just going to leave it as is, and so saving publish. And now Lo, let's go check out the front end of our site and we've got our featured pages section right here, Pretty awesome. And what happens is that once you click on this image you go straight to the mindset page, go back. You can click this button for the nutrition. You go straight to nutrition and then you want to go toe workouts and then you see the workouts page pretty cool. So this featured pages section adds a really nice professional touch to your site. And I hope you enjoyed integrating that into your page. So have fun with setting up your featured pages and the don't forget that you can always turn this section on and off if you don't want to use it for now. 25. WPC 23 Intro to slider: Okay, so now we're going to modify or create our slider and let me just show you what the slider looks like. This theme comes with a demo slider. So this is it. Appearance that this whole section and you can manually care. Cell that images and let's see here I think there are only too easily and discover yet there are only two eso. That's it. You can put many as you want into the slider and they'll rotate. You can change the time. The timing of it. You can change the height, so let's go ahead and modify that. So in order to do that, let's go check out this customized section and under content you'll find front page. Okay, let's go Look at this one option here. It's under slider options. Right now it's selected to demo Slider. Now you can have no slider, and you just see the featured pages and our home page here. Get my advice bells back. Sorry. You can have the demo slider or auto generated slider from your block posts. And we don't have any block posts now, so we'll just leave it to Demo slider. Okay, so this image here is actually 500 pixels. Hi, by 11. 70 wide. So we need to go create some images that will fit properly into this letter. Because if we leave them some other size, it's going to resize the image and we might not get the outcome that we want. So really, the important thing is that your image is 500 pixels high, So also here you have the option of let me see here. Okay. Replace the default images. Height. Um, you have ah, you have the timing between the different slides, and you can set the height in pixels. But if you set the hiding pixels, you're going to have to change all your images or else you'll you'll have the theme crop, your image, and you might take out part of the image that you actually wanted. So, for example, in this slide here, you could have the the theme would might cut off this whole part of this monitor. So if you want to keep that, then you're gonna have to work with your images to so that they fit in the specified height . If that's confusing, then don't worry about it. We're going to get to that. So let's go and create those images. So we didn't change anything here. Did we change anything here? Oh, and this is also the full with slider. So for now, let's uncheck that and we're going to go with a fixed ah, fixed with which is 11 70. So there we go. Hit, saving, publish. You can experiment, Muth both. But for now, let's Ah, let's keep the fixed width. 26. WPC 24 resize images for slider: so, though, that we've selected our options for the slider. We're going to have to go and resize some images. So for that, we're gonna hit back to pixel. Er p x l r dot com. Okay, it's a moment for it to load up here. Okay, Open image from computer. So we're going to be making an image for the nutrition. So how about this? Nice bread picture? Open that and we're gonna constrained. Now it's sent to constrain. No restriction. So we're going to change that and set it to output size. Help it. Size will leave. It will set it at 11. 70. The whips 11 11 70 the height will be 500. 500. Here we go. And it's the same kind of processes before just jagger cropping tool over there. It's going to constrain part of the image. You want to get this nice banana bread in there and hit enter. So then it file save. And I got the bread and I could name this slider bread. Okay. And it's going to say it to my computer slider bread dot jake bag in the home fitness images. Now, once you do this you're going to have to upload them back to the media library so that you can choose those images and put them into your slider. So do as many as you want you can do. I'm gonna in the example I'm going to do three. But you could do more than that is long as their sized in there if you have the correct thing displaying it within this sizing. So if you want to follow along exactly with what I'm doing here in regards to which images I'm using, I'm going to be using this bread image, which already did in the last video. I'm going to be using this yoga mat image, and I'm going to be using this sunrise image. So those are the three images that I'll be modifying within pixel ER and integrating into the slider 27. WPC 24: Okay, so I hope your image modifications went well on pick slur. Now, what we have to do is add those files, those modified files to our media library. So we'll be navigating to media it over to the library. And I knew there's an add new option here. You could have just gone to there, but we'll do it this way. So select files and I go to helm fitness images. And I have named my three images slider, bread, slider, sunrise and slider yoga mats so I can easily find them. So I'll have to select those. And so, like those three and click juice, and they're uploading. Okay, so now they're in my media library. 28. WPC 25 install your slider: So once I'm in the media library, I see my slider Yoga mat. I see the slider sunrise, and I see slider bread. So these are all of modified images that have created So we're going to select this one slider, yoga mat. Okay, so this image is going to represent our exercise page. All we're doing that are sorry. Our workouts page. So all that we're doing is pointing people to that workouts page. It's like and think of it like a navigation link with a picture much like the featured featured images are featured pages, section. So when you first open this up, you're gonna have this slider options add to a slider and then says, add to its letter or create what if needed. So we're gonna slide that, too? Yes. Then you get this box opening up. So since it's pointing to the exercise Sorry, the workouts section, We're going to you name it workouts and at a little description workouts Learn fast and easy work at workouts you can do at home. Okay, Title in text color. You could modify that. And the button we're just going to say ah, find out more Teoh motivate people so that they feel compelled to go and check out this page. So choose Page or post a link to so we can have actually no link. If you just want the image with a description, you can do that, or you can link it to whichever page that you want. So we're gonna link it to the workouts page. Or you can also do a custom link and linked to you any section of your site. Open a link in a new page tab that's going to open a new tab in your browser and linked the whole slide. You can either choose no or yes if people somebody clicks on the image. It's going to bring them there as well as the button. So, uh, so this last option here, we have to create a slider. So we're gonna name it and it's gonna be named home fitness slider. There we go, and then add slider. So now we've created a slider with one image on it. So Teoh, update these changes Just click on update here on the upper right corner. So now navigate back to the library and we're gonna add our second image to you the slider . So it's this sunrise. And so when you open the page it's going to say onto a slider, You're going to say yes and then the title text. This is going to point people to the mindset page, and then you can type a little description of it. I typed, Personalize your mindset and the button texts. You gun right? Find out more or read more and it's going to point to my mindset Page, I think the whole slide, yes, choose a slider. So we got the home fitness slider. Now you can create multiple sliders to with the customizer, uh, customizer theme. So all we have to do now is update this image and we've just have our third page to add Third Image. Sorry. So that's going to be this bread image, and it's gonna represent it's gonna point to your nutrition page. So here, under add to slider, we're going to see Yes, it's gonna open these options. And instead of slider bread, which is the image name we're going to type nutrition description is, ah, recipes. So we're going to type recipes, meals, necks. Ah, fuel your body the right way. Some like that. Okay, so here you can experiment. Just type something creative, whatever you want, but in text, you know more. Okay, choose a linked page. So this is where we choose our page, and we're going to go to nutrition. So this image is going to point a nutrition, open the link in a new tab. We're gonna say no link the whole slide. How about yes for this one? Or let's leave it to know and see. Ah, well, check out the difference later. Choose a slider. We only have one, OK, and it's here. Here's the beautiful thing about this is once your images are in a slider that you've created, you can just go back and edit this slide just by using this navigation. So last step is update. Great. Now we navigate to the front end our site, and last thing we have to do, we don't We don't see this yet. That's because we haven't told the customizer theme to place our new slider here instead of our instead of this ah default demos letter. So head up to customize head on over to content and then go to front page. Now go down to slider options. You see here it says Select front page slider right now said to Demo Slider. And we want. And here's our new home fitness lighter that we've created, so it's gonna choose that, and it's set to a specified width. The time is five seconds, and we can also carousel here and you see, my screen went down a bit. That's what it's showing up like that. No, it does that automatically. So one more thing I'd like to point out here is that right now our slider is set to a a fixed with, So it's the width that we specified in our images. But we can also play around with this option, uh, which, um, the theme will stretch the image, um, and make it false full with. So let's check this. See what happens, and you see that the image will be resized to a full width so you can play around with those options, see what works best for you. Some people like the fixed with some people like the the full width. So saving, publish and extent of that. Let's go check out the front end of our site that was on it here. Here we go. So we've got our workouts image, our mindset, image and our nutrition image. And I can click on this, and it will bring me to the nutrition page. Now notice the slider has gone here. The featured pages section is gone. So this is a really beautiful addition to your a website to have this. Ah, this carousel here. Here. I can work. Go to the workouts page. So pretty neat. Pretty neat. So, um, play around with the full width and fixed with option C would find what works best for you . And I hope you have fun with this creative side of, ah, Web design and have fun with that, integrating this into your site. 29. WPC 26 social media: So now we're going to add some social links to our website. Just now, I get to the front end here. Here we have this Rs rs s button here, but we're going to set some social links so that you can navigate to places like Facebook, Twitter and Google plus. So in order to do that, we're going to go to customize and customize You're gonna go to global settings and then in global settings here you have social links. So let's just take out this RSS for now. And you see that it updates right away. And you have options here for Twitter. So I've already set up some tabs here where, uh, I'll be just copying and pasting the U. R l from this tab here and pasting it into that link. So, for example, if you were Justin Bieber here, you would be taking this address this u r l, and copying and pasting it into you the appropriate one for Twitter. And then I got Facebook. He would actually go to your page. But I'm just doing this for demonstration. So copy piece that for Facebook. And then I got I got Google plus right here. Ski and paste. So saving. Publish and you see that they appear right there. Let's go check that out on the friend that was was there. There we go. We got our Twitter, Facebook and Google Plus. And if we click on Twitter, we're going to go straight to the Justin Bieber page. So that's how you add social media to your header and your footer. 30. WPC 27 change your fonts: Let's talk about modifying the fonts of your website, go in and visit the front end here and noticed that there are what appear to be two different funds here. Let's go to one of these pages. I believe we have two different fonts here for this heading and the text as a combination of different fonts. Now you can go and change these and the customers. Your theme comes with a list of paired up funds that looked pretty good together. So in order to change these going to go to customize and then we're going to go to Google fonts. So right now, as a default, it's set to for Jolla One and Cantarell. So you just have to click down Arrow and you get all these options here for different funds that you can install. Yeah, actually, you don't have to install them. There are out there all pulled from Google fonts so and their parents automatically here. So you have all these pairs of fonts that you can scroll through, and the only thing I would suggest is make sure it's easy to read because people don't like reading on the on websites. So if you have text. Make sure it's very easy to read. Usually these ah sounds or s A s Fonts are pretty easy to read. So I would suggest one of those ones like this one. This Joseph in sounds and open sounds is pretty ear easy to read as well as the fair. If serif funds, so just you can scroll around there. So these air paired funds and you have ah, these ones to web safe fonts, thes air ones that have been around forever. And you have single funds now. These won't be pairs of funds. They'll just be one single fund for your whole website. So for now, I'm going to just click this one. I think this one looks pretty nice Doses and open sons. So click that and you can also set the website default font size of your website so I could make it smaller. You can make it much bigger. So maybe you want tohave Give people your people on easier time to read things on your website. So you have, uh, the option to modify that. I think it was set at 15. Just leave it at 15 for now. So saving publish. And there it saved 31. WPC 28 wp google fonts plugin: So if you want to get really specific with fonts in your website, I'm going to point you to a plug in, which is called WP Google Fonts. And this will let you customize your fonts So you have a lot more control about what you see, so head down to we're in the dashboard here, head down to plug ins and go to add new. And this is gonna let you search for a plugging some, you know, type in WP Google faults. So there it is. Filippi Google funds hit the install Now button, it's got a lot of installs Over 100,000 people are using this or 100,000 websites and at this step, you just have to activate plug in. So here is my list of plug ins and I've see this new section Are this new? Ah option that's appeared within my menu options here. I've got the ghoul fronts, so let's go check that out. So fun Number one, Let's see Aladdin. So you want to select a fund and then you designate which section of the website you want it to pertain to you. So if you want Aladdin as, um, your all your headings. So you just click headings one through six and then you would have another font. You could choose that one, and you say anything that's in the body. So these air for a year, your paragraph headings and this is your body what you would see in like, a block post, for example. Ah, and you have other options, Teoh at 1/3 fund fourth font, and designate them to different headings. Our for quotes, paragraphs, actually, all body tags. Yeah, we have the option of, ah, making this effective body tag or a paragraph p tags. So I'm just gonna leave it to that. We can check both those just to make sure And that's how you use this plug in. Now all you have to do at the end to save all funds, and we're gonna go check out our friend end here and you see how this has changed to the fonts we've selected. All this has changed. Let's go see one of our pages. So it's changed now. I was I was doing this kind of blindly. But if you want to see what all these fonts look like, just head over to Google funds and you'll be able to see visually what all these funds look like and you'll be able to find them in that list. So here there's a way to you search for these fonts and, um, you can have fun picking out really specific ones if you want something. Ah, a particular look for your site. So have fun with that. If it's not something for you, just stay with the Thea Font selection in your website that comes with customizer theme. Okay, now let's say that you I don't like the fonts that you've selected with the Google fonts plugging, and you want to revert back to the customizer theme font selection. Then you just go down here to plug ins, click on plug ins and find your this is your plug ins list. So you just locate the WP Google fonts and deactivate it. And if you want to get rid of it for good, uh, you just check it here, go up to bulk actions and hit delete. So for now, I'm just going to deactivate it. And just like that, I can visit my site, and my fonts are back to the how they were before with the front selection that I selected in the customizer section 32. WPC 29 contact form: let's set up the contact form on our contact page. In order to do this, we're going to need to install a plug in. So we're going to get navigate down to the plug ins menu item here from the dashboard. We're going to click on Add New and the plug in is called Contact Form seven. So just type in contact Form seven here. Seven. Here we go. And there it is. And as you can see, it's got one plus 1,000,000 active installed. So that's a lot of people using this contact form. So that's a good sign. Click on install now and activate Plug in. Okay, Now you see that this new contacts menu at item has appeared and I want to add a new contact form. So these are This is the code for you're contact form and you can modify certain things here. Like if the name is required here. The email is required. Here is the subject. I don't think that's required. And there's a submit at the end now that what you have to pay attention to here is to change this email address because the contact form has to be sent somewhere and by default . It's got this really weird email address that you probably won't really easily find. But it's it's in your site somewhere. It's in the installed, but it's it's this very awkward. So we're gonna have to create an email address. So before we do that, we're just gonna name this form and name it home fitness form. Okay, Now save that. Okay. Next step here is to log in to the sea panel. So if you recognize this, this pain here log in to see paddle you're going to go back to you're going to go to the email section two accounts and you're going to create yourself an email with the address. Um, it could be, for example, info at your site dot com So and since that we're doing this, um, remember, we set this up on a sub domain. So if you're doing it that way, uh, you can choose the name info at home fitness dot your domain dot com or whatever extension you chose. So let me demonstrate, and hopefully that's going to be a little clearer if you're more of a visual person. So I'm going to click on create account and here I'm gonna be able to choose which domain I want the email to be part of some in type info And you can take whatever you want in this field. It could be like info or support or accounting. And here I'm gonna select which domain. So the domain is home fitness, and here's my, ah, domain that I'm piggybacking on its home fitness home. Fitness is the sub domain of the session, Fiddler. So I'm gonna choose that. See? Panel password. I've got my last pass Is going to auto generate a password for me so I don't have to spend a bunch of time writing that down and create a get. So now I've got my info at home. Fitness thought said session filler dot com. So go ahead and create that address. Once you're done, that we're gonna go back to are at a contact form and here on under this male tab, we're going to change this. We're gonna change this. Ah, this email address here. So by default, it put the in this address WordPress at home fitness dot session filler dot com. That one doesn't really exist. It just populated with some this field with something automatic. So we're just gonna check that. Change this to info at home fitness dot session fiddler dot com. So we're gonna copy Piece that and put it into this field. There we go. So now when somebody sends the email from our contact form, it's going to go to this address. Now, you can't send it to something like Gmail or Hotmail because it's going to say that the address doesn't match the name of the domain. So there must be a ruling there somewhere to not allow any to you. It won't allow any domains that aren't part of your site. So I'm going to save that. And what we need to do now is grab this little snippet of code here. Copy that, and head back up to our pages section, and we're gonna find our contact us page and here we're gonna pace this into the text tab. There is our text hat. Are some people call it a snippet. Other people call it a short code. So let's call. Just call it a short code. So, like, short code has pasted into their click update. Now we're going to go up here and view the page and we got our beautiful contact form here . So in order to test this out, I'm going to right just a quick little email here and then click send and says your message has been sent. Now you're probably wondering where this email is going. Well, it's going to the address that you just set up here in your C panel. So go back to see panel. Go find your address that you've created for this domain and click on this little more tab and you're gonna access the web mail. So here it's gonna bring you to another part of the sea pedal. So it's these are these air, like how programs that read your email. So I just go for this squirrel mail here. Okay. And there's our email. There's my email from John Home Fitness. Hello. So here I got the from here. I got the Hello. That's the subject line. Here's my message. Body. Hi, how are you today? And it says this email was sent from a contact form on home fitness and there's my Ah, there's my domain name. So awesome. We've created ah, our email address for our site and we've created a contact form. Now you can create is many of these of these email addresses is you? What? You can create support at home fitness. You can create accounting at Hope Fitness, and you can create a bunch of these. And don't worry about having about getting lost with all these e mails to keep track of cause I'm gonna show you a wonderful thing with this is that you can forward it to you your main email just by going to you the forwarding tab that I showed you there. And then you create an email account forwarder adv Order and you just type in the email address of your main email there, click at forward or so then, any email that ends up on this in this at this email here will be forwarded to your other account so you could have potentially have ah, five email addresses, all forwarding to the same email address here, so you don't have to manually check all of them. So that's those air. Some things that you could do with, uh, with this email. All right, 33. WPC 30 recaptcha setup: Now we're gonna add an extra layer of security to our contact form and this will. This will prevent spam from entering your email. So we're gonna but go back to contact here, and we're gonna go to contact forms, gonna select our contact form that we've created the one called Home Fitness Form and go to at it. So here we have a recapture, which is a code that is auto generated. And then there's a little box below where people would fill in, that the number that they see in the picture and have to do that in order to submit their email. So in order to do that, we're gonna go see the these instructions because you need this a p I key pair. So that's registered with Google. And this is some of the most sophisticated contact form security software out there. So we're going to go with this. Ah, in essence, these air instructions you go to Google's recapture administer admin page registry site, get the sight at key and secret key, and then you go to your admin menu of contact. You integration, find a recapture panel and click configure keys. Copy the psyche and secret key into the fields and see them. Lastly, put a placeholder holder for the recapture widget into your contact form content. So hopefully a recapture. Pote placeholder is a form tag. Like any other form tags, it supports several options. Okay, so hopefully that, uh, our plug in will do that for us. And so we're gonna head to this recapture and men played page. Just click the link here, asked for a label, so it's just ah, sort of a title. So we're gonna say info. Ah, sorry. We're going to say home fitness and this is your domain. So mine is session filler. Come, and I'm gonna say it's for the contact form, So here it's asking for your domain. So you're just gonna copy Pace? What? The address you wrote here. Copy. Piece that in here. Send alerts to owners. What's this all about? Get alerts if Google detects problem with your sites such as midst configuration errors or an increase in suspicious traffic. Um, I guess we'll leave that as I believe that as selected. Ah, and we're gonna register this. Okay, so this is in a another tab. We're gonna open a another tab here. Go back to our Are our site here. Home this dot session fiddler dot com forward slash Oops. I just needed that. Their fitness, not social session. Phil, it'll come forward slash WP WP dash log in. Ah, Ph B. Okay. And there I am, be logged in. Okay, so here we go back to you contact. And then I believe it's integration. So it's recapture is a free service to protect your website from stat spam and abuse. To use recapture, you'll need to install an A P I key pair. So we instead we got those. And they're just in this other tab right here. So, psyche, we need to copy that psyche here. Piece that. And we've got our secret key right here. And control. Copy that into there and hit. Save. Okay. Now we go back to our contact form it edit, and we can go back to here, recapture and generate a form tag for a recapture widget. For more details. Here, capture theme. Light size normal. And there we go. Insert tag. And here's the code that it wrote and weaken. Move that any part of this sequence here and we're just gonna move it at the end. There we go. It save. Great. Now we're gonna go visit our site again. Gonna head over to the contact page. And there it is. There's our recapture. So you just have to click that and it makes just make sure that we're not a robot. So that's your that wraps up the contact form security layer. I hope that wasn't too technical. It's a bit of skipping back into Google and back to your site. And we've done a lot of skipping around and to see panel. So hopefully that that puts your site into perspective and how it works and interacts with C panel and other things going on on the Internet. Now you don't have to have this on your site, and you don't have to have this capture box, but it's a good it's a good addition to your website, so I hope you like it. And good luck with setting that up 34. WPC 31 delete about sample page: So now we're just gonna take a second to delete that about page that was installed as a a default page when we install her theme. So I'm gonna show you how to do that. And you can use the same process to delete any page that you don't want any more in your site. So from the dashboard here, we need navigate two pages and there we see, I see all my pages. And this is the about page that we created to go into this home fitness site. You see, it's got the picture there text here, and we've got this about page that's nothing is linked to it, and we don't see anywhere. So, uh, we just want to get rid of it, so I'll just show you what is in it. It says this is an example of WordPress Page. So this is a sample page that just installed with WordPress when you when you installed WordPress on your server. So in order to delete that, we just go back to pages and you click trash here and there it goes. So another way to do this is let's say I wanted to get rid of a number of these files, I would go to bulk actions here and moved to trash. But since I don't want to do that, let's just uncheck thes now. That about file wasn't down and wasn't deleted. It was just sent to the trash. So in order to delete it for good, you would have to delete permanently. So for safekeeping. Ah, just leave them in the trash. So that's how you delete pages. 35. WPC 32 assign a posts page: Okay, We're gonna work on setting up our blogged posts now. So in order to do that, we have to set the block posts. We have to set the page that will receive all of the blonde posts in that That's called a post page. Now the Post. The post page is a static page, and we've already created that in our pages. And it's right here. It's blood. So if you go into that, there's nothing in it. Now we have our post section and we have the sample post that was installed when we installed the WordPress. So we're gonna go click out of that. And so, in order to set this up so that every new post we create will go into this blawg page that we created here, we need to go down to settings, so go down to settings and click on reading. So here we've designated our front page. So are our front page displays. A static page that we've chosen here. It's home. So we went to our list. We chose home. That's all Fine. We did that. And now it wants us to choose our posts. Page where l all our posts going to go to. So we're gonna click choose blood and there's some other options here, but we don't need them for now. Save changes. And now we're gonna go navigate to the front end of our site. And what concerns us now is our blawg page, our posts page. So now you'll notice that our sample page shows up right here in our block section. Here's a notice year, but we can dismiss that. And if we go click into that, we have a sample page with the texts that we saw. We see a comments section. So what's gonna happen here is that every time we write a new post, it's going to show up as a thumbnail just like this. And it's gonna populate this page with with all your posts. And it's going to receive all your posts so that the visitor to eeriest sight can navigate through this and choose the anything that interests them. Now, when we create a post, we're gonna see how Teoh obviously enter some text into it. But we're gonna see how we set our featured image and featured image will show up here making this blood post all the more interesting. This is This one isn't so interesting, Teoh view, but when we click on it, that's what we get. So let's create a a post and you'll see that it's starts to populate this page and will also delete this post because it's a sample. 36. WPC 33 posting your first post: we're gonna go ahead and create our first blood post before doing that. Let's go and delete the sample post. That's inner sight right now. So just click the trash item here and that will be sent to the trash. And you'll notice that if we go back to our front end here and we go to blogged, the blood will be empty. So let's go back to our dashboard and click on posts, and you can just go to add new. Okay, well, name this post. Ah, working out with Lit tool working out with little or no equipment. So I've got some sample text for this, which is in the home fitness text. Txt file. So just pull that up and copy paste that in here. Okay, so we've got that. And now we're gonna add a video item there so we'll just go grab one from YouTube, go to YouTube here, and I'm gonna So you had a and better video, so we'll see. No equipment work out. Should be some good ones here. 32 minutes. We'll take this one. So here you'll see this. They're here. You'll see this share button and so click on that and you'll get this link here. So you want a copy? Piece that and just add that straight into your post. And WordPress will just display this video and the width will be just the maximum with that , the page allows. So that's a pretty good. That's a pretty good setting. It's just gonna be nice and wide and so people can view it. Ah, view it right in your page which out? Without having to go full screen. So let's view this post and there we are. We've got her text, we've got a title and we've got our video. So So now I'm gonna show you how to set a featured image for this page. So we're gonna go back. Teoh are actually we can just go to edit post right here, and we're going to set the featured image, which is right down here. Now the featured image must be 270 pixels wide by 250 pixels tall. So that's same size that we used for our featured pages. If you remember that video, so we're gonna set the featured image and I need to upload mine because I've just resized it So it's called Ah, featured image. Okay, Featured image to frogs exercising. So it's this one, and there it is. So I'm gonna set that featured image. There we go. So if I click on update, I am going to get I won't see any changes except that I see the future image, too. But let's go check out the post so you don't see it there. But if I go to blogged, you'll see that the featured image is right there, neatly displayed inside this thumbnail of the blogging, the blog's So you see the title here, you see part of the text and you can click on that and go to your blood post. 37. WPC 34 Image gallery post: Let's go ahead and add another block post to our site, and this time it's gonna be in the form of an image gallery. So we're going to do the same process as before when we added our last post. So from the dashboard, go into posts and click on Add New. So this one obviously can name it anything, but I'm going to name it Image Gallery and let's right away set our featured image for this post. So head on down to featured image and set featured image here. And I'm going to select this mountain, uh, image here. And don't get confused with this one, which is the full size one. This is the featured image size, so it just make sure it's f I mountain dot j peg and you can see that's to 70 by 2 50 And that's the specified height for this theme. So we'll set that featured image so you can see it right there and here. I'm going to click in this WordPress er roared process er part of the visual editor. So just click on this section of the page, and then you're gonna hit add media. So going to add media. And here you see a different option that you don't see in the the static pages Add media, which is create gallery. So we're going to create gallery and here lets us choose any image that we want to, including our gallery. So just make sure they're the full size images and you Congar ahead and click on any image that you want to add. And it doesn't matter for there really in the same topic, because this is just a test. So we want that one so we can see it's a full size image here. 12 80 by 8 53 It's not one of these thumbnails or, for example, if I clicked on that one, that wouldn't be very good for a image gallery because it's too small. So when I click on a few of them here, I'm gonna remove this click on that one click on this one. How about just take a bunch of these just enough so you can have a good idea of what an image gallery looks like? Let's see. Oh, that's safe. That's a featured image. Already got the strawberries. Okay, I think that's pretty good. Okay. And here on the lower right corner, you're going to see create a new gallery. So click on that and you're gonna have to insert the gallery after. Oh, this is Ah, another important step here. The gallery settings you're gonna link Teoh Media File. So then once you click on the any thumbnail within the image gallery, it's gonna link you to the media file. In other words, you're going to see a full size image pop up, and then you're gonna be able to go back and forth between all the images in the gallery. So this here, the size of the of the thumbnails you can set as some nail medium, large and full size so you can play around with that. And they're either in random order or the one you selected. And the columns you can choose between one through nine. So we'll leave it at three and will hit insert gallery. And there we have our images. Now, some of these have have captions. That's because we've added captions to these images so they will show up on your image gallery. So here, just go to publish page right and go up here to view post, and we'll see how this shows up on our site. So here we're on that block Post written the image gallery, and we see all our thumbnail images. And once we click on one, let's click on these nuts. We can see that it's the number nine, the Ninth Image and here weaken. Browse between all these wonderful full size images that is just beautiful. So this is an awesome and powerful addition to your site, and it's It comes integrated in in theme, so that's that's just amazing. You don't have to go through any steps of installing plug ins or anything like that. It's right in your sight Now. If you wanted to link into an image gallery here, you would just have to set that up in the menu section. Let's go check that out right now. Appearance menus. Okay, and let's see your custom links. So we just have to say menus and then grab the HTML from that block posts page. So let's just let's just try that. I just have to go back and grab that you are l from the image gallery page. So there's our There's our thumbnail that we created So I'm gonna click on that, and we're gonna grab this U R l So, control. See, I'm gonna go back to my dashboard. We're going to go to menus right here, and I'm going to go to custom links, okay? And this is going to be image, or I will just say gallery to save. Ah, yeah. We'll see. Image, gallery, gallery, and we're going to copy Paste. Are you are all here? We're gonna add this to the menu. So we see it show up there, save menu, and then we're gonna go check that out in our the front end of our site. So here we see Image Gallery. What happens when you click on that? It brings us right to our image gallery. Awesome. All right, so there's a couple of things you can do with image galleries. If you have something like a photo site, this is super powerful. If you want to show off your products, this is also a really good option to have. So have fun with, um, this really creative site side of your website. All right. See, in the next video 38. WPC 35 Edit image gallery: I'm gonna show you how to edit your image gallery. So we're gonna head from the dashboard to our latest post, gonna go to all posts and we're going to go to our image Gallery Post. So we're gonna hit, edit, and there we see our image gallery. So in order to edit this and make changes, we just have to click on any image and it's gonna bring up this little box and you're gonna see the whole page turn this grayish color so we can either remove the whole gallery or edit. So I'm gonna click on edit, and here we can do things like change the thumbnail size. We're going to go with a we're gonna go with a medium thumbnail size. We can also edit the captions. So for this one, we're going to say motivation that it's best Okay, so you can edit these captions that appear under the image. The ones that say captured, captured this image don't have any, so you can feel free toe at a message. And you can also rearrange thes images however you want. So just drag, click, drag and let go, and you'll have you'll have ripped repositions your image. So after you've done that, just hit update gallery, and then update your post and go up here and view post click on view post. And then we here we see that our images are thumbnail. Images are larger and are there also rearranged? So there you go. There's some ways how to of how to edit your image gallery. 39. WPC 36 add social media sharing: So let's go ahead and add some social media sharing buttons to your blogged posts. So we're gonna do this with a plugging that's called Jet Pack. It's designed by a WordPress, and the way to install it is go to your plug ins section here from the dashboard, go down to plug ins and go to add new click on Add new and then I see my the jetpack right there. But if you don't have jet pack on your screen, just click type in jetpack. Enter and you'll get this, Ah, green icon and click on Install Now and you can see that it's got one plus 1,000,000 active installs. So this is a pretty popular, uh, plug in by WordPress. So basically, it's a It's a suite of plug ins for your site, and I'm going to show you one of them right now, So I want to get to this screen. Once it's installed on your site, click on Activate plug in. That's going to activate the plug in, and you're gonna end up with a jetpack menu item here on your dashboard. So head on over to their, uh, let's just see here. So here in your list, you have jetpack by wordpress dot com. It says Bring the power of the wordpress dot com cloud to your self hosted WordPress, and it enables you to do a whole bunch of things. So we're gonna go to this jetpack menu item now. This is the one, um, kind of time consuming thing about jetpack is that you have to create an account on wordpress dot com. Now wordpress dot com is the place where you can host free versions of WordPress. You do not need to have your own domain name, but your site will be something like X y z site dot wordpress dot com. So that's where you could do that. And that's also the place where you'd have this type of account. Now, if you don't have it, count on wordpress dot com. You're going tohave toe, create one. So regardless of whether or not you have an account, you just press on connect jetpack. So here it's it's already I already have an account with wordpress dot com. So it's ah, it's It's, um, remembered my user name, so I would have to just approve this and on this page if you don't have an account, it would either say set, account or create account or log in. So if you don't have an account just creased, just click on, Create account and you'll go through the steps where you'll create a user name and password , and hopefully you'll have last pass installed by now. So last past can remember your new user name and password for all these user names and passwords that your collecting. Ah, in this in this Web design venture. So here, I'm gonna prove this, so it's gonna kick connect me to wordpress dot com and here it's telling me, Teoh, install all these things that automatically I'm just gonna press skip. Okay, so now it's just tell me which of these plug ins are activated in which of them are not. So we don't have to go too much into that. We just have to. What interests us right now is setting so head back on over to here in the dashboard menu Ripple a jetpack. You'll see settings. Click on that and navigate down to it's called sharing. These are all the plug ins that air that come in this in this suite, so we're gonna find the one called Sharing. So here it is, sharing its close to the bottom. So we're gonna hit Configure, okay? And so now we need Teoh here. You could do two things. Actually, you can publicize your latest posts by connecting all your your profiles. So, for example, here if I would connect my Facebook account to show all my latest posts, I would click on Connect and it's going to bring me to Facebook. And I would say, OK, but I don't want to do that right now, so I'm just gonna say cancel. So that's how you can connect all your, ah social media sharing platforms. Hopefully I can get back to where I was, and it's a great way to share your content. Okay, so you have a bunch of options here. Facebook, Twitter, tumblr path. So that means that every time you post something new in your post pages, it will share automatically share on your social media, which is really amazing. But for now, we're gonna concentrate on this area. So let's see. This area was like this when I started, so OK, it's because I I installed this software suite and then uninstalled it so it kind of remember what I did before. But when you open it, it's gonna look like this. It's gonna say available services and then you drag and drop available services here for the ones you want. So ah, you will just choose the ones you want out of this list. So I'm going to take Facebook. Oops. Facebook is not that There is just below there Facebook and Twitter, and you can also have the option to for some people can print. Ah, you can choose Google Plus and you can rearrange them. And how about one more Pinterest? There we go. So I have print is the last one. Okay, so years are our list. Ah, we have Ah, I got only we can have icon plus text. It's gonna display like that. But I think I like icons only. It's nice and simple, and here you can, uh, modify your message of what it says just above it. So it's going to say that anywhere those icons are displayed. So, uh, we're just going to say to your friends, it's an exclamation point and they'll know what to do. So whence a reader of your site of your post clicks on one of these, they'll be taken in, uh, they'll be taken to their log in page for for Facebook, and they'll be able to log in to their page. And then it will just be an option to say share and we'll say, Okay, and that will be shared to their to their ah, Facebook page. So what? These are other extra options that we don't need right now, and there's Oh, yeah, this is This is super important. Here is where you do you want these buttons to show on your site? So do you want it on the front page? Let's click front page posts definitely on pages on media, so I would leave pages and media out of there because where it's relevant is really your posts. So block posts are like kind of like articles. If something new goes out, you want to give people an opportunity to share that content. So here we're going to save the changes and to see those changes, we're going to go to the front end of our site. And here on the on the front page, There we have it. It says, Tell your friends we have these icons here. And if we go to our blawg, we've got our two articles here and let's go on to this one. We have our social media icons, so isn't that awesome? So our this is the way you add a lot of functionality to your site and these air Just the awesome tools that men, if you had to program this yourself, it would be a nightmare. I I wouldn't want to try it, that's for sure. So I I actually learned to see a CSS and HTML and ah, design a couple of websites from scratch. But then I saw what people were doing with WordPress and I I just ah, set that aside. I said, You know, I'm just gonna find with these pro these plug ins do, and just to take advantage of what's already out there and just be able to plug in this stuff into my site. So that's the wonderful thing about WordPress. Is there so a wealth of these types of functionalities that you can easily integrate into your site. So I hope you have funny with that. And, um, be sure to add these to your site. The test site. Home fitness as well as three. Your actual site that you working on. All right. See you in the next video. 40. WPC 37 social media more button: So I just wanted to point out to you an extra bit of functionality you can add to your social media sharing buttons, which will enable you to add even more options without cluttering up your screen. And those extra options will be hidden under a little more button. So we're gonna go navigate to jetpack. And under Jack Pac, you'll go to settings. Once the right settings, you're going to go down to sharing, go to configure. And so all you would do to enable more of these social media sharing options. Ah, and without adding them to this main list here, you would drive them to this box to this great great blocks that says services dragged here will be hidden behind a share button. So we're gonna add this tumbler one we're gonna add to spread it one, and we're going to add the Lincoln one. We're gonna put it first, so I'm gonna go to save changes. And once we've saved that will navigate back to the front end of our site and go down here . And so now we have this more button. Once we have over that, we've got these extra social media sharing buttons and there you go. So see in the next video 41. WPC 38 discussion settings: Okay, let's talk about comments in your blood posts. So I'm going to go to one of my pages here and show you what the comments section looks like. So it's in the blog's section, and at the end of every blogged we have a section that's devoted to comments. Now, if you're the administrator and you're logged into your WordPress dashboard, it's going to look like this. But if you were not logged into your site, it's going to look like this page. So I've got This is actually a comment that I left just to show you how how it's done. But basically you'll have your comments. Section your name and email, which is required, and your website, which is optional. And then you can post a comment. But this comment has to be approved before it actually shows up. So I'll show you where all these how to change all these settings. Let's head back to the dashboard and we're going to go to settings and understandings. We're gonna find discussion now, by default, you're gonna have a comments section on every new Blawg post, and in the section WordPress refers to them as articles, but they're the same thing. So here, it says, allow people to post comments on new articles that's checked. So you're gonna have that option on every new block post. Now you can check or uncheck that we'll leave it checked. And the other thing that's of interest here is that the comment by other must have previously approved comments. So in order for a comment to appear automatically that that author of the comment ah must have had a an approved comment previously. So well, leave that checked because it's ah, it's a way to filter out the spam on your website. You could have a lot of ah, people just posting on your comment section because they want to sell some. Some crazy thing are they just want to get your money. So So leave that checked. If you've made any changes, go down to here and click your shape. Save changes. We haven't made any changes here, so we're gonna go to comment now. I have ah ah, number one showing here. So that means I have one new comment that needs to be addressed because I I left it on my own site through this other browser. So uh, show you what I mean here. So I was I was logged into chrome, um, Google Chrome, another browser, this one a safari. So if you logged, if you're using another browser, that browser can't tell that you're logged in as an administrator on the other browser. So I'm logged in as an administrator on safari. I'm not logged in on Google Chrome. So that's that's kind of a way to test out different things. So I left a comment here on Google Chrome, and it shows up here on the safari. So this is the comment section, and here I have the comment. I love your article. Very informative. I will take your advice. That's what I wrote. And I can improve this reply. Do a quick edit, ed it ors send it to the spam section or trash it. So here we choose to approve it and that I could go to visit my site and go see my blawg. Go see that block post And here I've got one new comet. Great. So another thing I wanted to show you is that you can override the settings in every individual post so you can go to your, um, let's say let's say you went to this one. This image gallery post we did go to edit that one. And since it's an image gallery, maybe we don't want any any comments on that one. So we don't see the option to override the comment settings, the discussion settings rather in this side right here. So with every but blogged post page, you have the option. You have more screen options than what's displayed here. So here thes are the ones that are displayed, and you have all of these that can also be customized. So here, what concerns us is discussion. So we'll check that, and it appears here. And this is the override the way to override that setting that we set in here in settings and discussion so we can set our settings for every individual plate page. So here we're gonna and uncheck this and save this page. In other words, update it. Okay, now we're gonna view this post, and we'll see that there is no comment section for this individual post. So that's the way to customize your comment section for every individual, post or globally for the entirety of your WordPress site. All right, See, in the next video 42. WPC 39 categorize your posts: Let's talk about categories. Categories are a way to categorise your block posts. And when you see in this menu item called posts, you see that there's a category section. So here we can set up different categories and you see the default one that comes installed is the UN categorized one. So let's go into our posts and we're going to go in, create a new category, and we can do this one of two ways. This is one way is to go into the block post and you're gonna see this categories box and this is add new category. So for this one, I'm gonna name it inspirational images and add new category. And I'm gonna unchecked the uncanny arise because I don't want that showing up on mice on the site anywhere. So I'm gonna click update, wait for that for that to save and let's head back to our other post quick edit. And for this one, I'm going to create a new category and just name it workouts and a new category. So when an unchecked that one doesn't check the UN categorize because I don't want to see any posts in that one, so a quick update and you're probably asking yourself what the reason for this is, why are we creating categories in the first place? And these categories show up in the sidebars. So let's goes, let's go see this and the only place where they're really showing up at the moment and it should be the same for your site. Let's head to the front end of our site is the pages. So if we go, there are body these air, the static pages as opposed to these which are which are blocked posts gonna go these pages and we have a left sidebar. So if this isn't showing up on your site, you might have it on the right side. You might have it on the left side. It depends if ah, it all depends on the settings in the customizer section. But we'll get to that door E. So if you if you have it on the right side, it doesn't matter. We're going to go change it. So here we have the recent posts. This is, um ah ah, default way of that. The WordPress, um, posts things in here and here we have our category section and we have the categories we've created. The one is called Inspirational Images. And then once we click into this, we can have any number of blogged posts that we've sent to this category. Now we just have one. But instead of it showing Oliver blood posts, we just have the one that's in this category. Now, if we go back and we go back to work to this other category of created, we go to this page and we've got the this post that we've assigned to this category. So that's the way to organize your posts and to have people navigate to them through these sidebars and thes all these little sections here are called widgets. And in the next couple of videos, we're going to see how to modify those and to add different sections in the sidebars 43. WPC 40 categorize your posts to one or more: So the second way to add a new category is to go up to this post section from the dashboard , go into categories, and here, you gonna see at new category. So I am just going to write something like home fitness about home foot in this tribe. Okay, does it doesn't matter. You can name it, whatever you want. Ah, and so I'm gonna add this new category, and it shows up there in my list. Now, if I want ads and post to that to that category, I just have to go into every one of my posts hit, edit, and here I'm going to see my new category, which is called Home Fitness Tribe update. Just wait for it to update here, and I'm gonna go modify my own, my other post, which is called Working out with little or no equipment. And I'm also going to check the home fitness tribe. So this is just I'm just showing you a way to how you can have your post in one or more categories. So let's go see what this looks like on our site. Find where the sidebar is on your site, and hopefully they're in your pages so that I either be on the right or the left. So here I have from the pages, static pages. I can either have home fitness, tribe, inspirational images or workouts. Right now, this one only has one posted it. Oh, home fitness Tribes right would have both of them in it because they're both checked and inspirational images only has this image gallery and the workouts one only has this posted it, So that's the way you can add your post to one or more categories. 44. WPC 41 setting sidebars: Let's talk about setting up sidebars on our site. Now, if you're unfamiliar with sidebars, let me show you what I mean. When I'm referring to sidebars, we're gonna go visit the front end of our site, and we're going to navigate to one of our pages here. Just go on mindset, and by default, you should have sidebars set on this page. So on my installation here, I have this area here, it which is a sidebar. So by default you have a number of widgets and widgets are each one of these things here. So this, uh, search bar would be a widget. This recent posts area would be a widget. This recent comments will be another region widget. You have archives categories and meta here. Now you can modify all of these. You can also place this side bar on this side. You can have a right sidebar instead of left, one and you can have footer widgets. And the great thing about the customizer theme is that you can have a left sidebar a right side bar and you have three areas in the footer where you condone display additional content. So let me show you the place where you can modify all this within the customizer theme. So head on up to customize here and we're going to go into content. And here we have a number of options for customizing where the sidebar shows up in in our pages. So here we're in the mindset page with which is a static page. And to modify this, we would have to go down Teoh here where it says the peat Pages default layout. And right now it's set on the left side bar. Now we can change that to the right side. Fire and saving Publish. Now we're going to go to the front end of our site visits site here, and we're going to navigate to the mindset page. And there you go. We have the right side bar displaying on our static page. Now, by default, this theme installs with the left sidebar with widgets already inside it. And here you get this notice saying the right sidebar has no widget. So it's not populating with any widgets. Eso We're gonna leave the setting like that for a pages and we're also gonna leave that like that for our posts just to give it a nice, consistent look throughout. So let's never get back to customize here and make sure that ah, on our posts were getting the same sidebar. So go back to content. We've got pages and posts layout. So the posts default layout. Right now it's set the left sidebar, and we can choose right side by and saving publish. So now we can see that the uh huh on our block posts as well. If we go into one of those, we're going to have this sidebar here on the right side. So it's all a matter of preference under enough there. Any studies on seeing with the effectiveness of left sidebar is Ah is as compared to right side buyers. But you can go and choose and decide for your own site. But for now, let's keep both them on the right 45. WPC 42 set up your sidebar widgets: Let's start customizing our sidebar. In order to do that, we're going to navigate from the dashboard down to appearance and from appearance. We're going to you select many. We're going to select widgets rather. Okay, And this page, you're going to see that the left sidebar is Has a number of widgets already within it? That's the one that we ah, sort of deactivated. We chose to have right side bars on our static pages and our posts pages. So we're going to be adding widgets to this side bar, and we're going to start start by adding a navigation menu. Soto add widgets. All you have to do is drag and drop the's widget types to this area, and they'll be automatically added to your sidebar. So let's find the navigation menu. Soto, add another navigation menu. We're gonna add this one called Custom Menu. We go again. Okay, so this you would use it. For example, Teoh, add like a second menu to your site. So since we only have one, we're gonna add that one. But ah, we're going to just say that it's, um ah Brown. We're going to say browse that were site and we can select a menu, but you can add a second menu in your menu options, create a second menu and have that point to specific pages of your site. So that's one thing that you can do with this sidebar widget. So we're going to save includes that. Next, we're gonna add blawg categories. So we're going to take this categories widget and added here, and we can name that blogged categories. And if you leave these untracked, it's just going to display all of these so you can go say it save, or you can select any number of them or select all of them. It's up to year preference, and here, lastly, we're going to add a search function. So add this to the area and we're going Teoh Name it. So I'm just going to write search. Ah, um, search fitness topics like that. So let's go see what this looks like on the front end of our site. So we're going to go to up to home fitness here and visit site, and let's go to a page that displays sidebars. So that's one of these static, static pages. And so now we have are the witches that show up in a right sidebar. We have our navigation are alternate navigation, and it's This is the same thing as this navigation. But like I said before you get set up another navigation here pointing to additional places in your Web site. And you have. We have our block categories and we have a search function where you can search different parts of the site. Let's see how that works. Ah, I'm gonna type. Um, I'm gonna type. Let's see a fitness. What happens then? So it brings up all these pages where fitness is mentioned. It's pretty cool. All right, so that is how we set up sidebars. 46. WPC 43 Front page layout: Now we're gonna set the sidebar options for our front page. So in the last videos, we set thesis sidebars for our static pages as well as our blawg posts. Now we're going to set the front page. So here we're going to go into appearance. We're going to go to customize and then customize your going to head to content home and posts, etcetera. And here, under front page, we're going Teoh, navigate down to here. It says, Set up the front page layout in the and here it Right now it's set to know sidebars full with layout. So that's why we don't see a We don't currently see a sidebar on our front page, but we can set it. Teoh are right. Sidebar. That's what the one we created and we'll save and publish that. Let's go check out what it looks like on the front end. So now this is our front page, and we can see that. Oh, are right. Sidebar is displayed on our front page. So there you go if you want. If you don't want a front, if you don't want a sidebar on your front page, of course. Just go back to the dashboard here, goto appearance. Go to customize and just go back into the front front page area, which is right here. And switch this back to no sidebar. So you have ah, bunch of options here. Ah, just like to point out while we're here that you can also have both right and left or left sidebar on this front page. So for now, we're just going to leave it as no sidebars, and that will give us the full with LAIA will save and publish that. 47. WPC 44 change posts and pages sidebars: We can, for example, honors on our pages right now. We've got this right sidebar on both our static pages and our blawg. So if you go into what any of our blogged articles here will see that same, um, same sidebar. But what we can do is have a sidebar on the left for our static pages and on the right for our blood posts. And let me show you what I mean. If that sounds a bit confusing, going to go back to our dashboard, go to customize, and we're going to go into content going to go into pages and posts layout, and we're going to go into, um, say we're going to keep the right side wire for the posts and for the pages were going to choose left sidebar Saving published that. And we're going to check out what it looks like on the front end of our site Goto home Fitness visit site. And now we're going to see that if we click on the static page, we've got this left sidebar. And once again, this is just the the ah widgets that WordPress installed by default. On this left sidebar, we can change any of these, of course. So that's for the static pages. And if we head over to our blawg, we're going Teoh have a right sidebar. So those air some different options, of course, many different options in the customizer theme. And I find that the name of the theme really represents what he could do with that. You can customize a lot of things for with this with this theme. So have fun with the with that with customizing your different sidebars and finding, um, different ways to add some content and functionality to your site. 48. WPC 45 breadcrumbs: All right, We're gonna take a look at a feature of the customizer theme that's called breadcrumbs. No, breadcrumbs are little bits of text that will show your user where the are in the site. And to show you what I mean, we're going to go straight to appearance, customize and from the customized menu we're going to head to content. And then we see this menu Adam here, that's called breadcrumbs. So we go into breadcrumb, and here we have options to display. Breadcrumb, you're going to see this more in a static page. So we're gonna try to go toe body mindset here from this pre viewer. And this is the breadcrumb here, so we know that we're we were in home and we've gone to mindset. So that shows the viewer where the path that they took Teoh get to this page. So if you don't want to display that, we just have to uncheck this box here. Saving published that. And then now, once we go back to our mindset page, you see that spread crumb is gone, So let's leave that on for now. Save and publish that and we can also have the option to display the bread, come in pages only, or display the breadcrumb in single posts. So if you if you were asking yourself, how did this text get here now you know, and you know how to customize it. 49. WPC 46 footer widgets: All right, let's start customizing the footer area of our website. So let's just take a look at him at what it looks like now. So we're going to navigate to the front end of our site and go down to the footer area. And now this is only that the Inter mistreated that can see this. So it says the footer has no widgets. So we're gonna be customizing this section here. So in order to do that, we're going to go back to their our dashboard, go to appearance and go to widgets. And in the widget section, you'll notice the right sidebar. Sorry. The footer area one foot a widget area to and for the widget area three. So that's what's great about the customizer theme is that you get 3 40 areas to work with and notice here that we have our left sidebar and are right sidebar with their own widgets . So in the area, one we're going to be putting in a recent posts widget. So let me just find that in the list. Here it is, and I'm gonna put this in Dragon, drop this into area one, and we can give it a title like recent fitness and lifestyle Life lifestyle. Sorry, Posts. And you can change the number here of recent posts. We only have two. So too will show up, but you can put any number you want and display the post date will save that. Now we're going Teoh slip a widget into area to So we're going to be choosing a plug in called image. And this is from the jetpack plug in that we installed. So if you don't have jetpack appear, you won't be able to install this plug in because it won't. Ah, it won't appear within your widget list. OK, so make sure you have that installed or else you won't be able to see this one. So we're gonna install the image, uh, which it in there. And for this third area, we're going to you install a text widget. So put this text widget here and we're going to slip it into their okay. Quit save, uh, and hit. Save on that one. We've saved this one. Let's say it again. There it is. And let's visit our site to see what that looks like. So here's our front page, and we got our recent fitness and lifestyle posts. We've got two of them image gallery and working out with little or no equipment. Now this normally is area to, and this is area three. But since we haven't tell telling what we haven't told what those which it should do so they're not displaying anything. So in the next couple of videos, we're going to get into what you can do with those widgets that are any area to an area three. 50. WPC 47 footer area 2: All right, let's work with footer. Widget Area, too. So in order to get there from the dashboard, we're going to go to appearance and we're going to go to widgets. And here's where we customize for your widget area to. So here we have the jetpack widget installed for image. Ah, Right now we're going to you have to create an image, an enticing image to lead, ah, viewers of our website to our potential products page. Now, we don't have a products page, but I'm just going to illustrate what we can sit up here. We're gonna create an image that's gonna point to our image gallery, and that image is going to say, Check out our products or check out our new products so we'll just write it here so we don't forget. Check out our new products. Okay, so we're going to save that now. We're gonna have to create an image and get the your ill from that image and paste it into here. So we're going to go to pick slur now and create that image. So I'm gonna open up a new tab, go to P i X l r dot com So once you're in pixel er you want to go to the editor, and if you have photo shop and Stalin your computer, you can also do this in photo shop. So we're gonna open the image from computer, and I'm gonna choose this f my mountain, the one that's 270 by 2 50 Okay, so open that, and our text says, check out our new products. So we're going to grab that. Copy it. And here we're going Teoh press on the A little letter icon here, and we're going to you go right there and we're gonna pay start texting there. Okay, so we can see that it's a little large that weaken. We can either reduced this font or a weekend just go into here and just press enter, and it's going to put everything on a new line and we can change the color. So we're going to go with a nice um, yeah, yellow. Actually, we can actually just pick that, picked this color, and it's gonna match the color of this. Ah, sky line here. So you just got a web. Go pick the color, and then you can go toe to this right here and I'll press OK, and ah, for happy with that. Then we're gonna press OK? You can also change the fun here, Teoh. And it's going to see that I'm going to see your fund automatically. So let's go with this one Here. It's Al Body. Okay, Press OK. And with this pointer here weakened, move this anywhere we want Teoh. So I think that looks pretty cool. So we're going to say this image on our computer save. And right now it's called F I mountain. That's for featured Image Mountain. But we're going to say it. We're gonna call it. Ah, we're just gonna call it footer image melting. Okay. And leave the quality as is we're gonna save it there in our home fitness images folder. Right? Okay, so that's done. Will go back to our new are other tab here. Now head on over to the media library and add new and hit select files were going to go to our home fitness images and we're going to go to Footer Image Mountain. So that's there's our footer image and it chews there. Okay, so now we're going to go click Edit. So Once we're on this page, we're going to grab the your ill of the image. So this is like the address of the image. Uh, right here in this box, you'll have the u R L. You just have to select it and hit control C on your Macintosh. Or I think it's I believe it's command C on the PC and head back to appearance and widgets , and we're going to go to foot area to click on this triangle. Rightward says image. And this is the you owe image. You or else we're going to pieced it right here. Okay, And save that. So right now we need to grab the link. You are elsewhere the way we want this image where we want the user to go to once they click on this image. So right now, we want them to go to the Image Gallery because it's our hurt quote unquote, um, products page, we're pretending it's our products page that we're sending people over to their So what do we do to get that? We just navigate to our posts and go to all posts, and we've got our image gallery. So this up here is the Perma link. So we just need to grab that. And that's like the address of this page. So once people click on the image, they're going to be sent to this address here, so we'll copy that and paste it back into our widget area. So go to go back to appearance, go back to widgets, going to go back to footer area to, and we're going to have our link be pasted here. So you've got other options here. Ah, like you can add a title, alternative text and a caption. We're not going to do that. And we're just gonna hit save, And now we're going to see what that looks like on the front end of our site. So let's go to the site Were on the front page here and there. We got our new image, and we've we've designed it like that. So we've got the text, overlay it on it. And once we click that we get taken to our image gallery and you can create an image with any text you want point toe, any kind of page you want. This could be like an exercise page products page. You can um, send people to your email sign up form. You can send people to another website, all by designing a an image like this and writing in any kind of text. Just make sure it's It's a well designed here. Ah, we took the same color of the sky. We've got a nice, bold fought there, so it really grabs the attention and it flows nicely. So there you go. That's for a second footer area. 51. WPC 48 Footer area 3: All right, let's configure our third area of the footer. So let me just show you again where that area is exactly. So here on our front page, go down to the footer and we've got our foot Area one with this recent posts and we've got our foot area to with our image pointing to our image gallery. Now we're going to configure our for the area three. So let's head back to the dashboard, actually, from Sorry, I forgot to point out something here from this menu here. If you're viewing your site, you can head right to widgets. So that's a faster way to get there or just go to appearance and widgets, and then you will be there. So footer Area three is We've installed this text widget year, and here we can either put in straight up text as if you're writing a block post, and so we can add that in, or we can put in code html code. Now you don't have to be. You don't have to be an expert at writing code that you all you have to know how to do basically is to copy and paste. So here we're gonna add a YouTube video to our footer area and this is called embedding. So I've already selected a video here that's, ah, relative to our topic. And here, once you selected video, you're going to go to the share tab. So click on the share tab and then you'll get this, ah, line of code so you can just straight up share like this. But if you want in bed the, um, the video into your website and specify the size of the screen, you're gonna have to go into this embed option. So here I'm going to go into show more, and there's a preview of it. And I found that the best sized for this was 3 60 by 203 so that will size it relatively small, and it will fit nicely in that foot area now. Other things you condone show here is show suggested videos. When the video finishes, I don't want that show the player controls. So if you want to hide all the controls, you can ah also have that and video title and player actions. If I select that, it's just gonna have the video. It's a bit cleaner, so Let's let's get take off those controls to it. That's a bit neater. So once we sick of modify things here, the code up here that we need to embed in our website automatically refreshes. So all we need to do is select all that copy it and head back to our widget area widget area three, and paste that code into this section of this text widget. So once we've done that will save. And then we're gonna go preview it in the front end of our website by going up here to home fitness and visit site, and we're on the front page. We're gonna navigate down and sear. We got this. Great. Ah, fitness video and weaken. So we get a 10 minute AB workout here. And so on this setting, you can't fast forward or go into any other section of the video. You can only watch or pause, watch or pause. There we go. So that is how you embedded a video into your site and how you can embed that video into a footer widget 52. WPC 49 create logo and upload: let's create a logo for our website. So from the dashboard here, I'm going to navigate Teoh front end of the site. So we see her home fitness front page here. And what we're gonna do is open up a couple of pages and ah, we're gonna access one tool that if you're using a Macintosh computer, you should have right in built into your system. So let me show you what we're gonna be using. So we're going to need to open this color wheel here, and this is online. You can access this at color dot adobe dot com, and color is spelled c o l r. So open that and also open your the pixel er editor. So that's at P i x l r dot com and open these under new tabs in your browser. So you get this on your front page on one page. You got your color wheel on the other page, and you've got pick slur here, and you can always move your tabs around like that. Just drag and drop your tabs to move around. So if you're on the Macintosh, you will need this app. It's called, uh, just go to your inspector up here, your little magnifying glass and type in color. And you should get this top hit here. Digital color meter. So click on that and it's gonna open this app here, and what this does is wherever your mouse is, it will give you the exact code of that color and the way to copy paste. It is You go, ah, control shift, see So control shift see, and that will copy your color. Now, if you don't have a Macintosh, you can get the very similar tool that plugs into your browser, and it works on chrome and Firefox, and that is called color Zilla. So go to color Zillow dot com If you're on the PC, if you're running Windows, you can get the same exact thing and it'll just show up like button on your browser, and you can click that and just get the same code. So for now, I'll just be explaining it in the way that I'm doing it on the Macintosh. So let's go ahead and create our logo. The first thing we're gonna do is go open a new file in pic slur, So to do that, we're going to create a new image and we're going to name it logo Home Fitness. Okay. And the presets, the the image size that looks great in the customizer theme for the logo is 2 50 with 2 50 by 100 height. So that way it's it's small, and it's gonna load up really fast. Do we want it transparent? We're going to say transparent. I'll show you what that means later. Okay, here we go. And we're gonna down here. We consume into 300%. That didn't really go in here. Here we go. 300. You can set this to anything you want. This is just the the size were viewing it at now on this side, you're going to see layers. And what you want to do is add a new layer and just go to this. Ah, and just go to this paint bucket here and here. You This is the color selector. So you're gonna select. You're gonna select white up here, make sure it just says f a bunch of efs, and then, you know, that's that's white. So we're not actually going Teoh. Next step is just to paint your layer so your layer number one here should be painted white . Okay, now we're going to give to the text tool. Just click on the A here, and we're just gonna use Ah, this layer Teoh, preview what our logo looks like, and we're gonna turn it off later so that our logo is transparent. So what we're gonna do here is going, Ah, get a new layer. And with this textile weaken type right there and we're going to type in home. And right now we don't see anything because they're color is white. So right now we have to go and pick a complementary color. So what we're going to do is go back to our site. We have it on another time here, and we're gonna get our digital color meter and highlight this. Put the cursor over this green color. Now, once its green color, you can look over your mouth and ah, press apple or a control shift. See? And you see, there it's copied the color. And now we go to our color wheel, and we're gonna paste this into this bar here. And this will give us a really nice color palette to work with. So you paste in hit, enter And there you go. You've got really nice colors to work with here. And depending on where you depending on where you paste it, you can get different different color schemes. And you can also move this around and you get a wider, wider spectrum here. So this is where you can get really creative with colors. So there I've got a nice palate. Here's my original color. There's the hex code. And so the 1st 1 I'm just going to use the same green that's in the site. So I'm gonna be using this green here. The home is just gonna say, stay the same color and I'm going to paste it back into pick slur by using this color picker and here, down down here I have bar work and copy and paste where I can paste rather the the color. So I hit OK, and right now you have, um, you can switch through a bunch of bunch of fonts here, and it you can preview right away, so it's really super nice. So I'm gonna STIs I'm gonna pick this one avatar and my font is 46 If you want to change the front, you just have this slider and you can Sheen's that like that. So when I hit, OK, and then my next word, I'm going to put on a new layer. So I'm just gonna click this button here that says new layer beside the garbage can. I'm still in my text tool, the capital A and I'm going to type fitness Way to go fit this. Okay. And now the color is white. So we're going to change that, and we're gonna grab a complementary color from our color wheels. So how about this? Nice yellow here. No control. See clips collect to pick, slur. And I'm gonna piece that in right here with the color code and there. So I've got home fitness, and now I can move these around wherever I want. So just go on this pointer tool here and make sure you're moving the right layer. So you've got it. Says what it is to you. If you've got text in it, it will say fitness and the home is there so I can move it around. I can also go back to this text tool, Aiken. Type that and I can change the font size. Yeah, it changes right away so I'll just make that a bit bigger press. OK, I go back to my pointer, so just choose a nice alignment for it. Ah, let's see. That's That's probably pretty good. I think I'm happy with that. So last last part here, I'm just going to turn off that that layer we had that's ah, are white that we dropped in with the paint bucket and I've got a Now I've got a transparent background. So this background will take on the color of our our website because arouse if you leave the white, you're going to see a white square around this and it won't look to get so for the last step here, we're going to save our image. And since we need want to preserve this transparent background, we have to save it in a specific file type. So most the image images you find online R J pegs. And that's a common, very common extension on file type for for images. But we need Teoh file it. We need to save it as a PNG. So the PNG file type will preserve this transparent background. If we save it as a J peg, it's going to put a white background onto it, so just make sure you save it as a PNG. So we're going to you go to file save and here you see, we almost got caught here. It's Ah, it's saved it. It's suggesting to save it as a JPEG. We need to go down and select PNG and see it says on in parentheses. Transparent, full quality. So there we won't lose any quality. And we've got our transparent background that's gonna save to our home fit in this folder on a computer right there. We've got our title because we've already named it and it's got the PNG extension, uh, after the the title here. So just make sure you have a dot PNG after your logo and you learned your logo name and you'll get this. Ah, you'll get this transparent background so it's going to go the home fitness image on the computer and hit save images saved. So let's go to our word press. Um, dashboard here, we're going to go straight to the media library, and we're going to upload that image that we've just created. So for media library, Add new and we're going to go to select files were in our home fitness images here, and we're going to select logo Home fitness. There it is. Choose. And there you go. We've got uploaded our logo to our media folder. 53. WPC 50 replace logo: Now we're going to go ahead and replace the logo that we have currently with the logo that we've created are, in other words or custom logo, so lets navigate straight to from the dashboard. I'm in the dashboard now. We're going to navigate street to appearance and customize in the customized menu. We're going to go to global settings and in global settings. We're gonna find logo and fabric con. Click on that, and here is the place where we can upload or custom image. Now notice that our logo right now is more like a title. It just takes on the font that we have. We set in our theme, so we're gonna go ahead and replace that with the our logo. So here, just click on this select image button and we've got our media library. Here's our logo, and it's got the right size to it. It's to 50 by 100. It's a PNG so we can go and select that. And here we have, ah chance to crop the image. But since ours is already correctly sized, then we don't have to do any other modifications to it. So which is hit skip cropping here and there is our logo so we can save and publish that and let me show you why it's super important to have a transport chance. Parent background on a logo. We're gonna visit the front end of our site here and there's our logo. Watch what happens once we scroll down a bit. We have you see, the the, uh the logo reduces in size and has this kind of you get this Ah, sticky menu and it's semi transparent. But since our background it is transparent, we we can see transparency right around the logo. If it were a J peg or if we didn't turn off that white layer in in pic slur, we would see a box around this. So that's pretty amazing that you can see you can see right through this area of the website right up until the letters. So that's the importance of saving your your logo in a PNG file with a transparent background and you get this awesome effect when you're, um, scrolling in the with the sticky menu. So there you go. That's how do you create a custom logo? So practice with the one in the home fitness site and then you can apply the same principles for your own personal website 54. WPC 51 blank front page: Now, this is something you might want to do with your site. And, um, it's just a question of removing some text on your front page and I'll show you what I mean , Here in a second, we're gonna visit the front page of our site. And once you scroll down here, we've got this texture. This is our wonderful home page. Now, say you don't want any text here. You just want your slider. You want your featured pages and you would just want your footer. Ah, all we have to do is go to dashboard and we go to pages, all pages and we've got our home, which is we say we see that it set as our front page. We're just gonna edit that and we're going to take out this text here and click Update. And now when we visit this page, it's going to take us right to the front page of our site and we see that we just have our featured pages. We just have our slider and her footer. So if, um, you want to really clean front page of a site, you can set it up like this, but there's nothing wrong with having a front page with some information on it. Okay, so that is how you take out that that line of text from the front peach. 55. WPC 51: So we're gonna be setting up a sign up form and you see the sign up form right here in the sidebar. And we've got Ah, a place where your visitors can fill in their email address first name, last name, and the reason they would do this is to subscribe to a mailing list. Or usually it's to get ah, access to some form of premium content. So this could be, ah, photo of images. This could be audio. This could be video. In this case, we're going to set up this image toe linked to a free pdf that visitors will access once they finish filling in there for information and clicking this button, get the free. PDF let me show you how this works. I wanna fill in one of my email addresses here. Okay, So once I click on, get the free pdf it's going to say thank you for subscribing, and this page is called a thank you page. So it says, thank you for subscribing to our list and then the your your visitor would get access to your premium content. So in this case, it's free pdf so that you have to click on this and they get a wonderful PdF of a workout routine right there so they can save the stair computer, their computer, and they'll have this premium content to work with. So one thing I wanted to point out about this thank you pages that normally somebody that's navigating through your site can't get to this Thank you page. They don't have a way to get to it now. It's not protected in any way. So if somebody had the u. R. L, they could get to it. Ah, but usually that's not the case. And I wouldn't worry too much about something landing on this page by accident. You can usually just set this up and have it be attractive enough that somebody would enter their email and subscribe to your list, and they would get there premium content for doing that. So this is the special U R L that the that the visitor will get to once they sign up to your form and notice that it says session filler dot com ford slash Thank you. And I just all I want to point out was that this is not linked in any other way on the site . So you the only way to get to this page if is if somebody subscribes or if they if they know this u R l But that would be very, very rare. So this is a very popular way of attracting viewers. Teoh, sign up to your email list and there's all kinds of ways to do it. But this is really the simplest way. So let's get into that. And I'll have to warn you that this takes quite a bit of jumping around with different elements, like your email service provider. We're gonna download some additional plug ins to make this work, and you're gonna be skipping around a lot. So I hope you're ready. Don't get discouraged with it. If if you you find that your lost just go back, look at the videos again and make sure you haven't missed any steps 56. WPC 52 create thank you page : Okay, let's get started with creating our lead magnet and our sign up form. So the first thing we're gonna do is create a thank you page that will show up after somebody signs up on the email sign up form. So to do that, we're going to go to the pages toe all pages, and we're going to go to add new. So this is this page. Think of it is like a gift page or the the ethical bribe page that somebody's gonna land on and they're going to give get their gift after they sign up to your email list. So here, we're going to title the page as thank you. And here we're going to write. Thank you for subscribing to our list. And under that Well, right, here's your free workout. Okay? With an exclamation point. And I'm going going to place this in the center, so align center. And I'm also going to make this a Z large as possible. So that's heading one. Okay, now, below this, we're going to and two things. First, we're gonna add an image. So we're going to click on add media and upload files. Select files from the computer. And if you don't have this already in your media folder, um, it's going to be ah, in this folder that you've downloaded and it's gonna be free workout picture. So that's a J peg. So we're gonna choose that, okay? And we're going to link to something here. So we don't have We haven't set that up yet, so we're just going to say, insert into page. We can. We can change that after anyways. So what we're gonna do now is just a line center. And next, we're going to published this page. Stay with remote for it to save here. And also, if you're if you haven't uploaded the pdf yet, I'm just going to show you how to do that. We're gonna head to our library and add new select the file, and we've got the free workout dot Pdf. So there we see the free workout. Okay. Now, all we're going to do here is grab the u R l of this. Pdf so that when somebody clicks on the picture, they're going to get this. Pdf. So we've got copy and peace this year. L here command, See on the Mac and control C on the PC, and we're going to head back to our pages. So go back to pages here, all pages, and we have our thank you page here that we started. So now we're gonna click on the image, and we're going to click on this pencil. It's gonna, uh, permits toe edit the page. Now we can link Teoh here. We have a bunch of options here. Attachment page cuts, custom your l we can link to none. But since it we're linking to a media file, we're gonna leave it as media file. And once we've selected this, we just have to paste in the u R l from the pdf we've created. Now, you can tell this by just kind of reading this long line of of, ah html here. And at the end of it, it should say the file names the feet. File name is free workout dot Pdf. So we know it's the right one. And then click on update. And now we're gonna update this page, wait for it to save here, and now we can view this page. Okay, so now it says thank you. We've got our sidebar here because we've said our sidebars up that way, and we've got this picture warm up since dynamics stretches free Pdf. So somebody's gonna be inclined to click on that. And once they dio, they get their free pdf. So that's their free gift that they get for signing up to your list. All right, let's go and set up the rest of, ah, the elements in this lead magnet and email capture. So I just wanted to point out one thing about the layout of this page. Say you don't want this left sidebar here. You always have to an option to override the default setting of the layouts of all your pages. So to do that, we're just gonna hit edit page up here and we'll notice here that here it's in the layout options. It's set to default layout, which is left sidebar. Now these are all our override options. The, uh, thing I would do if I was setting this page up on a real site would just be to select. No sidebar is full with layout. So let's do that and update the page, and we're going to go view the site. Just updating now and Now we're gonna go view this page and will notice that the sidebar is gone. And we have this nice focused page where the only thing really to focus on is, uh, this women's really nice abs. So? So, there you go. That's a way to customize your layout. Override the default setting you have on your side bars. 57. WPC 53 setup mailchimp account: Let's set up our email service provider, which and this example is going to be male chimp. There's lots of others out there, but mail chimp is a good one to get started. If you don't have an email service provider yet, basically you need two things for this to work, you need your email that you've created, Uh, that's with your domain. So the one we created that's called info at home fitness dot Whatever your domain is dot com, that's gonna be the email we're going to use in this to create our list. So let's just get started to hear. Just head over to mail chimp dot com and you're going to create a new account. So just, ah, go to mail chimp press on this log in button. Or if it says creating an account there, just press on, create an account, and here you're gonna creek, click on the you create an account link here, and it's gonna ask you for your email address, and you're gonna create a user name and password and you'll set up your account. That way, you're gonna have to validate it through your email, and once you've got em gotten through the steps. Just log into your account. But I already have an account, so I'm just going to sign in here. So log in. Now. The first thing you want to do when you get into your account is create a new list. So you have to list and he's here all my lists and you're going to click on this button here, create list new Lister Group, and you're gonna see create list. So let's name just home fitness and the default from email address. So this is the one we've created here at our domain. So info at home Fitness. I don't session fiddler dot com. Now, this is the part of your email address that is going to be different because you're gonna have your own domain right here. So default from name, we can say just anything like fitness expert. So here you have to remind people why they got onto your list. So we're just going to say, Ah, pdf download. Okay. This contact information a male chimp requires is contact information like a real address that you can ah, so that people can identify you and notifications. Ah, this is notifications that mail chimp will send you about your this list to you. Your account that you created your male chimp account with. So there's daily summaries one by one or one by Rome subscribes and one by one unsubscribe . So we're going to save this list now. The important thing, really is the list. Name your default from email address. And this this one is important because the domain this domain has to match the domain that the capture is on. I've tried to enter a different email address than what the domain was, and it wouldn't let me do it. So once we get to this page will have created our list that's named Home Fitness. And if we have new subscribers, they'll show up here. So that's it for this step and see in the next video. 58. WPC 54 download these plugins: So we're gonna have to download one plug in and one widget to settle this up. So just gonna direct you to you Plug ins section and I've already gone ahead and downloaded these, but one of them is called easy forms for male chimp by Yikes. And the other one is called Short Code Widget. So this one is actually going to run the ah place where you put in your email name and, um, contact information, and this one will enable us to put the short code into a sidebar. Okay, so we'll let you go ahead and download those. Just go up here to the plug ins and add new, and then you're going to search for those two plug ins here and download both them and activate them, and then you'll be ready to go 59. WPC 55 connect wordpress to mailchimp: So now we're going to connect our mail chimp account to our website. So to do that, we're going to go to plug ins here and click on install plug ins and then find the easy forms for male chimp by Yikes in your plug ins list and click on settings from settings You're going to go to general settings, and it's gonna ask you for your A P I key from mail from your mail chimp account. Now you don't really You don't have to know what that is. I've got minority filled in here, but here in very small funt, you're going to see a link that says, Get your A P. I key here so quick on that, and it's actually pretty easy to get. It sends you straight to the page. If you're already logged into your account, it's going to send you to your account and you'll be able to just go down to your A p I key right here, and copy and paste that to school control. See and paste. Go back to your WordPress tab and paste that in here and click save changes. So that's all you need to do for this step in order to connect your email service provider with your website. So there you go on. I'll be seeing you in the next video. 60. WPC 56 finalize your signup form: All right, let's go ahead and create our slant up form. So from the dashboard, we're going, Teoh, navigate down. Too easy forms here and from easy forums. We're gonna go to opt in forms, and here we're going to create a new form. So right up here on the upper right hand corner, we're going to see a box that says, create a new sign up form. So we're going to give it a name, this case home fitness. And the description will just right. Um, get your free P D f. Okay, The associated list is our list of of Well, it's there are lists in male chimps. So I have a couple here. If he was just open your account. You should just have one. So that's the proper list, and we're gonna hit creates. Okay, so there's a form name that we filled out. There's a description that we felled out. Now, this is the form builder here, and how this works is you select which form fields you want and add them to the builder. Just easy. Is that first name at to the builder last name. Add to the builder. Now in this tab here form settings. Click on that, and it gives you additional options. Um, you can display this in a on one line and in line form instead of, um, in ah, stacked one on top of the other. You can change your submit button type. So instead of submit, we're gonna right here. Ah, get Get the free pdf. Okay. And that's about those are the main things. Weaken, weaken. Ah, customize their custom messages. There's, ah, success message. A message that you condone, uh, customize. And so let's go back to the form builder here and here you have some additional settings for your form. So you have associates associated list settings. So that's a more options that we don't really need. From now. There's there is one. Ah, you here you can choose. I mean, there is a sitting here that concerns us. Let me just find it him. Here you have a single adopt double opt in Utkan. Just choose the single. That's fine. Send welcome email. Uh, just choose no update existing subscriber. That's not really really relevant to us submission settings. I think it's in here, so it's right here. Redirect on submission will click Yes, Select a pager posts. So this is the page we put we created before. It's the thank you page. That's where people are sent to. After the sign, they put their information into the sign up form and they get their gift on the thank you page. That's where our pdf link is, and that's where they can download it. So we'll set it the thank you page and interest groups. You don't need that for now. So update the form. Great. And now you just need to grab this short code here and select it and copy it, and we're going to go into widgets. So go to appearance and go to widgets. Now, from widgets, we've installed this short cord widget. So grab the short code widget and bring it up to the left side bar. Drop it into the left side bar and paste that short code into this content field it save. And now on the right side bar, you want it? Dragon dropped the same short code widget right into the top and pace that same code. It should be still on your clipboard into that into this area. Hit, Save. Now let's go check out the front end of our site here. We're gonna visit the site and we're gonna visit a static page. Let's go to the mindset page. And here we have our email sign up form and here it says, Get the free PdF let's see what it looks like on the blog's side and we see that it's right up here. Now let's say we want to make this a bit more enticing for the visitor of your site to sign up. So what I've done is I've created the image and we're gonna place that image just above the sign up form, and it's got some text into it on it, and you'll see that. Ah, it really adds some some flair to that sign up form. So I'm just going to go to the media library here and add that image. And if you've uploaded this whole folder, it should be already in your media library. So I'm gonna go add new, select the file, and I'm going for my sign up form pick right there. Okay, there it is. So I'm going to grab you are l from this one. So if you have this into your library. Go locate the sign up form pick and grabbed the URL. No control. Copy that. You are l And then go back to widgets like two widgets here. And we're going to add an image widget to our sidebar. So here it's part of jet packs. So hopefully you have installed and we're going to bring this up to our left sidebar and stack it on top. So image your l That's what you paste here. And I know that is pasted well, so it's sign up. Form picked out. J Peg. That's perfect image title caption. We don't need that. Ah, alignment. And, uh, we don't need that. I think it's probably the right size link. You are l When the images clicked, We don't want anything toe happen, and we're going to save that, okay? And let's do the same thing. Well, let's go check out what it looks like first, so it's gonna be on lower left side bar. That's part of our static pages going to mindset and perfect. So it's a sign up and get a free warmups and stretches exercise routine, and then people sign up here and then this is get the free pdf. So, um, we can go ahead and add that to work post pages as well. Let's do that right now. We can just go straight to widgets from here, and we're going to that image widgets. And here it is, that same widget, and we're gonna add it to the right side bar and stack it on top of all the widgets and we still have that image. You are well on our clipboard. So we're just gonna paste it in here and hit Save. Now we're going to go check out the R block posts. So we're gonna go to our block here and click on one of the articles. And there we go. We've got this little area and it's actually two widgets, but it ah, it displays is one. It kind of looks like one, but it's actually two widgets. So what I'm going to do now is just submit one of my email addresses just to show you what happens here, I would say, Uh okay, so I've got one of my email addresses and I'm going to hit. Get this free. Pdf. Thank you for subscribing, and it redirects me to this page. It says, Thank you for subscribing to our list. Here's your free workout. So you click on that and I got my pdf. So there you go. And what happens here is that somebody's got Ah, there, they're free. Pdf pdf They've got a something of value that they got for signing up to your list. And you've also captured their email, which is Ah, on the email. That's, um, associated with your domain. So there you go. It's, I know it's a lot of steps to set this up. Once you've once you have it set up, then you could really get ah into creating an audience and marketing to that audience.