Build a Business Website with WordPress | Alexander Oni | Skillshare

Build a Business Website with WordPress

Alexander Oni, Web Developer & Cyber Security Expert

Build a Business Website with WordPress

Alexander Oni, Web Developer & Cyber Security Expert

Play Speed
  • 0.5x
  • 1x (Normal)
  • 1.25x
  • 1.5x
  • 2x
20 Lessons (1h 60m)
    • 1. Welcome to the Course

    • 2. Connect with Me

    • 3. Siteground Special Offer

    • 4. Choosing our Business Theme

    • 5. Adding our Logo

    • 6. Configuring the Header and Main Menu

    • 7. Adding our Business Slides

    • 8. Creating the Our Services Section

    • 9. Creating the Who We Are Section

    • 10. Creating the Our Clients Section

    • 11. Adding our Portfolios

    • 12. Adding Testimonials

    • 13. Developing the Blog Page and Section

    • 14. Setting up the Sidebars

    • 15. Creating the Team Page

    • 16. Creating the Service Pages

    • 17. Building the Contact Us Section

    • 18. Creating the Contact Us Page

    • 19. Setting up the Footer

    • 20. Conclusion

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

This is a class designed for WordPress users who would like to learn how to build a business website either for themselves or for a client of theirs.

For this class, we are going to build a business website for a fictional company known as Web Coders Inc. This is a company that specializes in web design and marketing amongst a few other web based services.

We will be making use of theme known as Business X and also a few plugins to build out the entire website. The website will be made up of the following:

  • A homepage
  • 4 different pages for services
  • A Portfolio
  • A blog page
  • The contact us page

We will also flesh out the header and footer sections as well as add some designs to make the website look stylish.

Meet Your Teacher

Teacher Profile Image

Alexander Oni

Web Developer & Cyber Security Expert


My passion is teaching people through online courses in a fun and entertaining manner.  I have been teaching online for about 3 years now and during this period, I have created over 25 different courses on different platforms including my own personal platform - The Web Monkey Academy.

What would you like to learn?

Would you like to learn how to build and manage your WordPress website? Would you like to learn advanced skills that will make you a true WordPress developer? Would you like to learn how you can establish a successful career as a web developer? Would you like to learn the basics of information and cyber security?

 If you want to do any of these things, just enroll in the course. I'm always improving my courses so that they stay up to dat... See full profile

Class Ratings

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

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

Your creative journey starts here.

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

Why Join Skillshare?

Take award-winning Skillshare Original Classes

Each class has short lessons, hands-on projects

Your membership supports Skillshare teachers

Learn From Anywhere

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



1. Welcome to the Course: Well, hello and welcome to this course. Build a business website. With what press? My name is Alex, a k a. The Web monkey. And it's a pleasure to have you here. This course is designed for what? First users who would like to learn how to build a website for their business or maybe even Web developers who would like to build a business website for a client. Now, this course you're gonna let how to make use off at what press theme known as business eggs and a variety of plug ins to build out this full fledged business website. We're gonna be creating an imaginary company called the Web Quarters who specialize in the design SC when markets in. So in this course, we're gonna build out a website for the company and you can see right here from front page . We do have slides indicate in this service is one about the company. And you can also see that we do have sections, full testimonials, blawg, but folio and someone. I'm also going to show you how to build out pages for the services as well. The block page. I'm gonna show you how to quit put further page and of course, a contact US page as well. By the end of this course, you'll have acquired skills necessary to build out a business website, either for yourself or for a client off yours. So who am I as an instructor? Well, I am an experienced what press developer. I have been building websites with what persuaded past eight years now and during that time of built over 100 websites, including websites for famous clients like Johns Hopkins University and even Gold's Gym. Also do have a YouTube channel where I upload tutorials regularly and my videos have been viewed over millions hands already. So I definitely do have the necessary experience and skills to teach you this course. So that's what I hope you signed up for the course today and I hope to see an inside let's get started 2. Connect with Me: thank you once again for enrolling in the course, and I wanted to use this opportunity to official introduce myself to you. Now, if you're watching this video and you notice that the bagman is different, I look a bit different from the rest of the course. Do not be alarmed. This is because this particular video is very, very new. It's a lot newer than the rest of the videos they're gonna watch in this course. So that's why things look different. But I wanted to make this video to introduce myself officially to you and also provide you with several were upset that you could learn more about me or get in contact with me. So I do have a YouTube channel. It's called the Web Monkey, and there it is right there. So if you're interested in learning more about what press and letting extra tips and things like that, I do have a channel for that. You can subscribe. Hit the bell so that you notify whenever I upload new tutorials. I applaud Eli's once every week. Try to so if interested, I do have YouTube channel for you. I am also on Facebook. I do have a page on Facebook about Bunky on line again, just like YouTube by post tips and things like that. So if you're interested, you could like the page on Facebook and follow me right there. I also I'm also on LinkedIn. So if you're each connecting with me on a professional level, I'm on LinkedIn. Alexander only that's me. Simply send me a message saying that you're a student of mine and then police tell me the course you enrolled in, but also the platform you're in accordance Whether you're involved in my course on your enemy on skill chair or non profit platform. Do let me know I'll be more than happy to accept your invitation to connect. And speaking of my own personal platform, it's called Bad Monkey Academy calm. I do have similar courses in there, but you would find also on skill share or you to me. The only difference is that on Lemack Academy, you're not only my student but also my customer. So students here to get a bit more for special treatment from May, plus the courses you'll find inherited to have more content than what you would find on you , Timmy or on sculpture, so it's entirely up to you. But if interested, be sure to check out my own personal platform. I also have a blawg monkey. Orlando. Come where again? I write articles and articles on topics like What process? Your security plug ins, themes, things like that. So if you're interested, be sure to check out the Blawg. I also do have a newsletter to get here. All you need to do is to simply click on Animal of the blogged articles, and then at the bottom you will find you can subscribe to my newsletter. I send out newsletters for more tin, my new courses providing with tips and things like that. So if you're interested, be sure to check it out. And then finally, I do have my own personal upside. Alexander only dot com. So if you're interested in any more about me, how I became a course create or things like that website is there for you. So that's it. Thank you so much again. All of this is entirely up to you. You don't have to do it. But if you're interested, these are the websites where you could follow me or get in contact with me so that I think if watching now, let's get on with the actual course itself. 3. Siteground Special Offer: Well, hello and welcome to this very special video. If you're watching this video, that means that you are a pain student of mine. Evil on the monkey academy platform. Are you Timmy on skill share? Wherever this video is exclusive to students like you. Now, if you've never heard of site ground In my humble opinion, they are the best web hosting company in the world Now. I've been working inside ground for many years now. I'm in. I mean, by working. I mean, I've been hosting with them, and I'm also and I feel it for them as well. Now I've been able to get them to provide you with a very special deal. If you're interested, side ground will provide you with one free month off hosting. This will give you the opportunity to check out the platform, check out their hosting services and build as many upsets as you want without paying a single dime. Now I'm gonna provide you with a very special link. When you click on that link, it will take you to this page and you can see it right there. It's a special offer for the monkey students. That's the logo off my share of my brand. So this is special for you. One month free hosting. You don't have to pay a single dime. All you have to do is just simply click on the sign up. Now, button. Okay. And then this will take it to a very special Pedro. You add your email, your password filling your information and then in here can see hosting price is zero. You don't even have to provide your credit card details. Nothing. Now, period. Here is one month now. The data center in here is quite important. Make sure you choose the date is, and that's closest to your physical location. So, for example, if your summer in Asia like, let's say, India, you want to go with Singapore, even you. Up you go with either European or UK in South America, North America, you want to go with the United States. So that's very important. Because when you choose a Dennison that's closest to your physical location, your websites would load faster. Now, if you decide to go along with this and sign up for the free one month with side ground, I have made a very special video for you on video. This video will introduce you to the backhand off site ground. I will show you exactly how you can create websites and stole what prayers creates sub domains at SSL. Things like that. Everything that you need to get comfortable working with the back end offside ground Provided you with all the details. Now why side ground? Like I said, I have been hosted with them for many, many years now and I've never had off course to cancel and go elsewhere. I can stick my interpretation on these guys. These gays are amazing even votes a very extensive article of my blawg. Why said God is the best reporting company in the world and it's very, very extensive. I included are facts and figures from polls on Facebook, different kinds of information and I basically let it out here. Why side ground is the best, So don't take my word for it. Read my article. You can even go online. Deal research side ground always pops up whenever people talk about the best Web hosting companies in the world. So, once again, this is a very special exclusive deal for you. You can check out Saigon for free for one whole month. I'm gonna provide you with this very special link you will send up. And then I'm also gonna provide you with the link to the Vineyard video Exclusive to you. There are introduce you to the backhand. Just about everything that you need to get comfortable are walking with site gun. So that's it. If you have any questions about this, of course, be sure to let me know. Thank you for watching. And of course, be sure to check out the free video on video. And, of course, get your one month free hosting with side ground. 4. Choosing our Business Theme: All right. So Hello. Welcome to the very first video and this section. We're gonna build out a business website. As you can see, I do have my your l web code, as that has competed. Com. So the very first thing we're gonna do here is we're going to install our theme. And the theme I'm gonna use here would be a business theme known as Business X Joseph in which is actually a child theme off the business X theme. This is a team I discovered after some research. And I'm really excited to show you why this theme is actually a very good one to build out a business science. It has lots of different kinds of features available for you, and it's really, really good. So let's go ahead and quickly install this theme. I was jumped on here to appearance. Go to themes. Let's click on, add new. All right, I'm gonna type in business. Business X. All right, so here it is, right now it's business X. Joseph in. Let's go ahead and install this and let's go ahead and activate the theme. All right, so you can see right now that we now have two additional themes installed where you have the business X, which is the actual parent theme. So this will come automatically. But you can see that the business x Josephine, which is the child theme off the business, exclaim, is active. Awesome! Now over here you will see that it stays this dim recommends that full employments business X extensions and jetpack By what personal calm. So phenomenon. To go ahead and install these two plug ins. Let's do that install, apply. But you can see we do have some sort of one in about the ah business X extension. Let's go ahead with first this page. Just make sure that we don't have any issues. Okay, well, that was just in a row. It's not really an issue. Let's go ahead and activate business. X extensions activates a jetpack as well and cool already. So we now have this duplicates installed. Let's jump down here and take a look at the site now and see what it looks like. And ah, okay. We can see the noticeable difference already. Cool. Let's go back to the back and and make some changes. I'm gonna come down here to set sends Go to General and let's change the site title to Web codas. We are the Web, Koda's and if a tag line and we're going to say websites s CEO and Traffic. So these would be like the three main services that we offer as a business. I'll school down here, make sure nothing that needs to be touched. Cool. All right, let's save my changes, save the changes and then let's come down hits you prima links as well. And let's change. Let's go from the plane sitting down to the post name setting. I'm gonna go with this one. Let's go ahead, save change here as well and all right, so business X theme is fantastic. And if you really want to take a look at the features this theme offers, you can come down here to appearance, click on, customize and then over here, Let's but for a few minutes. Okay, so you're gonna see this message that would say, Hey, would you like to add a static front? Page is your home page and it says this will add a page called the Business X Front page. Yetta. Basically, this thing will offer to provide you with a custom home page and I'm just gonna go ahead and in so different pitch. Let's do that. This is actually pretty cool. Let's do that instead from page. So now we have the custom home page has been put forth by the female show you that in just a second. But for me right now, if you click on site identity, you can begin to do several things like adding your logo, making the local sticky from pick sections. This is where you can build out your front page. You can add features your bout of section team section and students of 40 connects lines. And this is a thing that has a lot of different customization. Options are for you. So the next few videos we're gonna be working with the available features and I'm gonna build out are the home page for our set. But before we do that and just quickly show you the custom pages Windproof Ross. So I come down here to all pages you can see now that we have the business X phone page doesn't pull force automatically, and we also have the block page that has been created Force automatically. And if we come down here, the settings click on reading. You can see that by default. We now have the business X front, page said to a static page. And then the post pics said to block automatically all because we allowed the theme to insert and create the static front page for also, if you go back to the front page now, you can see, though this is exactly how from pitch looks like. And you can already tell that we can do some really cool stuff here. We can add slides and the beginning. We can edit the features, provided the services that we offer like a brief description. And then down here we can add, like in about also section describing who we are, the team heading clients head in portfolio testimonials and so on. So I'm really excited to build out this business website with you using this particular theme. That's the German of any class available step by adding the logo for our website 5. Adding our Logo: All right, let's add the logo to ah site. Now, before we do this, I don't introduce you too. Can Votto? Coma? May have already mentioned the sites to you. If I have, you can just keep this next few minutes and move on to where I at the logo. But if you're not familiar with Canada, can vie is and is a really awesome Web resource where you can create different kinds of images for your YouTube thumbnails for your upset logo, your social media posts and so on is gonna sit down here right now. You already have pre built templates for card, email, header block, banner, instagram post over here as well. You have the ones for Tom Love, Facebook, Pinterest, Twitter and so on and so forth. And down here you can see some of my designs. I can say I have walked on the Web quarters logo. There's are several different versions. I can see some of my other designs from my YouTube videos, one of my here for a video game that like to play. I won't talk much about this, but on the logo, you can see that you also have several different free designs for use as an example. If you like Sunshine Studios, for example, you could click in here and just simply modifying the text. You can change the color, change the design and so on. So really can ver dot com is a site old strong recommended to visit to create your locals now very quitted mine. So to add a logo, I'm going to jump in here to the back end. Just go straight appearance, Click on, customize And from here I'm gonna click on site Identity and I'm gonna come down here. Then you could also choose the kind of logo that you want to go with text or simply go with an image. I'm going to go with image. So let's go ahead and select logo and I do have my logo right here, which I've already created. I'm gonna hit, select, and then I'm gonna crop the image just to make sure that everything is captured. So let's bring this down here just to make sure that all the lines captured cool. I'm gonna go ahead and hit crop image and there you go. Web coders. Since 2008 websites made easy has go ahead and publish this. Let's close this. Let's jump to the front end and that's what looks like Cool. Not bad at all. Websites, Web coders Websites made easy since 2000 and eight, that is a low goal. So that's it. We have successfully created and added a logo to our site. Join me. The next glassware will walk on the header for our business trips like I'll see you then. 6. Configuring the Header and Main Menu: Now that we've successfully added the logo to our site, it's no time to create the main menu and also make some changes to our head up. Now let's jump in here. Let's jump two pages. What I'm gonna do here is I'm gonna create too quick pages. Let's go with the contact. This page will go ahead and publish this page for now. And let's just quickly add another page as well. Let's just wait for this to be published to Sorry. Published, published, published Go ahead at any page And let's just say Ah, the team. All right, What's politics page as well. Publish. Come on, let's go. All right, now I'm gonna jump country appearance, Click on menus and I'm gonna go ahead and create main menu. Let's create the menu. And what I'm gonna do is I'm gonna add the blood page to contact those page and then the team page. I'm gonna add these over here and then for the display location. I'm actually gonna choose the actions menu. I save that. All right, cool. Now, if I jump over here to my frontpage now, you can see that this is where the actions many displays. And I like the design. I think this is really, really cool. Now let us make some changes to the way the head actually works by default. If I scroll down, you can see that the header is sticky main meaning that they had a still persists. Even if you scroll down, you can still see the head up, but we cannot see our logo. So what's happening in here? Let's go to you, customize and let's jump down to cite identity. Over here you have the sticker logo and it's a Zschau logo on school. If you use this feature that low global shop ive the menu is sticky on school. Now, for the purposes off experiment, I'm gonna take this box, Let's go back and I'm gonna come down here to settings, then understand isn't gonna click on head up. Now, take a look at this. You actually have four different ways off this plane. Your local. You have transparent, sticky meaning that when you school down now you can see that the logo is still there. But here's the problem because it's sticky. And because the logos text isn't white and the bag isn't white, we cannot see the logo. Also, my logo was a PNG minute. It has a transparent background. If I had a J peg image, well, let's say like it black background for the logo. You will actually be able to see the local right now because it said to call old Sticky. All right, you also have transparent basically where in such an instance, right now it's no longer sticky. All that you have here is you have the logo shown up at very top with its own transparent background. But if you scroll down, you can see the header is no longer sticky. And then the final option here is going to be college now with college. Basically, what is does is you can see right now, even if your school down the logo and many will disappear. However, the header itself is no longer transferred. It doesn't blend in with the content area. You basically have a separate section where you have the many displaying and the local. This would have been OK if our logo had in non transparent bag and the bag I was in yellow or black, so you can easily see it. But because we have a transparent background for the logo. It is best we just stick with transparent. This way. The local blends in with the main content area. The menu items as well, and if you scroll down, we don't see the logo. There is no destruction at the top, and this is just the type of hidden I prefer. You could always do this in your own style. If you have a college background, you can go with the colored option in here. It doesn't matter. You don't have to fool what exactly I have done in here. But this is my preferred option, going with the transparent background and also allowing the head out to not be sticky. So that's it. Let's go ahead and publish this. Let's Ah, close this. Let's go ahead and refresh this page. Let's just make sure that everything works as it is. So that's cool down right now. Cool. We no longer have the header, and that's the way I like it. I really like this particular kind off design. One more thing we should do before we round this up is to hide the search button right here . Now the future looks good you can come in here type any kind of future. However I don't think is necessary. Some job I'm just gonna go to customize and ah, from here. We're gonna jump down to set ends, go to the header. And over here you have the option of hide in your search buttons. I'm gonna go ahead and take that so it no longer shows. Awesome. That's publish. And Ah, that's pretty much it for the head. Out for a weapon, I think is much fortune. I will see you in the next class. 7. Adding our Business Slides: all right. He begins to this messages, saying You need to add some slides to make things work. So that's what we're going to do in this video. We're gonna add some slides to promote our business. Typically, whenever anyone visits a Web sites ah, business website, usually at the very top you would see like slides demonstrating the Kansas services that that particular business offers and why you should do business with them. So we're gonna do something very similar here. And I do have images I got from picks a baby sure to check out picks a beta, come to download free images that you can use on your website. Gonna jump in here, Click on customize Now to add the slides were gonna jump over here. Teoh, Let's come down here to front page sections or a front put sections clicking there. Not very top. We have the slider section. You can always rearrange the sections you can drag and drop to wherever you want them to be positioned, but ideally, your slides should be at the very top. So we'll just leave this as it is going to click on the arrow right here. Now, over here. You do have some options which we're going to deal with in just a second. Bless, Add our slides First I'm gonna click on add all it it slides, gonna click on Add it slide. And in here we have the B X light saying it'll add a slide with the background image Title description buttons. Excellent. That's all we need is clicking here. All right, so head in. I'm going to say the best. We're the best around. Okay, paragraph. I'm going to say we provide although we pride ourselves and being is a very best in the Web . Ah, Web design business. All right. Sounds kind of cheesy, but, uh, we'll just stick with it for now. All right? For the background. Let's open this up. Let's add up back on image. And I do have some really cool images in him going to go with this one right here. Let's select that one. And there you go. You can see how it now looks really, really cool. We also have additional options of like choosing the overlay caller, choosing the capacity as well. Right now, it sits in 90%. Let's go with 60% and see if there's any change. Ah, yeah, There is some change. Now I think I'm gonna go with Thea. 90%. Let's keep it 90% for now. All right, We pride ourselves in being a very business but business You have the option of adding like a button as well over here buttons. So you can add like a text saying, Read more or something like that. And then if anyone clicks on that button to take them to the, uh maybe the services page or something like that, when I go to add in the buttons in here, we'll just leave the title and then the text, as it is, I much prefer it that way. So let's cool back up in here. Let's close this and I'm gonna go ahead now and add a second slide to the same thing. Head in here is going to be clean code. And of course, we rides code in the most fee Shinde manner to boost Web preferment since blah, blah blah. So I'm gonna go ahead and add my background. Now let's add a new image and I'm gonna go with this one right here. This has less of a code. So let's like that and let's see what it looks like. Okay, not too bad. Although it might be a good idea to make the background. It'll be docker because our text isn't whites. So let's do this minute. Come over here and make the overly capacity Teoh 100%. Okay, that makes it a little bit more eligible like that and will also make the value perceived bottom to 100% as well. Why not do that? And Oh, actually, that's kind of Ah, that's way too much. Sorry. That's an extreme measure. Let's go with a 50%. Let's try 50% 1st of all. Okay. Okay. Okay. This is this is better. Okay, this is this is this isn't too bad is better This you can actually read this text. So that's what's most important. All right, cool. So what I'm gonna do now is I'm gonna pause the video, and I'm gonna go ahead and add our two more slides. Oh, right. It will come back and is against. See, I have added two more slides, one that says we are the S E o gurus. And let me just show you what I did. So yeah, I said I need some awesome s CEO hacks. We got you covered. And that's the image right there. And then the last one use social media experts. We just don't design and build. We also promote your website on social media. Yeah, do business with those will quit is because we are the best, right? So I've done this fall. That's cool back here. Now, over here, you can actually hide the entire section. If you don't want to display your slides, you can disable arrows, which I'm not going to do. But you can also enable auto play, which I like something and it will other play. And then in here you can choose the delay for the little play. It's set to five seconds, which is okay, but I'm gonna go with 3000 which would be three seconds now. The background color is said to black. That's okay. I'm not gonna change that. The arrows I concolor. I'm actually gonna go ahead and choose red. I kind of like red, and I like the way it looks. I'm gonna go with red for that one and ah, that's pretty much it Let's go ahead and publish are incredible slides. Let's close this and Ah, check that out. Clean cold. We went our cold in the most efficient Manitoba's performances. Gurus le and, uh, actually, you know what I think 300 might be? Three seconds might actually be a little bit too fast. So let's make that change really quickly. That's come down here to from pit section Slight section. Okay, five seconds is actually ideal. Not three seconds. I publish. Let's go, Let's go! Come on. That's cool. Is this all right? Let's see if it's better now and OK, that's much better. So five seconds is actually a lot more ideal than three seconds so that since we have added the slides Teoh Ah, front page. Thank you so much fortune to video. And then we'll see the next class 8. Creating the Our Services Section: we're moving on, and the very next section here is going to be the about was heading. And after that, we have the features head in, which can also serve as the services section. Now actually prefer to display the services section first, and then will display the about us heading. So let's do this American customize. And from here, we're going to jump down to the front pit sections. So over here, right now, we have the ability to rearrange the section. So what I'm gonna do here is just simply click in here and all drug features above the about us section. All right, so let the school down here and see the change. Cool. So now we have the futures head in common up before the about us heading section. So let's click inside the features section, and we're gonna do here is we're gonna change the title of the section form features heading to ah services services. And then I'm going to say for the description, we offer full class services and the following it is high. Just go full in. Phone is double l influence areas. Right. So you can see that's the message, right? there. So now we have to add the actual services themselves. So it didn't click on add or edit features. That's clicking Damn. Click on add it. Future clicking here. All right, So the very 1st 1 here is going to be Web design, obviously, but design and we're gonna typing here. Ah, Web designers. Ah, the very best At what they do, be prepared to be amazed by their designs. Okay, let's do that way. All right, so down in here, you have the option of choosing either, and I can all an image that you can display, actually know what before we even jumping a limb, just introduce you to the html tax, just in case you're zone who isn't familiar with external tags, You can actually make certain Texan here bold or italic. So all you did to do is just to add these tags. So say, for example, if I wanted to make best bold, but we can do here is just type in strong. All right? So you can go with strong right here, and then at the end, we're going to add the closing so strong we're gonna do this. So right now you can see that best is now in ball because we added the strong tags in between the world's best. So even though to make any text italic, for example, you would use the M even in a new land you would use the brake tag and even adequate and hyperlink. You would use the A tag. So that's gonna much how to use the XML tax. But it's job done in here Now, over here we have the ability to display either an icon or an image. So if I can, for example, you could type in here and say design as an example and then ah, all right, so this guy doesn't have any particular That's samples. Let's a book, Let's go with book for a Nikon and then you will see all the different kinds of options you have. You can click on F A bookmark as an example, and then you will see the icon pop up. However, I'm not really that much of a big fan of icons, so I'm gonna go ahead and choose image instead, and we're gonna use image now. It's a is here that the suggested size it's to 50 by 250 pixels, please. If you upload the images, make sure that image you're going to use is square sized. They don't have to be to 50 by 2 50 Exactly. It can be 300 by 306 106 107. 40 by 7 40 Just make sure the dimensions are equal in width and height and also make sure there were at least 2 50 by 2 50 All right, I'm telling you this from the benefit of hindsight, I've experimented with different kinds of sizes and they don't look good if the list on TV , if tip activity or if the sizes are not square and and I mentioned, so please make sure that you, Kobe, by those rules, I'm gonna add the very first image here, and it's going to be this one right here, the web design going to go ahead and select that. And okey dokey. All right, so that's the very 1st 1 Now for the button. I'm going to go ahead and type in here. Learn more for the ankle text for for now, we'll use the hash tag for the UML, and we'll keep this on red. All right, we'll keep this color for red. So let's go ahead and close this. So that is the very first feature. Now, what I'm gonna do is I'm gonna go ahead right now and add three more features are opposed to video and resume once I've added them already. Welcome back. And as you can see, I have added three most services business plan in S E o and markets in self edit. Some text in here, some images enough. Also, I tried to get creative with the bottoms like step plan in optimized. Now get social. So that's pretty much what I have done here so far. All right, So please go ahead and add your own services again. It doesn't have to be exactly business planning and s CEO. You can get creative with your own images and your titles and your text. So that's it, though We have successfully created ah services section. I'm gonna go ahead and hit. Publish. Now, does this make sure this saved and ah, Yep, that is it. Glitz. Close this. Let's go to our front end. All right, let's cool down here and there you go. Services. We offer world class services in the full in areas and ah, that's it. So there you go. Thank you so much. Fortunate video dreaming the next class Where will now walk on the about us section. I'll see you then. 9. Creating the Who We Are Section: all right, exception is going to be the about us section. So let's not waste any time. Let's jump straight down to customize. And this is going to be a section where we can tell the potential client who we are, what we stand for mission in or stuff like that. So let's click on about US section and about us heading, but changes to who? Ah, we Who are we? And then for the text already copied some alarm. If some texts, I'm just gonna pace that in there. So let's see what we have so far, we cool stuff for the button anchor text. We're gonna say meat. Ah, the team, all right. And we will live the button as a day. So whenever anyone clicks on this particular button, it will take them streets to the militant paid ritual construct later on in the course. All right, this is not bad at all. What I'm gonna do next is to add some background. Let's at the background, and I'm gonna add a background image in here, and you can see that a commended sizes 1920 by 10 80. So I'm gonna go ahead and click on select image and I'm gonna choose this image I have over here and you can see it's ah, it's big enough. It's 1920 by 12. 10. That's big enough. Let's choose our image. And there you go. So you can see the image like that, the background, although the text isn't visible. So what we can do is we can show some background overlay and the color here is black, which is okay, but I'm going to change the opacity from 50% down to up to 70% of other. Okay, not too bad. We're still gonna change the text from looks like great to pure white soul. Do that later. But we do have the option of enabling something known as the parallax effect. So right now, as you can see, if you scroll down the image, the background image also scrolls down along with the text, right. However, with the parallax effect, the image will remain in the same position. It's not going to scroll down like the text, So let me show you how it is. I actually like the perfect. It's with the cool. Let's enable the parallax effect and then we're simply going to add the same image again for the pallets effect. Let's choose that one. Now take a look at the difference. If I scroll down now, you can see that the image doesn't move. It's right there in the same spot while the text moves and I really like this effect. So let's just go ahead and we move the very first image. We don't need it. We're going to give the bag on size to cover. What is those is. It makes sure that the image will occupy the full width and height of the section soul. Keep this on cover. Now let us click on colors, click on colors. So even right now we have the ability of choosing a bag on call if we don't have an image. But we have an image, so that's fine. Let's go down. Hit where we have the text colors. I'm gonna change this. We're going to go with a pure white that's better. And in down here. But we have amid the team, I'm actually gonna live this on red for now. Let's just leave this a dread. So let's just go ahead and publish this. Now let's close this And now let's see what it looks like. Let's refresh page, Let's scroll down. And there you go. Who are we? We have a bagman imaged text, and then we also have the bottom right and meet the team. Now this is something that's kind of annoying. You can see that we still have this message showing up in here. So let's go ahead and disable these helpers or placeholders. Let's do this. We're gonna go down to customize satins extensions. Okay, let's do that customize, and we're gonna come down into settin set ins. Extensions are gonna go ahead and disable the helping messages that's publish. Let's go back to the front page. Make sure it's notion up anymore. That's cool down. And there you go. Awesome, Awesome, Awesome. We have successfully created the about US section. Thanks much fortune. I will see you in the next class 10. Creating the Our Clients Section: the next section we have here is going to be the team heading. However, this is gonna be kind off redundant since we already have a ah, who are we? Section and then a button that will lead them to the MIT, the team page. So we don't need the team heading section animal. What is going to jump straight down to the client's head in? So let's go to customize as usual from customized, we're going to go to the front Pete sections. So for the team section right here, As you can see, I'm going to open this up and I'm simply going to click on hide this section so we don't need that section. Let's call down here. All right, cool. So next is clients hidden. So for the claims head and we have the opportunity to display the logos off clans that we have walked within the past, this can help with our credibility. So clients head in. They're just gonna say, ah, clients what we're gonna say clients we have worked with, I think that's better clients. We have Ah, we have worked with all right, and we're gonna type in here. We have worked with, ah, very wide range off difference. Ah, companies, companies and establishments. And that says we're just gonna live that as it is, we're gonna enable the auto school. All right, so now let's click on add already clients, and I'm gonna click on add a client, click on Be ex client. All right, so client named the very 1st 1 he's gonna be muzea. I'm gonna add my image. And I do have some locals already uploaded. Previously is I'm going to click on the Muslim Firefox logo. Make sure that the logos for your clients are all are rectangular. I'm sorry. Square in size so you can see my Muslim Firefox's stupidity by 2 50 This one here is 2 50 to 50. Does case 2 50 by 2 50 I think one for WordPress is fragile by factual. So just make sure they're all squared in size both the width and height of the same. So back to Firefox looks like that one. Okay. And that's pretty much it. I'm not gonna add any links to the client's website. I'm not gonna check this book, so I'll just leave this as it is. So let's hit done. So what I'm gonna simply do next is I'm gonna add five or six more clients now. Oh, I welcome back is against the F added quite a few more clients. I have Utah Tom stuhn DOS King, Fire Patrol, good family and print press. And these are all the logos. As you can see what was going to go ahead and publish this section. Let's close this and let's take a look at what it looks like from the front end. I love school down here services. Who are we? Team clans we have worked with. And he can see the auto school walking right in the background. End up. Yeah. That's pretty much how to add logos off our clients. Thank you so much. Fortunate video. And as always, if you have any questions about anything I've done so far, please let me know. I will see you in the next class. 11. Adding our Portfolios: Welcome back. We're gonna continue now with creates in the port Full your section. Now, as a Web design business, obviously we want a way to show prospective clients what we've been able to build in the past. So a portfolio section is very, very crucial is very, very important. So that's what we're going to do in this section. Now, if you take a look at the message in here, it say's that you need jetpack portfolio module unable to use this section. So remember, winced old ah, the jetpack plug in earlier on in the course. And if I come in here to jetpack, I click on it. You can see right now it sees. Well, welcome to Gyp Park Subject Park Yetta. Yetta, I'm gonna click on set up Jet Park. Now, in order for you to use jetpack, you need to have a war press start, comb account. So in order to have this account, all you really have to do is just go to what? Crystal calm. Click on, get started. And it's very straightforward. All right. I don't spend so much time. You're going through this process because this video will take too long but it's very, very straight for just simply type in what you like to name your signs. What you said about, just fill in all the necessary information and then you'll get your user name your password , and then it's Ah, very straightforward. So once you've quitted your account in here, you'll be able to look in with your current account. So there's gonna go ahead and click on log in. All right? And I'm going to change this, actually, because I do have a different account. Let's continue. All right, we're gonna type in my email address. I'm gonna log in. All right, so right now it's saying, just packets finishing set up. You'll have to approve the connection between jetpack and your website. Lets approve the connection. That that Ah, hopefully this won't take you long and ah, all right. So now you will see stuff like this. You don't need any of the payment plans. You could just call down here, click on stat with free because everyone loves free stuff. So gonna go to the free plan and okay, awesome self In here, nothing about jetpack is jetpack is kind of like the Swiss army knife off. What press plug ins. It is one planet, but it has so many built in features, from security to social media to images, comments and so on and so forth. So what I'm gonna do is, but I'm actually gonna come over here to set in. So I click on settings. You don't have to activate the recommended futures because we're going to use most of them , so we'll just go to settings right end. Let's cool down here and see where we have thea portfolio future. All right, so in here, you'd say, is used portfolios on your site to showcase your best works. I'm gonna go ahead now and activates the portfolios. Okay? Going to do that? And cool. So once you've done that, you will see the portfolio tab activated in here. So what I'm gonna do right now is I'm gonna go ahead and add a very first portfolio, So I'm going to come down here and right off the bed. I'm gonna go ahead and set it. Featured image. Now, I do have some images already uploaded, which will serve as images for the websites. I'm gonna go with the very 1st 1 here which is Ah, Batman V Superman. This is actually a website built about two years ago. So I'm gonna set featured image in them. And I'm simply gonna add the title in here saying, Ah, Batman, the Superman. And I'm going to paste some limits on sex. Actually, let me go, then go ahead and open up a lot of tape. Some text. I forgot that we need this as well. So basically, this would just be like the explanation of what it predictors about. You would say stuff like, Yeah, we built this website for this particular client. We added this feature scare the other. That's what The texting. He would basically be full. I'm gonna go ahead now and publish. Actually, let's disable comments. I'm not gonna allow comments for the the portfolio. We don't need comments. I'm gonna go ahead now and publish this publish. Come on. And oh, I forgot to hide the site, but I'm also gonna go ahead and hide the side, but we don't need side bus displaying for portfolios. Let me update that. And Ah, there you go. Awesome. Cope. So here's the thing. Okay. If you already have sample websites that you've built in the past, you can simply take a screenshot off. Maybe the front page of something like that. Like, for example, if I come down here to my media library. Ah, here. The images I'm going to use for my portfolios. You can see the one in here. This is a said I built Elia. Ah, so I'm just gonna use a sequential off part of the home page, which is that when I have time, just show you Where's the other one? Okay, Is another side of bills also, the movie characters don't calm. So basically, if you don't have websites that you've built, what you can do is just simply go to pick sorbet and just grab some images and just used them as your placeholders. That's that's the best thing you can do for now. So what I'm gonna do right now is I have already created one particular up project, which is a portfolio. I'm just show you all project. So I've created the wonderful Batman V Superman. What I'm gonna do right now is positive video and I'll create three more projects. All right, welcome back and is against see, I have added three more projects. One for the movie characters Auctioneers Club as well as cold as incorporated. Now, if we jump ahead to take a look at our front page going to school down here to the particular section, and there you go automatically you can see right now that all the four have been populated . As you can see, when you hover over the images, you will see the title off the projects displayed. So let's go ahead and modify this actual text in here. So I'm gonna go ahead and click on Customize. I just closed a section all like, it's gold and skill. Come on, come on. We don't have a bay. All right, front page sections come down here to the portfolio section. All right, So the portfolio heading is going to be our hurt for Leo. And then for the description, I'm gonna go ahead and pay some texts. I just so down. All right, So let's cool down here and see what is looks like school down here. Our portfolio we have worked with a wide variety of clients for movie websites to hospitals and even fortune 500 companies. Yes, So, by default, we have the four posts which is going to display. That's fine. We're gonna go ahead and also showed the more put X button. All right, so if anyone clicks on the of you more projects, but might it will take them straight to the predicts page. So I'm gonna rectify that one later. We'll just live this as it is. We got on the call of the button. You can change that if you want to. Ah, you can go down to colors and then let's go down here where we have and, well, that's interesting. Looks like we can't actually change the green collar for the button, which is kind of odd. I thought we were able to do so. Enemy That's not important Levels go ahead and publish our changes. All right, let's close this. And now let's go back in here and take a look of what we have. Ah, portfolio. Awesome. Cool view. More products. Okay, that's that's pretty cool. Now here's the thing. Decayed. We will need to eventually create a portfolio page as well, so that whenever anyone clicks on the bottom in here, it will take them straight to that. Our portfolio page Now here's a thin If we come down in here and we creates a new page and we just named the page a portfolio portfolio. Let's go ahead and publish the page. Let's go ahead and let's publish it. Make sure it's published. Come on. Okay, so it's published. Now, let's quickly come down here. Teoh menus, and we'll just add a portfolio to the menu. But folio, add to menu. Okay. Exact portfolio in here. Save the menu. Okay, Now let's take a look at this site right now. If you click on portfolio right here, just like a portfolio. Now, if we scroll down here, you can see that automatically. Our projects are now being displayed in the content, Avia. Now, how did this happen? The reason why this happened is because we named this page portfolio, all right. And the slog itself is put fully. Let me let me see what I'm talking about. Let's go back to pages. Paige is old pages. Go to portfolio at it Now. Pay very close attention to what you have in here. The shuttling, the primal in quite here. You can see it's ford slash Put full. You'll right? This slogan right here tells the theme The look. If any page is named portfolio and has this particular per maling structural pull in the projects from the particular display those projects in here. That's exactly why automatically, our projects have been displayed on this page. That's how certain things work. Seven themes. Reserve sitting kinds of prima links for certain kind of information for Senate kind of content. That's the way it works. Although themes, for example, could have, like testimonials, they could have like a prevailing that is forced. Last testimonials receive specifically for testimony. Also, if you could have a pitch, call testimonials and the Prima link is false, slash testimonials and then saw me in the back and you had testimonials content that page will automatically pull in those testimonies. That's how themes and content walk sometimes. So here's the thing. If I came in here right now and say You know what, I want to set a featured image for portfolio page right? Let's go ahead and set. Ah, yes, let's use this image. All right, so this featured image. Let's go ahead and go ahead and hit. Update Now let's go ahead and view the page. Take a look at that. The future images, not even this plane. And that's because again, this primitive link, this particular kind of your bill has been designed specifically for some kind of content, which is just to pull in content, which is for the projects. Any other customization that we set for this page will not work. So here's a thin another for this to work. Take a look at this. I'm gonna come back in here to the back end. It's good pages. Go back to portfolio. I look at this, I'm gonna come in here and edits the prima Lincoln C Ah, Dash. But for you, click OK, update. And there it is automatically. Right now, we have changed the paneling from portfolio to our dash portfolio. The title itself isn't the most important thing. It's the Perma link that is the most important. Now let's see what this slight change has caused. I'm just make sure this is updated. Now let's go ahead and view the page, and now you can see that we now have the background image showing. However, take a look at that. We not have a sidebar, but we no longer have the project, This plane. So now we have to tell the thing that look, this particular page that has the Perma link off our trash portfolio, we need this page to pull in the project that we've created. So to do this, I'm gonna go ahead and click on Edit Page. And you might even notice that before, when this prima link waas four slash portfolio only the edit page wasn't available Force. We could not edit the page. That's one way how you can tell when it puts clock hand off. Pamela instructor has been reserved by the thing. When you cannot edit that page that tells you debt, that particular page that you've created has been reserved specifically by the theme. So we're gonna go ahead and edit the page. Now, we're gonna come in here where you have the templates, are gonna change defaults to put fall your page. So the theme has a template that you can choose their specifically specifically told him to pull in projects portfolios for that particular page. So let's go ahead and choose that one click update. And now let's go ahead and view the page. And while ever scold him right now. You can see we now have our projects being this played awesome. Awesome. Awesome. And we also have the background image showing as well. So what I'm gonna do finally finally right now is to copy this link. Let's go back to you the front page. No, wait. Let s call down in here. And as it is right now, if you click on this button, nothing happens. So we have to change that. So let's go ahead and customize. Go back to a front page sections. All right. We can even just school down here from here to school down and then just click on the button right here to edits that one. Let's coming in here and we're gonna paste the link right there. Publish. And now let's make sure that this link is work in school. Back down here. View more projects. That takes you straight to the portfolio page. And now you can see all the projects. And if I'd said to click on, let's say the title off one off them. That's the auctioneers club. You click in there. It will take us to the page specifically for the project. You have the thumbnail that we used and then down in here, you have the content for that particular project. So that's it for creating the portfolio section. I know this has been a bit lengthy, and we did some tricky things in there. So if you have any questions, maybe there's something you're not familiar with. Maybe you confused about something. Please let me know a bit more than happy to answer your questions and help you in any way that I can. Thank you for watching. I will see you in the next class. 12. Adding Testimonials: apart from the portfolios. Another very crucial section that one has to show would be the testimonials all right enough to convince the prospective clients that you are good enough for them. You'll have to try to convince them that. Hey, look, other companies are booked with those, and this is what they had to say. So testimonials will always be a key part of any business trip signed. Now, before we jump into testimonies, we have to hide the actions section. We don't need this section. So let's jump right in. Let's customize and we're going to come down here to from page sections as always, front section. So action section that Just open this up and then it will hide this section For now, let's scroll down all the way in here. Okay, cool. So now we have testimonial. So let's go back. We're gonna click on testimonials section. All right? We're gonna click on add or edit testimonials. Added testimonial, clicking here. Right. So for the image, I do have some images that got from picks. Obey. As always, I'm gonna go with the very first guy in here, This smiling man. He's really happy he did business with, um, with us with web code is I'm gonna call him Dick Jones. Okay, Jones. Now, the one little issue I have with the testimonials feature is the fact that you you don't have a separate our box for the position or name of the company for that particular person went in the testimonial. So what you can do in such an instance is just in brackets, you can just say Ah, see, i o. And then I'm going to say, Ah, Jones Inc Jones Incorporated. All right, does them with the company. So I'm gonna go ahead and paste my testimonial Ian here, which I've already written beforehand. So here's the thing it states to justice sizes 1 32 pixels by 1 32 pixels. You don't have to upload images that are specifically I wanted it to be. I wanted to just make sure that the images you use our square in size, which means the same with and same height and there at least wanted it. You buy 1 32 So that's it. We don't need to add any buttons in here. Ideally, this would go to maybe the website off that particular client, but we're not gonna do that. What I'm gonna do right now is I'm gonna close this and I'm gonna add two more testimonials . Well, come back. And as you can see, I have added two more testimonials. One from my passion tell an international model, Can you believe that we have international models whose websites we have built that shows you just how successful we are at Web Cota's And we also have Frederic Jacobs, the CEO, off a company called Blue Whale. So I'm going to go ahead and publish these three testimonials and, ah, let's take a look and see what it looks like on the front page and middle school down here . School down Folio Testimonials from Dick Jones. Wow! Jones Incorporated Myisha Intel International Model. And look at that. Frederic Jacobs, CEO of Blue Whale. These other prestigious people who have done business with us here at headquarters task OPD dot com. So one final thing we're going to do before we around this up is to change the color because I really don't like purple and we don't know turned the site into, like, a multi coloured kind off websites. We're gonna change the color off the bar right here and also the schools. So let's click on customize and, as always, school school down here. All right, We're gonna go ahead and hit the book. Invited to edit. We're gonna heat colors. All right, so section heading but a collar. They're gonna change this from purple to bad. Good school down here. Navigation button bought a collar questions or to read as well. Okay. Oh, like, there you go. I'll say publish. Let's close this. And we're gonna be the front page once again just to make sure everything is as it should be. And while Ah, there you go. We have successfully created a testimonials. Thank you for watching the video, and as always, I will see you in the next class. 13. Developing the Blog Page and Section: the next aspect we're going to develop would be the block section of us Gold way down here we have the price and head in. We have the frequently acts questions. We have a hero section and finally we have the blawg section. Now here's the thing I've already created are five different blood posts and let me just show you very quickly. I'm coming on here to posts. I'll post so you could see them. We have blood post one for 53 and two. Now there isn't why this seem out of order is because I changed the dates when they were published. So Block Post was published back in September 2018. Blackpool's foot was August. Now you have July, May and in March. That's why it seems kind of out of out of order. So I used images from picks obey as always, and the text was just alarm Ipsum. Basically, that's all I did to create. The five are blocked post so you can go ahead and create yours Now, once you create the block posts automatically, you will see them published. Down here is by default. He will see four off the block posts being published right here. So let's go ahead. And what if I at the kind of information you can see over here? I'm gonna click on customize off course, and I was gonna wait for this to load. Ah, okay. From page sections. First of all, we're gonna go ahead and hide the price and section. Now, the prices sexual would actually have been ideal if this was a different kind of business. So say, for example, that was selling services that had, like, a fixed price. Unfortunately, we've cold in with building websites. It really depends on the sophistication of the website. So someone obsessed could cost $1000. Some could cost $10,000. So that's why a price and section doesn't really work with this particular kind of business . So that's the reason why we're gonna hide this. But again, if you're building a business website full and I told business that had fixed prices for the products or services, then yes, you could make use of this section. Anyway, let's hide this and we're going to school back the f accused again. We don't need if accused. Let's hide this one as well. Now let's school back. All right? The hero section can be useful, but when they're going to use it. So let's hide this section as well. And now finally, we're down to the blawg section. Awesome. I I'm gonna go ahead and click on the pan right here to edit the blockhead in, and I'll just change the title to from Ah, Blawg. Now you might have wondering why will the business website need a block well delivered on North? Blogging is actually one of the ways how our businesses can get traffic to the website. So this gives. Right now, we are in the business off design Web development. We can might block posts about how to build a website, stuff like that. And we can actually get traffic to our site as a result off those blood posts. So blogging is actually one way how websites or businesses that I can get traffic to their websites just so you know. All right, so let's do this for my block. I'm gonna make the old capital as well make this look better for my blawg. All right, so the section description we I'm going to type in We rights Regula posts on Web development and s e o check. I am out to come out. All right, let's Let's do this. Check him out. God. So in here, you can choose the number of post to display. I'm gonna bring this from 4 to 2, okay? Because I don't want the fun pitch to be too long, so we'll reduce it down to two. We're going to show the show more articles, button as well. And I'm just cool down here to see what it looks like. All right, so it's his view. More articles. That's fine. We're going to change this. Ah, but later on was gonna go ahead and publish this. All right, so I'm just closed this and let's just go straight in here and see what it looks like right now. That's cool. Down, school, down, school, down school, down from a blawg. Awesome. Cool art. So this looks fine. I like this. I like the way it looks. Let's click on an individual block posts and then in here. We now have the actual post for the article, and I like this. I like the way it looks. We're going to make some changes. Okay? we're gonna hide the category, for example, or even the awful We don't need any of this. So to do this, we're gonna click on customize again. All right? That, that, that, That, that that that, Ah, that we're gonna click on settings, I'm gonna click on posts. All right. So from posts, take a look at this. Right now, You have the option of going with the single view, which is the actual block paid for that article, or you have the index view, which is which would be for the actual blocked page itself. So let's go to the block page. This is a blood pitch right now. So in here, we can modify the kind of information we're going to display in here. I'm gonna go ahead and hide the category, okay? So as this right now, it's only the weed More button. And the dates the block puzzles published will be displayed. We can control the except length 35 is the default. And I think that's okay. We don't need to increase that. And then they accept head in. You have this right here, the three dots inside the brackets by default again. I like the way that looks are not gonna change it. But now let's go into an actual book post itself in here. You can see that we have the author displaying the dates category and a number of comments . So in here right now is where we can make changes. We can make changes to this under the single view. So I'm gonna go ahead and hide the author if you click on hide Post metal. By the way, that would hide every single information to hide the author, the dates, the category comments and someone. So we've hit in the author. I'm gonna hide the category next. And ah, that's it. I think that it is OK. Number of comments is fine. We can also enable the image pallets effect. Let's see how that would look like it's enabled. Okay, Uh, that's not too bad. Okay? We'll just leave that as it is. Let's go ahead and hit. Publish. All right, cool. Let's close this And awesome. So our blood posts look really nice. I like the way that look. And then on the front page, it also looks Priti decent. Cool. All right, now what about our actual blocked page itself. It if I click on blogging here, it takes us in here, and you can see that we don't have a nice back on image. And we also need to change the home page head in. Now, here's the thing. Okay. If I clicked on edit page right here, I could actually come in here and add a featured image. Unfortunately, it's not going to display the image. And it's kind of like, similar to the time when we created the portfolio. Remember the portfolio section where we had to create. So I changed the prima link from four slash but followed to our dash, but follow in order to display the bag and image. This is a little bit different. Okay? The theme doesn't look that way to edit are blocked page, but we're gonna have to do is go back to the customize section. All right, so check this out. I'm gonna go to customize and then from him, gonna click on set. I'm sorry. I'm gonna click on settings and then from sentence, I'm gonna click on header right here, click on header. And then over here is where we can change the title for our block page. So let's even go to let's go straight to the blood page. All right, so here and I'm gonna change homepage head into simply blawg. All right, so now we have blawg and check this out. We can now add our custom image in here had a image at new image. And I have this image I'm going to use right here again from picks Obey, Click on Select and Crop. I'm gonna drag this just down here. Crop the image and let's check this out. Look at that. We have blawg and we have the blood image in the background. I love it. We can also enable the Parallax Effect. But I'm gonna live there for now. Let's go ahead and hit. Publish. I like this. I like this a lot, Right, Cool. But I'm going to do right now is to show you one more thin gonna go back. All right, let's go to visit. Let's go to colors. Right, so on the colors can come down, hits you head ahead in, and then over here. If I school down him, it's actually so it's actually under the index of you. All right, so it's on the index view. And then in here you have the select called the very last one down here. If you click in here, this is where you can change the top shadow color. So right now you can see it's kindof grayish black so you could go with blue as an example and how you can see that it has toned are blue You can go with green You can go with yellow red whatever tickles your fancy But I'm just going to stick with the default I kind of like the grayish black shadow. So that's it. I'm gonna go ahead now and hit Publish And I think we're pretty much good to go. Okay, so that's it for the block page for the block posts and for the block section on our front page. Thank you so much. Fortunate video. And of course, I will see you in the next class. 14. Setting up the Sidebars: Okay, so we sort of the blog's with upper block posts, the blood pages. Well, however, we need to also walk on our side bar. We have all those widgets in here, and some of them just don't make any sense. Like recent comments, For example, personally, I wouldn't want to display within comments on my sidebar as well as categories as well as the meta widget as well. So we need to fix this. So let's do this right away. Let's jump over here to the back end. We're gonna come down, hit your parents, go to widgets. Now, our business X theme has lots of different kinds off sidebars. You can see we have one full the index. We have one for posts paid before your foot are and so on. We're gonna do this. I'm gonna remove recent comments from the index. We move categories as well. And we're gonna also remove the meta as Wales. Let's go back and see how it looks like white. Now go back to Blawg School down. Okay, this looks better. Now we can add some widgets and because we installed and set up Jet Park, you have access to a lot of extra widgets in here. You have authors block stats, block subscriptions, contact in full. You can even display the cookies and constant banner for Judy PR compliance. You have the Facebook page page plug in and so on. So there's a lot of widgets that come with the jet pack plug. And I'm actually thinking of creating a new course specifically focused on jet back and how to properly utilize all the amazing features that come with the plug and save interest That just let me know I'm not exactly showman or create the cause, but it's in my plans. All right, let's do this. All right, We have search within post archives. You know what? I'm gonna move. Search. Let's most that you don't need search. We have recent posts. Archives. Now what I'm gonna do here is this I'm going to display something you may have never heard of before. Which is the Internet Defense League widgets. Just give me a second. I'm gonna explain what this is. Let's go up. Come on. Let's display that white here. We have three different badges. I'm gonna go with the shield badge. So the Internet Defense League is basically are protecting net neutrality. And if you click on the link right here, you would learn more about it. Basically, it's just making sure that the Internet never becomes controlled or monopolize, basically. And me personally, I'm a friend. Bolivar off this and the authors of a jetpack also filled a similar. And I hope you also feel the same way as, well, Enemy. Let's not get political. Let's go back. So Oh, gosh, let me just refresh this page again. If it appears that we've gotten all the widgets back and get okay, fine. So we have the Internet Defense League jetpack. We have a recent polls. We have the archives. Let's take a look and see what it looks like right now. Okay, cool. So that's the batch for the Internet Defense League. We have a recent post. So we have the archives. Now, I'm gonna introduce you to a widget specifically for Facebook that comes with jetpack. So if you have a Facebook page for your business, you can actually come in here and just happen something like, Hey, follow us on Facebook. All right. Now you do need to have a Facebook page. You are l here is mine, by the way. And if you're on Facebook out, appreciate it. If you judge by and give me a like it's the Web monkey online, that's my Facebook. You are. Well, I'm just gonna go ahead and copy this and use this. Gonna pays up in here so you can control the width and height as well. You can show faces. I'm gonna hide that. And also hide the cover photo as well. We don't really need that. Let's save this. And now let's take a look at what is looks like Yeah, a force on Facebook. You can like the page right there. That's pretty cool. One more. Which is I'm gonna add here would be the Google Translate. Let's just cool down here. Let me show you where it is. All right? We'll visit. There was Rose. It's I don't see it anymore. Which is kind of odd, huh? Where is it? Okay, here it is. Google, Translate. It's right here. Provide you It is with the option to translate your site into the preferred language. So I'm gonna go go ahead and drag this own appear as well. Why not? I mean, we can put it just beneath the recent posts he done. Let's come back and have the first page. And Ah, there you go. You can select in a language, and it automatically translate whatever we have written in here to that particular language . So that's the sidebar for our index page all set up now for the individual posts pages themselves. We're gonna need to do more or less the same thin. However, the side by is gonna be the one for the posts sidebar. Okay, So what I'm simply going to do right now is I'm simply gonna copy and paste exactly what I have in the index sidebar inside of the post sidebar. Welcome back. And as you can see, I've added the exact same widgets from the index sidebar into the post side. But as well, we don't need any rejects for the pages portfolio sidebars because, well, we're not displayed in the sidebars in this kinds of pages. So let's go back to one of our blood posts. We first page and we're gonna school down in here and Ah, there you go. It's pretty much exactly what we have on the blood page and that is it? So that's the side ball and midgets all taking camera off. Thank you for watching. And I will see you the next class. 15. Creating the Team Page: At this point, I'd like us to take a break for developing the front page to walk on the team page. So we have the page right here, but it's pretty much empty and do nothing we have so far referencing the team would be the who are resection. But we have some texts and then, ideally and on clicking on this button right here should take them straight to the team page. So we're gonna do here is we're going to develop the team page. We're gonna display images off the staff position and then maybe a very short bio, and we're gonna make use of this plug in cold team T L P team. It is by ah radios theme. So be careful. There are lots of other applicants named team. This one reason specifically is by radios theme. So please go ahead. Download and stole. Activate the plug in. Now, when you do the same, I assure you I have already installed a plug in. You will see a team section right here. Just click on add Member. All right. And by the way, I already have images I'm gonna use for the staff. Let me just quickly show you. I got them from picks. Obey as usual. So you can see these are the images right here, which I'm going to use. So they just go ahead and add the very 1st 1 And his name is going to be Bob Dixon. Well, I I'm going to sit my featured image. All right, So who is going to be the CEO? Oh, I'm actually going to use this image right here. Hopefully it should cope. Nicely. Set featured image. All right, so for the shot by you, I'm just gonna grab just three lines in here. It's important that you don't go overboard with the shot bio. Don't make it like a whole paragraph, because the page then will not look good. Your shot by issue to be two sentences, three sentences, Max, by the way. So I'm gonna grab that. I'm gonna pays that in here designation. And I do have leprosy Don, which have already used before, meaning of the president in French. So we'll leave that as it is, so there's gonna type in. Ah, Dixon. What's his name again? Bob Dixon. Get nix and Bob at web. Uh, Koda's the come. That's his email ID. So let's go down. What else do we have? We have personal web. You are well, no telephone, no location, no social links. Okay, we can go with LinkedIn right now. The thing about this particular plug in is that you just can't add the Regula hash tag as a placeholder because it's not gonna work. So let's try it out. Hashtag Let me come up here and try to hit. Publish. Now you can see please enter a u r l So you cannot use the hashtag as it placeholder full this particular plug in. But what we can do is just It's simply type in Ah, and actual UML. So I believe I already had one. Okay, so I'm just gonna go ahead and use. Do you have all for the sites as a placeholder. So we have their own for LinkedIn. I'm going to go with Google plus as well, and I think that's pretty much OK, right? We have LinkedIn and Google, plus Instagram and Facebook and Twitter, some kind of personal. So we want to keep this professional. I'm gonna go ahead now and hit. Publish. Okay. All right. So that's the very first member. I have added, as you can see, Bob Dixon. So what I'm gonna do right now is I'm gonna pause the video and I'm gonna had a whole bunch of other team members. Welcome back. And as you can see, I have added seven more team members. We have Chika who is the head of security, and the email is goof off. Advantica does come. I love dogs, by the way. So any opportunity I have to add that the picture of a dog on the website I will do so, have added Freddie. Here's an intern of added positions for the Web designer HR manager. It's your experts in Europe developer and head of marketing as well. All right, so from here, right now, I'm gonna jump over here to settings. All right, now in here will leave the prime Niccolo as blue. The image size 400 by 400 will live that as it is, the slog we don't need to change. This will live that as the days as well. Now in here, we're going to say no because we don't want the team members to have their own individual pages. All we want is a single page just displaying old the necessary information about each team member. And that's it. So we're gonna make this to be no. All right, so down in here, you have the opportunity to take a look at the demo. I'll show you in just a moment. Let's save our changes now. To display the team, members will have to make use off a short code limb. Just save my changes. Okay, let's come down here to shut code. So here's the thing that a different layouts tach you can go with. And if I scroll down here, let's click on Demo so we can see the different kinds of designs that we have now. This is the free vision of the plugging. They do have a premium vision they can pay for. They will provide you with more designs begins right now, they have layout one with four columns. So that's how it looked like, which is not bad at all. There is layout to hear as welders layout three B D founded images, and then you have the isotope, which you can arrange by name by designation default. But there isn't one another big friend of the I stop is that you don't get to see the our bios off each individual team a member on the team page. So I don't really like that much. And anemia, You also have the TL P team widgets display. And then finally, you have the testimonial, slider and showcase. I like the layout to the best. Kind of like this design. So we're gonna go with lay out to him, close this, we're gonna go back in here. So we're gonna choose layout to, and the number of comes, we're going to go with two as well. And then total member, we're gonna live this blank so that every single member is shown. All right, so I'm just gonna go ahead now and copy this. Copy that. Let's come down here, Teoh pages. We're going to go to the team, and very simply, we're gonna paste the short code in here Piece that I'm gonna change the template from defaults to the full with with the title. And I'm also gonna add a featured image. I do have an image I found which is this one right here really? Like this one? Let's set the featured image And now let's go ahead and hit updates and we're going to go ahead now and view the page and check that out. Lovely fitted image. And then we have a head of security. Ah, Freddy, the Intern. And, of course, Jennifer, Tetiana, Jason, Gary, Bob and Cheryl. Okay, we do have a bit of an issue, and that is the fact that Leprosy Don and the head of marketing, who are probably the two most senior members in the team, are down here at the bottom, and we want them to show up first. So to do this, let's go back. Teoh Web code is Let's come back down here to team Go to shut code. So the reason why it's displayed like that is because I published both Chika and Freddie last, and I published Bob and Cheryl first. So it's kind of like posts it will display the most recent team members first, so we're gonna change the way the short code works. We're gonna show the oldest members first ones are published first before the newer members . So to do this, we're gonna change the order from default to ascending. I we're gonna go with Ascend in, and this will be the new short code. Okay, Let Justin is about to lay out to ah column, But it's you columns. Okay, lets go up this. Let's copy. That's Let's close this. Let's go back to the team page. Do 2222 Team. Let's edit the page and no going to go ahead and paste this short. Good right there off dates, but at outlets view the page. Okay, cool. So now you can see that Cheryl and Bob now appear First, however, we need to create some margin between the featured image and then the content. It's it's like, right up there, the edge, and that's not good. So what we can do here is very simple. Just wait here. Just press enter once, just to create some space. And that's it. Updates easy as apple pie updates. Let's view the page. And there you go. We have a space. We have Bob, Cheryl, Gary, Jason, Jennifer, Tetiana, Freddie and, of course, cheek are the head of security. All right, so there you go. That's how to pretty much display the team members that we have on our page. Thank you so much. Fortunate video. And as always, if you have any questions about this, let me know. I will see you in the next class. 16. Creating the Service Pages: one move. A crucial page we need to build out is going to be these services paid. Remember that on the front page, we do have the our services section describe in in brief details. The four major areas of a specialty reach are about design, business, plan in S E O and marketing. Now initially, add plan on creating a single services page where bold simply describe all this force services. But I changed my mind, and I feel that it's better to have four individual pages for each one of this, our services describing them in full detail. So here's we're going to do we're gonna Kuwait four pages, one for markets in one for you, one for business plan and one for Web design. So let's do this. I'm going to jump in here to the back end. We're gonna go to pages at New and let's go with Let's go in markets in first markets in markets in and then for the contents. I'm just gonna grab what I have over here from limits. Um, and we'll just pays that in here, all right? And then for the featured image, I'm gonna go ahead and choose this one. Let's say the future image. We live the template as it is, but we're gonna disable now. The side ball. We don't need any sidebar for this. Let's publish and let's just go ahead. View the page, and voila. So that you have marketing. Awesome. Awesome. Awesome. So what? I'm gonna do it. Now it's pause the video and I will create three more pages for the remaining three services. Welcome back is against sea of added pages for business planning. We have s C 00 n Web design. Okay, now, how do we display this pages on a website, Ideally, will create, like, a services page in here, and then simply add those pages as so many items. Right. However, here's the thing. I'm gonna show you what's gonna happen. Okay, let's just go to the menu. All right? Let's come to nature appearance. Go to menus, and you're gonna find this very interesting. What I'm gonna do here is this. I'm gonna create a custom link lights, and we'll just make this hash tag, the link text. We're going to say services. What? Let's add to the menu. And what I'm gonna do is I'm going to drag services just in here. All right, Next up. Let's go ahead now and add the pages. Business planning about design markets in and of course s E o. Let's add those Now. Check this out. Come on. My Internet is kind of slow today. I don't know why me? Because it's Friday. The Internet is all is thinking about the weekend already. All right, so services, it was draggin. Ah, Web design first. So, on the services, we have a design. We have business planning. We have s C o and then last bananas. We have markets in. Right. Okay, so check this out. I'm gonna save the menu. The light, and then come on. Come on. Slow Internet. Let's go to different page. Let's take a look. So we have the services right here, but take a look at that. This sub menu items are not displaying. You can see that. They know displaying. So here's the thing. These particular theme or using provides you with three different kinds of menus. And if you come back down here, you can see we have the premier menu actions menu and then photo menu. This coin money that we have in here. It's set toothy actions menu and the Actions menu has been designed in such a way that it's not going to display any sub menu items. The problem any, on the other hand, will display the sub menu items. And this guy's right. Now we could actually decide just to ignore actions menu and then make this the plenty menu save the menu and then from here, go back in here. Let's refresh the page. And now take a look at that. We now have services, and we have the individual pages now displayed on the services. However, to the right, we no longer have our actions menu. And to be honest, I can of, like the idea off heaven, the many on the lights. So what we can do here is you can actually have to separate menus. One on the left, one on the right is actually kind of interest in. So let's do this. All right, I'm gonna come back in here. I'm gonna quit eight a new menu. All right, Let's create a new menu and will name this one. The secondary menu will create it. And so for the secretary, many we're going to do this. I'm gonna add contact ALS and then blawg and even put full you, Let's added, put fully as well. We added in here. So come on. Come on, come on, Come on, Come on. All right, contact us is last. That said this to the actions menu Going to save the menu. All right. And now let's edit the main menu again. Select it. So we're going to remove portfolio. Let's remove portfolio. We moved that one with portfolio remove, contact us and also removed Log as well, because we don't want to repeat them. Understatement. So that's save it. Cool. Come on, let's go save the menu. But, uh oh, my gosh, This is taking forever. Okay, let's go back in here. Lives in first page. And there you go. Awesome. So here on the left, we have the team and we have services. And then over to the right, we have portfolio blawg, and then contact us Pretty also my click on love design that takes us treated Web design page with all the necessary information. Go to S c o what we have here. We have a CEO, the content and all that good self. So there you have it. So if you wanted to make changes to the color, the background call A things like this for the menu is very simple. You can go to customize and from here you're going to go to colors, obviously clicking colors. And then from here you can go ahead and click on Header. And so from here, right now, this is where you can now begin to change the text collar you can go with, maybe read something like that if you want to, you can scroll down in here, change the links capacity. In fact, we're gonna go with 100% so you can see it's now a lot bolder. We're gonna go with 100% and then in here for the bottle color. You can go with red. You can see right now it's red. You could go with our blue or whatever tickles your fancy. Others go with the default. Leave that as it is what we have here. We have the so many background color so you can go with Blue as an example. Becoming here can say right now it's all turned to blue. But you can also go with Green as well if you wanted to, But I'll just stick with the default for now. And Ah, that's pretty much it. Let's go ahead and publish. Even though we didn't really save will make any changes, I'm just close this and let's go back to the home page. And there you go. So one final final thing we need to do right now would just be to ensure that the links in here actually go to their individual pages. Okay, so let me just quickly do one of them will go to customize close this closer limits. Um, let's go. Two front page sections features sections, add or edit Futures were designed kayla school down here to where we have the button. All right, so for the u of l just gonna go ahead and ah quickly opened this Web design new page. All right, let's just copy that right here. Copy all of that. We don't even need to copy the full year. We can just go it four slash Web dash designs. Let's do that. Actually, let's see if that would actually walk forward, slash Web dash design and then closing four slash Let's he'd done. Let's hit Publish. And I'm actually Chris to see if this will. If this is gonna work, let's go back to the home page. Come down here, click on Lend More. And there you go. So it goes straight to the page so you don't need how to type in the full. You are veils for the services. Okay, So with businessmen, for example, right now, all you would need to add really would be four slash at anything. Business dash planning. Let me just see. That will Really quickly. So this is all you would need to add? Four slash business dash planning and enforce slash. That's all you need to add. You don't need to add our web cordes that has competed dot com or whatever your main domain is. So there you have it. Think is much fortunate video. And of course I will see you in the next class. 17. Building the Contact Us Section: Oh, right. A one final page that we need to build out will be the contact page, and all we're gonna do in this particular video would be to create the Contact horse section on the front page so that whenever anyone clicks on the button, it will take them straight to the contact page. So let's do this. I'm going to jump in to customize and I have to apologize. My internet service is really, really slow for some. All the reason. I don't know why from page sections. Now, I'm gonna come all the way down here and you can see that we actually do have a contact section. And if we decide to on hide its let me school all the way down here so you can see this is what it looks like. And this is where you could add the contact from short code and you will see the contact from DYS plane in here. However, what I like us to do is have a separate page. The Contact US page bill would actually have the map displaying their. So we're going to do here is we're going to create a very small section with a bag on image and then some Texan. Hey, if you'd like to contact us, click the button below to contact our So that's what we're gonna build out. So I'm gonna go ahead and hide this section again because we don't need it. But here's what we're gonna do. We're gonna make use off a different section and that section is going to be the actions section. All right, We could also make use of the hero section. But the difference between these two is that a hero section tends to be very tall in height , right? While the action section is it's a lot shorter sap affair going with the actions section. So let's go ahead and on, hide the section, and I'm gonna go ahead now and click on add or edit actions at an action at action again. So the text in here, I'm gonna paste it already, have some text, and let's just school up to show you what's been built right now. So it's a very it is right there. So for the title, I'm going to say Want to rich us Question mark. Okay. All right. Now for the button. The very 1st 1 I'm going to se must go down here. I'm going to say contact us. All right? And then for do you have a Let's just quickly do this. I'm gonna school all the way up here and let me open this in a new tab and let me grab the u R l. So it's just gonna be ford slash contacts dash us and then four slash. Okay, let's copy that. Let's go ahead and paste your bill in here. We move the question mark. So this would be the you a bill that it will take them to. Cool. Let's call back down here. All right? Contact us. Now. What I'm gonna do is to add a background image. So we're gonna go to design. Let's cool down once again. So in here, we can added the image, and I do have an image of really gotten from picks obey with the lady in here, smiling and then pretending to be making a phone call with a hand gesture. So I'm gonna select that. And there you go. Awesome. Okay. Now another for the text of illegible. We're gonna have to show the overlay and of course, overlay is in black, which is awesome. And I'm gonna make the capacity. I'm gonna make that 70% so make it a bit darker and Ah, there you go. Awesome. Awesome. Awesome. I now for the button itself the color here is set you orange. But we can go with a different kind of collar. Obviously the bottom. Back on color. Let's click in here. Andi, I'm not exactly sure what called to go with. We could go with blue. Maybe I'm not sure what you guys think. Blue and pink. You know what? What does Even on Blue for now, let's just Let's go ahead and hit. Publish Light. Let's close this up. I made a mistake. We should have rearranged the position. Okay, let's just do this. Will really quickly. We're gonna reposition the contact of section. So let's go back to customize bad Atta. Okay, come on. Front page sections load up, but still we have the action section. We're gonna drag that old way down here to the action section. Let's go down to see what we have. All right after the blawg, once a witch is awesome, Said There you have it. Let's go ahead and hit publish to save changes, and that is it. Let's go ahead and make sure that this bottom is actually working. So even on clicks and contact us, it should take them streets to the Contact Us page, which you can see right now. So that's That's Jimmy. Very next video available. Now go ahead and build out our contact page. 18. Creating the Contact Us Page: moving on. We're gonna build out the contact US page now, and we're gonna make use off a plug in, which is called happy Forms. And it's by theme foundry. And this is one of the easiest contact from plug ins I've ever walked with. It's really, really easy to use, so please go ahead and download the plug in. And when you install and activate the plug in, you will automatically be redirected to this particular page where you can add your email address so that you can agree to share how you used to plug it with the Debs. Oh, you can just go ahead and say, Skipped a step and continue, which I'm going to do now. The thing about this plug in is that it will automatically create a contact form for you, which you can edit. So this is right here. It's called the sample contact form. I'm gonna go ahead now and hit at it, and I'm just show you how easy it is to build out your from so form name. I'm just gonna change this to feel the form below. Okay, so we have the first name last name already built up for us. We also have the Multichoice multiple choice section, which is what's your reason for contacting us? So we're gonna do this? We're gonna change the default labels to Web design, which would be the 1st 1 The 2nd 1 will be, ah, business planning. All right. And then the 3rd 1 would be S e o. And I'm gonna add an option to add marketing. All right, so these are the full. So this is that we have, and it's multiple choice. So any potential client or customer canticle full, and then we have a judge, which isn't necessary. I don't understand why I would want to find out the age of, ah, clients. Let's remove this. I'm gonna click in here and will come down in here and just easily delete the entire line right here. Let's leave that. Okay. So very simple. We have first name, last name or chill reason for contacting those. Your message. Let's go ahead and add email, actually need email. So I'm gonna click in the millet here. We contract that just beneath the last name. All right, Can it's required. Cool. All right, let's just go ahead now and hit set up now and then in here, you can configure the email address where this form will be sent to. You can configure the kinds of messages they're going to get from the display name to the subject and so on. And you can also redirect users who have filled this from to another particular page. I'm just gonna go ahead now and hit style and ah, that's it. I don't think there's We need to change anything in here at this event form. Maybe. Let's click on Summit form. Let's bring down the font size. Just a little bit to 15 chance, different weights to normal. And then for the colors. Ah, that's OK, but they're willing to change anything in here. So let's just go ahead and heat. Save the form, and that's it. So I'm gonna copy this shot. Good. Right here. Right now. Let's copy that short code up that did not copy. Just click on copy to Clipboard. It does the same thing. So let's go. Teoh, The contact US page in here. Let's close this. I was go to contact us. We're gonna edit the page now. Over here, you will see. You can add the happy forms form that we just created. But there's also an option to add a contact form that comes with the jet pack Plug in. This particular from, however, is very bland is against C. It's just name, email, website message, and that's it. So that's why I chose not to go over this particular ah form that is provided with the jet pack. Let's go ahead and add happy forms and I'm gonna choose the form. Just fill the form below. Insert that in there. Let's hide our sidebar. Let's cool down in here. And also and a fitted image to make things look professional. We're going to go with this dude right here, said the featured image. And we're gonna go ahead and hit updates. And now let's see what the page looks like. View of the page. Contact us awesome. And there you go. Fill the form below all some very, very neat, very clean. I like this, but we can do more and I wanna show you something like, let's go back to the home page. Let's hit, Customize. I'm just closed this but Adam, but let's go to front Sections were going to go all the way down. Hit you where you have the contacts section. Open it up. And now in here, you actually have the ability to display your social media buttons and even a telephone number using some short codes. And they do have the entire what? A sample in here. So we can just grab everything that we have in here. Let's go ahead and hit. Copy. I disclosed this, and now we're gonna go ahead to the contact us page again. Let's go ahead and hit, Edit the page, and then I'm gonna do this. Let's create some space and I'm gonna type in. You can also reach us via social media. Or just give us give us a phone call, and then I'm gonna go ahead now and paste what we have. I'm going to remove the one for Twitter, all right? And then I'm going to remove the line space in. So that's he back space backspace again. Make sure there's no space in between the shut codes. All right, I'm gonna make this turned us into an H. Full tag. All right, let's go ahead and hit updates. You know, let's see what this page is going to look like Oh, I was Go ahead and hit. View the page. Let's cool down in here And then you go You can also, which is vast social media. Or just give us a phone call Facebook, Google Plus and then the phone number. Let's add some space between the short codes. Now let's go ahead and hit edit page. And in fact, let's do this. I'm gonna go ahead and highlight everything and make it bold. Make it bold. All right. So after Facebook, I'm going to add to spaces. And then, for the phone number itself, I'm going to add 123456 So, ideally in here is where you would add the link to your Facebook page and then for Google. Plus, he would add the link right here in place of the hash tag. If this was a real website, so that's it. Let's go ahead and hit updates and let's go back to view the page and then you go meet and clean. I like this. So that's it. We have successfully built out our contact us page now. Shameless plug here. I do have a YouTube channel. If you didn't know. I didn't know. It's called the Web monkey, All right, so I actually have a tutorial on how to use the happy forms blood and review. It's actually a lot more extensive. You can see it's about nearly 14 Winterland, so I actually walk you through how to use this plugging in full detail. So if you're interested, just goto Web monkey and just look for the happy forms. What press plug in review video. So that, I think, is much fortunate video. I will see you in the next class. 19. Setting up the Footer: believe it or not, we've come almost to the end off building our business website. And the final thing we need to do is to take care off our food. As you can see, we do have some demo widgets in here, and we also need to fix one of two things here at the very bottom. So let's do this. First of all, I'm gonna make sure that we disable the demo widgets right now. Even though if we come over here to the back end, let's go to the backhand. Come down here to parents, go to widgets now, even dough over here. If it's cool down for the footer Cyber one, you can see we don't have any budget. Simply with 42 43 even though they're in the widgets in here, the theme we're using will automatically populate the sidebars. Which some demo widgets. So the first thing we're gonna do is to disable the demo idiots. I'm going to do this by going to customize, and we're going to come down here to sit ins. Let's go to set sends and then click on side balls and then any I'm gonna click on disable Demel widgets. All right, let's go ahead now and hit. Publish? No. Right. And now from here, Widgets. I'm gonna go ahead now and add a very first widgets, which was going to be the address widgets. And I think it's around here somewhere on school. Back up. Uh, all right, it is. It's contact info and map. I'm gonna drag that in here. Let's paste it right there. All right? And now for the address, I'm gonna go ahead, and I think I have, and I just I can paste in here, which is maybe I just for the White House. We're not going to show the map. Will just leave the phone number as it is. And an email I can say admin at web code as dot com I I was just gonna go ahead and remove this. We don't need to show I was and, ah, we'll just change the title in here to address. All right, let's go ahead and hit. Save, and then we'll live the second side by empty the third side ball. Let's go ahead and add our Internet defense logo. Ah, where is it again? Right. It's right here. Incident Defense League jetpack. We're gonna go ahead and peace that in here, and we live in the very first badge. Now, let's go ahead and take a look at what we now have. Foods are schooled way down here, and Ah, there you go that we have the address phone number, email. Cool. And then we have the problem of the Internet Defense League badge as well. Nice. All right, we're gonna add one more thing to the bottom in here, which will be our footer menu. I'm gonna come over here, Teoh. We have menus, and we're going to go ahead right now, and we're gonna quit in new menu. Animal called this menu the fota menu Click create menu. And I will just add some pages with add contact us blawg. And then we can even add. Let's see, I think contact us and bloggers. Fine. Let's just add this to add those to the menu. Right? So come on. Come on, Come on. Islas drug blawg above Contact us said that to the future menu. As you can see Hit, save menu. And now let's go back in here. Refresh the page And there you go. We have a full time Nur logo. Some stuff in here badge and then we have the address influence. Well, awesome. Let's make a change. The bag on Coehlo. So I'm gonna hit, Customize, Let's close on menus. This is gonna be the final thing We're going, Teoh, do you? Let's come down here, Teoh colors, And then we're going to go to footer. All right, And now for the background color. Let's just school down here. Make sure we can see what we're doing. All right, Baghlan cola. We're gonna make that black, and you go. I kind of like that as it is. And you can also make some additional changes, such as changing the head, a caller stuff like that. But what is going to leave? That as it is, I don't want to change any other thin. Now to edit the message that you have here at the very bottom on the right, you can go to Let's cool back down. You can go in on Haiti for the credits. Oh, I'm sorry. Not on the colors. Cash. I'm getting ahead of myself. You have to go back to settings. I'm sorry. Settings. Then go to photo and then in here is where you can add a customize your copyright line. You can also do other things like disable the foot accredits area, hide your logo or even just disable the entire foot sidebars ever. If you didn't want to, let's go ahead and hit Publish and ah, that is it. That is it. We have fully built out our business. Where? Page website. Brother, Thank you so much Fortune, German Avonex video We are will just have a quick review off what we have done. 20. Conclusion: Well, well, well. So we've come to the end off this section, and I truly hope and believe that you've had a great time. You've learned how to use an awesome theme, the business extreme. And you've also learned how to use if you plug ins as well to build out a full fledged business website. Now, if you're building a similar upside for a client off yourself, there are always although pages that you can create as well. You can create like a Correa's paid, for example, where you can list out the latest job openings if you want to. And I'd be more than happy to take a look at your site if you actually building one. Just send a link and I can take a look at it that maybe give you some advice on what to improve on a bit more than happy to assist you in that way. As always, if you have any questions we get in, anything that you've learned will be torched in his particular section. Please always feel free to reach out to me. And if you have any suggestions on ways to improve this particular topic, this particular section please let me know they wanted happy to take your suggestions into consideration. So that's its hope. You had fun. And if this is the final section that you're taken in this course, then thank you so much for being a student. But if you're moving on to learning how to build all the websites, then go for it all the more than happy to assist you in other sections as well. So that's it. Thank you. And I will see you soon. Bye bye.