How To Make a Wordpress Website 2019 - Avada Theme For Beginners

hello and welcome to my course how to create a wordpress website using Avada 5.0 now this is a follow-up to my wildly successful course that I posted last year that used avada 4.0 and that had a hun percent feedback from all the people that took the course now in this course I'm going to show you everything that you need to know in order to set up your website from creating pages setting up your blog how to use all the different elements and it's gonna in the end it's gonna look really really great so if you're ready let me show you how to put together a website that's gonna get noticed all right again hello and welcome to this course in this first video I'm gonna show you how to get your WordPress website set up using the avada 5.0 theme now I got to tell you that a vaada 5.0 has brought a lot of changes from the previous build the 4.0 and so this is something that's gonna be a little bit new and exciting from my previous course where that was made in 2015 that was the 4.0 and I got to tell you that a lot it has really improved with every single update that it's had and I highly recommend it so I'm gonna show you where to buy it and then I'm gonna show you how to get it set up on a blue host and Bluehost is the company that I use for hosting I really like them so I'll show you everything how to get setup with that and so here we go so in order to purchase a Vata what you want to do is go to market and bought Oh calm and just type in Avada now the just a side note the invited marketplace if you need any kind of multimedia content whether it's graphics or any kind of PSD files anything like that that's the site that I use I think it's worthwhile to purchase some of the things they have short little videos music whatever your needs are and I use them all the time so Avada is right here now listen Avada is $60 I know there are a lot of themes out there that are cheaper than $60 but I have to tell you that I have been using this theme for about four years now and it just keeps getting better better it's so versatile it's very quick I just absolutely love it so for me the $60 is well worth it and I think that you should purchase it too so if you're going to go ahead and purchase it go ahead go right here you'll probably have to just set up an account I already have one and so just buy that all right if you're actually logged in and you ever need it in the future if you go up here to your account and go to downloads you can actually see all your previous downloads here from the Envato marketplace so - all the way down here at the bottom and if you ever need any of the files just go right here so what I'm gonna do is actually I went ahead and downloaded all files and documentation I did this before and I have the zip file and that's already right here on my desktop so what we're gonna do now is we're gonna assume that you don't have hosting I'm gonna show you how to get the hosting and install WordPress and then install that file the theme into WordPress now just a real quick mention about WordPress people ask me all the time we caná-- what's the difference between wordpress.org and wordpress.com you definitely want to get set up on wordpress.org because that's where that actually represents your own site so that's where you can go in and upload themes and do a lot of your own customization wordpress.com is it's more of you don't have that flexibility you can set up a blog but you're using their themes and so that's really the difference but that's all done for you and so what you want to do let's go ahead and you'll go to Bluehost so just Bluehost com I'll just go back here to the home page really quick so again I recommend Bluehost I hardly ever have any downtime they're very quick there's a lot of different plans you can just get started with our basic plan for 395 I'm just gonna let you go ahead and go through that and choose your own options it's pretty self-explanatory if you have the money I would go ahead and pay a little bit extra for a upgraded hosting plan because it will be faster so maybe one of the plus or primes or you know even a GoPro if you can afford the 1395 having a dedicated IP address and some of these other features well worth it and I pay I actually pay for that so I'd recommend you do that as well so we'll just assume that you went ahead and purchased plan through Bluehost or any of your other hosting companies generally once you're logged in and you're in the well they called the cPanel that has a lot of these same options and so work excuse me Bluehost has the install WordPress option right here under websites and so if you click that and this is assuming that you already set up a domain name and everything I don't think I have to go through you know that information so just go ahead and click the install WordPress once you've set that all up and we'll get started so once you've purchased the domain you can just come here I'm just going to go ahead and I'm going to be using a scratch site for the purpose of this tutorial and so rounds and wraps is something that I purchased before just to play with so we'll set we'll go ahead and get that set up and go ahead and click Next so sorry title go ahead and just name it whatever your website is like round rounds and reps and then right here this is gonna be your your email that you set up this will be your actual what you sign in with once you go to WordPress so you want to definitely write this down and choose a really good password so just that's gonna be the log in and then admin password I would go ahead you can keep this which is a really great password or you can change it to whatever you want I've already done that before and it's already set up so I'm not gonna change the password so that's not my password if you're thinking about it and then automatically create a database and then I understand okay and then I have read the terms and then go ahead and click install it'll just take a couple minutes to install and then you'll see a prompt that will say to go to website so I'm not gonna do any of that because it's already set up but once you go there it'll redirect you to wordpress.org and then you just type in this admin username and then your password and once you do that it's gonna lead you to what's called the dashboard in WordPress and so from the dashboard this is I'm going to reference this a lot in this tutorial because this is where everything happens is where you're gonna edit all your information this is kind of all the behind-the-scenes work that goes into your website so here is what the dashboard looks like and so to install the avada theme what I'm gonna do is I'm gonna go back to my desktop really quick here was that zip file that I downloaded from the Envato marketplace okay I'm gonna go ahead we're gonna expand that really quick so here's the file right there go ahead and open that up really quick and then avada theme click right there and then we're actually gonna I'm gonna drag this on my the desktop not that one we're gonna do this one the avada da zip I'm just gonna drop that on the desktop just for right now and so what we're going to do to install the theme you go to appearance themes and now I have some themes that I uploaded before they're all right in here and so what I'm gonna do is go add new and then click it again upload theme choose file and that was on my desktop and that was let's see the vadas zip okay open that and then install now now this will just take a you know a few minutes you actually upload and then install if everything goes well you'll get a message a confirmation message that it will say everything went fine sometimes if your hosting is limited to the your upload sometimes you'll actually get an error message they'll say are you sure you want to do this if that's the case I actually have a separate video that I can send your way I have it uploaded to YouTube and it'll run you through you know what that error is all about it's kind of frustrating when it you know it just says are you sure you want to do this and course you do but it will just basically be a blank screen so hopefully that won't be the case we'll see if this works I'm gonna just put this on pause while uploads and then we'll just start the video up again on page right here theme installed successfully and then what you want to do is go ahead and click activate alright so once you've activated it you'll have to go and actually install some of these required plugins go to go manage plugins right here and then what you want to do is install the fusion core fusion builder and probably a couple of these other ones as well but you just hit install it'll do everything for you you don't really have to do anything go here to return to your required plugins once it's activated successfully install the fusion builder I would probably say just go ahead and install for sure these two but layer slider go ahead and do that you'll probably use a slider revolution that's really cool slider that you can use if you're going to actually sell something on your website the WooCommerce is a really great plugin to have the Beebe press is basically if you're gonna have kind of like a forum so that's great Events Calendar obviously you know if you're gonna have a lot of events things like that they wanted people to see I would install that that's really awesome and then contact form more than likely you'll probably have that that's a really cool form that you can get set up where people can send you you know well contact you it's all self-explanatory so make sure you activate all those and I once if you ever want to come back to this screen it's right up here at the top up at a right there or right here on the left hand side and you can see right there the other thing you want to do is you want to go to system status really quick you want to make sure that everything is good now right here the WP memory limit I'm actually surprised I didn't get in an error before when I was uploading it because we should have we should actually have a higher limit than just 40 megabytes and so what I'm gonna do is I'll just go ahead and post the link to the video to explain how you can actually change these limits that and that's a really good idea especially if you decide to install some of the demos which I'll show you in a later class the final thing I want you to do with Avada is I want you to go to product registration now I'm already registered okay and so I can't really show you how to do this but essentially you need to register the product so it will auto update and you don't even have to worry about it and you can have the support from Avada for I think it's like six months and so it's going to run you through all of the descriptions it'll actually send you back to the theme forest right here and it'll show you some of the you'll go to settings and it'll actually ask you about your API keys so these are just and that's where you'll find it and that's actually what you'll plug in to this area when you come back to it so just follow the instructions that it comes up with and make sure that you register your product but at this point Avada is actually installed we have all the plugins updated and we're all ready to roll so at this point I'm gonna show you go through all the different options of Avada and how do you get your web pages set up and we're gonna start from the beginning we're gonna just I'm gonna make a very basic show you all the how to set up your pages and how to put it all together so of course if you have any questions or if you if I've lost you at any point definitely make sure that you follow up with me you can send me emails messages here on Skillshare or any other platform that this might be on I'm always willing to help you but that's the the gist of getting Avada set up on WordPress we're all set to go and I'll see you in the next video now in this video I want to continue showing you what I was showing you before as far as how to access WordPress and just give you a quick overview kind of a tour of the WordPress dashboard now when you want to access your site what you do is you just type in the web address that you chose okay so mine remember Rosen raps calm and then you're going to add this little appendage to the backend the WP - log in and when you do that it'll bring you up to the login screen so type in the username that you created and the password right here and go ahead and log in so anytime that you want to get to the dashboard this is how you're gonna do it alright very good so we saw this before this is the dashboard I want to just show you some of the options really quick I don't want to waste a whole lot of time doing this but again as a reminder anything for the avada anything with the support installing the demos plugins anything like that it's all gonna be accessed right here now over here in the left hand side this is where we're gonna find all the options for WordPress and also up here in the top right hand corner if anything with your personal information the settings password anything like that you'll find it up here in the top right but over here on the left let's just go through some of the basics here so obviously dashboard or home will bring you back here to this page okay now post post is gonna be anything if you have a blog or if you're going to update any kind of articles or have any articles on your website this is that that's gonna be what's called a post now media obviously that's gonna be any of the videos that you upload any of the pictures anything like that or any kind of PDF files it's all going to go to media now pages that refers to the pages on your website so your home page your blog page your contact page those will be pages so those are different than posts because remember posts are going to be more associated with something like a blog and then if anybody actually leaves comments on any of your posts you'll find all the comments here so you can regulate those your portfolio would be if you're a for instance an artist or a photographer or something like that and you're gonna upload a lot of different pictures the portfolio would be where you do that or that's an option you don't have to but you can set up a portfolio looks really really great okay now I'm gonna skip down here to appearance appearance you're going to access this a lot throughout this whole tutorial so just keep this one in mind themes we looked at that earlier that's where you actually uploaded a vada if you have any other theme that you want to use this would be where you go but down here so that a lot of options here so I want to get ahead of myself but any of the options for a vada would be here under theme options and again I'm going to in the future I'm going to show you where that all the options for that but for right now let's just leave it be now plugins will also cover that in the future but plugins there are a lot of different plugins that you can actually add to your WordPress website that's going to make it either fast or just run more smoothly it's going to help you with your SEO and again I will show you a lot of those in the future if you have different users you can add those here and also as far as some of the settings we'll access those right here as far as you know when you're riding a you know just some of the different options what I recommend is I recommend you just going through some of these and looking them over and it's pretty self-explanatory for the most part but I just want you to be familiar with it one of the things I want to do really quick that's gonna help you in the future since we're already here just go down to permalinks click on that really quick and make sure that this right here post name is clicked anytime you have any kind of post it's gonna show up as your website name and then the slash and then whatever the name of the article is for SEO purposes this is the best option to have so make sure that you just click that and this will save us time in the future so that you don't have any crazy looking URL and then just hit Save Changes okay and then of course like I said you can click right here go back to your dashboard and that about sums up the that's just an overview of the dashboard we're gonna go through each one of these different options as we go along here kind of show you how to do it set up your pages sub some posts with your blog but that's about it for right now all right now to get served with your website I like to follow a certain order when I do that and the first thing I like to do is actually set up your pages now your pages is gonna be your homepage your blog page your whatever page contact page you name it and so to do that go to pages and go add new we'll name our home page will just call home I'm being pretty generic so all I want you to do at this point is just create the page and then hit publish and you don't have to have all the pages done all from the beginning but I like to do at least the ones that I know for sure I'm going to have and so I'm going to go ahead and go back here to pages add new and I'm going to create my blog page again the blog page would be any page that you think that you're gonna post up new content to it does have to be called blog but I'll go ahead and call it that and hit publish and my advice to you would be just go ahead get a couple pages and do the same thing that I just did and and then from there if you go to all pages you can see I have my home page in my blog page and so anytime you want to access those you just go to pages all pages and then you can go back and you can edit those individually as you can see right there you can put them in the trash whatever so that's where you're always going to have access to your pages now what I want to do now is set up the home page and then my blog page so to do that go to appearance and go to customize and now go down to static front page and so what I'm gonna do is I'm gonna have my home page be a static page that means that unless I make changes to it it's always the same so when people visit my website they come to that page that's considered your static page so I'm going to set up this page like that the front page will be my home and then the post page which we're going to set up as a blog later we'll go ahead and put a blog right there and then just hit save and publish now that we've done that anytime then you come to your dashboard and you want to any of the pages that you create that's how you'll do it right from there okay so now you have a couple of pages set up and now I want to show you go through the theme options now something really important to understand is that Evonik has so many options and customizations and things that you can do to it it would be impossible for me to show you everything and so if you do have a question as I mentioned before just reach out to me send me an email and let me know how I can help you so I'd like to start with the theme options I went to appearance click - the theme options and this is what we come to and the first part that we have here is the layout now I'm going to quickly go through a lot of this I'm not going to go through every single option but I want to just show you what some of this stuff means and it'll give you a good idea and give you a good start okay so layout you have a choice of either box or wide now what does that mean I'm gonna go to my site simple content creation and show you really quick this is an example of wide meaning that this first page right here is why it goes the entire expanse of the webpage okay it's the full length of it now an example of glove box will go to my blog and so instead of being the full length of the page it's actually gonna have things on the side so it's gonna be a certain width so here you can see like a background and it's just a certain width and it and you go back here to my theme options and you can see the site width I have it at 11 70 pixels and you can define that so it really just kind of depends on the site that you you would like I've seen sites done both ways I personally like wide for most my pages I think it looks great but you know it really depends on what you want to do and so I just go through these different options right here you can play with it a single sidebar layout you know sidebar would basically if I go back here to the blog these are the sidebar this right here you can have a single sidebar you can have dual sidebar another side bar on this side all those options are in here and you can really determine the the width of it so the menu and this is the next video well we'll set up we'll actually set up the menu itself but as far as the overall heights in the menu so that again just as a reminder this is the menu right here these are the different pages that I have set up so I have my home and blog I have a couple others obviously my logo so there's gonna be everything here is gonna be right there so the height of the menu you know you can see that you know change the padding if you want a shadow and what I recommend doing really honest-to-goodness the only way out that I learned this was to change something I came down here safe changes always make sure that any time that you change any of the options here in theme options that you do Save Changes before you go to a different page or else you're gonna be a little upset you'll learn that lesson quickly you know if you want you know dividers you know just go through all this and look what it has because there's a ton a ton of different options even for your mobile device you have different options and so what that requires you to actually select it save it and then look at on your phone and you you know you're gonna have to change it mega menu that it's a really big menu and then the next one is responsive now responsive you absolutely want to click that to the on position okay responsive basically means that on any screen it's gonna look really good and because everything is going mobile or you know to you know something like your your tablet you want to make sure that it's responsive in fact you know I've been doing a lot of thinking lately that instead because a lot of times I will design my site on the web excuse me on the desktop and then I would change it to a mobile device but lately I've been thinking I need to actually design my site for a mobile device and then maybe change it to a desktop you know if that makes sense because most people are looking on their phones nowadays so make sure that you can go through here change the number of pixels of where you know as far as it responsive there's gonna require a lot of you you know playing with the options make sure you always save it and looking at on your mobile device okay and then colors one of the cool things you can do is there's a predefined theme skin as it says here a white one which is basically you know where everything is white for the most part or actually the dark one and so dark would be let's see let's just go here really quick where the whole page is it has more this dark feel to it so depending on the field that you want have for your website predefined colors color schemes the color schemes let me go back here would be you know anytime the well you don't really see here but anytime that you have links or anything like that or buttons this predefined theme this is basically what it's gonna be so maybe I actually have a few here so this is pretty defined as in it's blue so like this this I guess cover over right here is blue a lot of the links are gonna be blue you're gonna see that all throughout the theme and so if you want to have a predefined color scheme or or have a primary color you can actually select one here do that there now the headers right back here of course this is the header and so I have the logo over here and then all the links over here and you can see you have all these different options right here that you can select that looks similar to what I have you can have the phone number and so a lot of different options right there you can choose where you actually have it the location of it where it's at top left right alright and then of course a sticky header I like to show people this a sticky header is basically if you watch as I scroll down you see how it goes smaller and it follows you all the way down I kind of like that so you have easy access to the different links and that's a pretty cool option right there you can have a background image back here the styling of it you know as far as you know shadows colors things like that it's all available there of course upload your logo this gives you all the instructions as far as your logo goes if if you want to display on a Retina display which is becoming increasingly more important as 4k becomes more mainstream that you know just make the size of the logo twice as big and of course for your mobile devices and then the favicon right here favicon is basically up here see the little it's this isn't a very good one to be honest but it's the little icon that you can see up there on your tab and so it you know 16 by 16 tells you how big it needs to be I would definitely load up one of those instead of having the generic one that your hosting company will put there a footer of course the footer is all the way down here and you can see all I have for the footer is the copyright simple content creation on this page you can actually have some different widgets as far as like a calendar or different links and all those options are in here you can see how big it is you know if you want the footer widgets you can turn that on I'll show you later where you actually access the widgets it's under appearance and you go widgets and I'll show it for the footer but then you can put all your your description right here for that okay and then of course the sidebars the styling on that background that would be like this color what's going on right here for the background the typography now you can find pretty much any kind of font that you want right here and the typography so you can just choose it right here and then choose the size and so this is for the body now the body would be any of the regular text like this right here now if you go to headers of course this is going to be if your h1 and h2 that you have on any of your other pages how big it is what kind of font it is and all the options are right there of course we do want to have a blog you can name your blog whatever you like go through the different styles of the blog you know right here this is the front page of my blog on simple content creation right there and I think this is medium alternate I believe that's what that is again this is just something you have to go through change the different looks of it portfolio again this is gonna be for any artists or photographers to set up social media let's click on that really quick if you have if you want social media links on any of your pages this is you this is where you go you put in on your information I'd like to back to your Facebook page for instance and so anytime that you put a social media icon anywhere it'll know exactly where to take it okay and then just go through the rest of these search page right there you know the different format of it and let's see a lot of different options right here go through each one of those some of these ones down here at custom CSS and advanced unless you really know what you're doing I would probably leave those alone if you happen to want to put in a Google like a tracking code if you know what you're doing there this would be where you go to advance code fields and you can put it right there and so you don't even have to go into the code into the page itself you just put it right here and it'll show up okay and then just finally import-export if you want to just copy all your data and export it and send it somewhere to somebody this is where you do it okay so that's just a general overview of theme options there's so many options that I do apologize it probably felt like I was rambling a little bit but you just really have to go through all the options take a look at what they are but if you're ever in question as how to change something if you don't see it on the individual pages for the options then you would want to go theme options and see if it's in there because generally it is and unfortunately you have to go back and forth sometimes between the two but the more you get familiar with the easier it becomes now for the final video of getting everything set up with the bottom I know I've shown you a lot of options you're probably getting bored at this point you probably want to get started on your website and I understand but let me show you a really easy way how you can get started one of the cool things about of audit is they include what's called demo content so if you go up to Avada and click install demos they created a whole host of different demo sites that you can actually install yourself it'll upload all the content from these demo sites and the only thing that you have to do is actually go back and delete the content that that's not relevant and change the wording and whatnot so it can actually make things a lot easier for you so if you have a certain style that you had in mind instead of creating each page individually and working on it that way you can actually just kind of deconstruct an existing demo and in making your own so if you look through here a lot of different demos they're constantly coming out with new demos and they honestly they just keep getting better and better all the time so you can preview any one of these demos for instance will preview this gm1 and so if you install the demo content everything that you see here on the demo will be there and it'll be exactly how it is right here so again it can be pretty good in the sense that the overall format setup is so if you like how its set up then fine I mean you can you can change anything you want at any time but you might actually have to delete a lot of things or change a lot of the text a lot of the pictures and whatnot but it's all set up already everything from testimonials membership facilities blog you name it it's all here and so I just want to show you actually how to install one of those again you can preview each and every one of those see which one would be closest to what you would like and so all you have to do is of course click install hit OK now this might take a couple minutes a couple seconds it just really varies and depends on your hosting company but if you go to the top everything was successfully installed right there and now there's this plugin that they want you to install regenerate thumbnails in the basically that just resizes all the images that can be a little bit tedious but basically just go ahead and click on that and and then on this next page it'll actually I already installed it earlier so the plug-in down here just install it I'll run it and then you should be good to go and it'll actually lead you back to your dashboard when everything's said and done and then when you go if you ever want to access your page here from the dashboard just go up here and then go visit site and it'll actually take you to the site right there so I kind of worked on this before a little bit so it kind of has a few changes to it but all the content is right there and it's just I just have to go back in and change it out to how I like it so that's pretty cool if you go back to your dashboard and you go to your pages you'll see each individual page right there and you can go in and edit them as you wish and that's basically where we're gonna pick up on the next pages I'm gonna start off with a blank page and we're gonna work that way and show you exactly how everything works and how it comes together so it's gonna be very very cool but I want to show you that really quick it's a fast way to put together a website you know I don't think everybody should I think you should definitely make the site your own but that's how you install the demo content very very simple and again if you ever have any questions please let me know at this point we've laid the foundation of how to get everything set up and it's been really kind of boring so I'm really excited at this point we can actually get started with some of our pages and actually putting some things together so let me show you how you to do that so to do that go to pages and go all pages if you recall earlier we already created the home and blog page so go to the home and click Edit all right so this is the fusion builder this is the page where you're gonna edit everything if the fusion builder isn't here by default go ahead it's gonna be right here so click just go between the two you don't use default editor that's all kind of manual that's like the old way of doing it fusion builder is basically gonna allow you to do everything drag-and-drop and it's really really cool now there's been a lot of updates to Avada 5.0 over the 4.0 version and before in a great everything is so much easier at this point and they put everything all together right here so you don't have to go chasing elements you know if you look up here start up here with the Builder you know there's all these different options up here - you know toggle the the different containers you know add some code you can actually like save different elements meaning if you create a cool container that has certain elements to it you can actually save the whole page layout and what it'll do is it'll save it to over here to your library and so you can name it whatever you want and you just save that template and it will save and so you can reload that same page or that certain container or column and you can just use a future reference so you're not having to recreate everything every single time and that's a cool upgrade that they've done now the other thing that they have added of course is this it's the history so it's kind of like if you have a Mac it's kind of like time machine where you can go back you can actually see all your edits from revisions and you can actually go back to previous things and that's makes it so much easier because I know a lot of time I've updated or changed things and I didn't mean to and there was just no way to actually go back to us so that's very very cool now just moving on over really quick if you ever want to preview what you're working on just and you're not familiar with WordPress you just click right here on preview changes and that will actually show you an example of what you have so far don't hit update you never get updating until you're actually ready to save whatever you're working on and but you can always go back if you do happen to hit update you can actually you can go back to a previous version but as far as the containers go it's all right here and it's all so simple if you go down here there's some more fusion page options that you can take a look at as far as the sliders the page setup you know just different padding the header you know whether or not to display it yeah you can go through here and look at all this you won't use as quite as much down here but I just want you to be aware of it now I do like the fact that they do have a getting started video so if you have some additional questions and I'm not answering them this might be very helpful for you but to get started they have right here to add a container and the other thing is they actually have a pre-built page and I'm gonna show you this really quick if you could recall from the last video in the demos I showed you that you could install a whole demo site now if you don't want to do that which you know sometimes I don't recommend because it's just a lot of stuff you're not going to use you can go here click on any demo you want if there's a if there's something that you saw that you loved you can just click on it so the avada gym and you can click on any of the pages and you can load it up and it'll load the entire page for you and that is very very cool and so I would definitely need to take advantage of that so going back here we just add a container now basically to explain a container is basically it's part of a web page it's what it it contains ok hence the name container alright so we're just gonna do right here a full page container to start off with okay now the container let me go over here now this section right here with this guy this is a container this box alright and these are individual elements right here and right here are individual elements with in the container but this actual guy the picture of this guy that is the background of the container so if you click on this edit right here and go to background and let's see we'll upload an image so when you upload an image to your media library these images are already here what we can do is go to upload and you can just drag and drop an image there and you know I always recommend that you before you upload any of your images that you do change them make them as small as possible you don't want to upload an image that's like 3 4 or 5 megabytes anything like that you want to make it really small for the web so but these files are already in my library so you know we could just choose any one of these we'll choose this guy right now you go down here to insert into page and then now this will become that background ok and of course you can change you know different animations whatnot the overall design if you want to border like the size of it okay but in general it's gonna be a hundred percent with meaning it goes all the way across and we're just gonna hit save let's go over here to preview really quick because we want to take a look at what we have okay and actually that container is way too small so I'll just go back in here and all right there you go so all I did there was I went in to the element the container and what's a design and then I changed the padding size so I just changed a 500 and that was what made it go from that small to a little bit larger and you know we can go in here let's just add doesn't make that 200 and then we can preview those changes again and we can see what that looks like there we go so just made it even bigger all right and so once we do that to the container then what we want to do is actually add some elements and so let's do content boxes now the content boxes let's go ahead and just work on this really quick I'll show you what we can do so I'm just going to say hello this is a box okay I'm going to choose an icon we'll just do well do this little leaf right there all right you can change the color of everything if you like and you can or you can upload your own image and then I'm gonna say thank you for viewing our website okay I'm gonna hit save now you can go here and add more content boxes as you go along and this will actually change how they're set up but I'm gonna save that we're going to preview it okay and so that's one box right there then why I can do is I could just keep going in adding more and more boxes just like that and then let's go ahead classic icon on top if we want and what I'm gonna do is I'll go in here just really quick I'm gonna choose some icons I'm just gonna choose whatever I just want to do this so you can actually see how this is set up do it heart we're gonna save that go up here preview changes one more time and then what we should have ways so we should have four icons side by side alright so actually I messed up so they're all stacked on top of each other so if I go back here alright to the content boxes and the number of columns so let's change that to four instead of one that's why it's not side-by-side so we'll save that one more time we're gonna preview it and they should be side by side yeah there we go okay so that's side by side very good looks awesome and then what we could do to come back here in this container and so if we're finished with that and we like it everything looks great then what we can do is we can just choose another container and let's just do a full width container and what that does is it goes right up underneath now if you wanted to change the size of the elements what you can do is just click right here and we'll just say let's make this element half the size okay you can go right here and you can actually clone that and you'll get another one right here and then what you can do is we'll just do I don't know a checklist right there and we'll just type in content will say that and then in this element over here what we can do is we could just do I don't know a progress bar something like that okay and then you know of course these individual elements right here just remember you can change the background to whatever you like so we could just make this straight black and of course we'll go and we'll make this one black up here to the design make it black I don't think I don't think we did that okay let's preview that see what it looks like so remember we added another container okay and there it is right there it's not it's not much to look at because you have to actually add more content to it I just did something really really quick but I'm just want to show you how all these things can come together now if you have any questions about any of the elements right here and what they do what i really suggest you do is i suggest you go to the avada the theme fusion right here and I would check out their demo site because you can click on all these different elements and pages and it'll just give you a ton of ideas of how to get everything set up it'll show you what the different elements actually do for instance just dividers you can see that all the different dividers that they have right here and what they look like or for instance go over to person so if you wanted to like highlight yourself you know all these different looks are things that you can get set up and all the options are right there within the the individual element and so like we have right here for column and and again I want you to just look at this so you know what all these buttons do what's actually available and possible because if it's here it's definitely possible to make so differ buttons you can change the color you can change anything and it's really really neat and so you know going back here if we wanted to for instance add something else you know we can just do another let's see you can just add another column right in here right underneath these other two that I did we can do an element right there and then let's see do a countdown box and so you put it in the time and everything right there hit save and then if we preview that there it goes right there and so it's really really awesome how you can get everything set up and it's just a matter of dragging and dropping alright so for instance one more time if we wanted another container underneath there and we wanted to and this is basically the container is basically just showing you how the elements would be set up so if we just do something like this okay you can see we have you know it's taking up 1/5 or 4/5 and you can change this to if you change this to 3/5 okay that will push this element down here but if we just change this to 2/5 it would move it up there and so you can change the different sizes at any time and just remember that you can save these different elements and you can put them in your library and so let's just say I'll just say do element will save that container ok so that container saved right here you go to library container and then they'll just put it right there if you ever want to delete a hold container just delete it and so it's really simple what you can do here and I really liked that a lot I think you know it's streamlined it from previous versions and you know the individual elements yeah it you know it takes a little you guys have to look at each one and you know kind of figure it out but you know I think that's what you have to do to to get better at this and so if you have any questions as I've always said throughout the in this entire course you know please I mean just let me know so what I want to show you in the next course is how to set up a fusion slider and that's what this is right here this fusion the slider it looks really really great and I'll show you how to set up that element okay so in this lesson I want to pick up where we left off I showed you a lot of the page options in the last lesson on how to set up your page now we're going to continue here with the home page that we left off on and I want to show you how to do a fusion slider now going back to our example page this right here is a fusion slider okay has an image with the words with buttons and so I think they look really great I like the fusion sliders a lot and so too in order to create those going back to the Edit Page basically you go over to you have to do two things to create a fusion slider and the first thing is you actually have to create the slider itself so you go to fusion slider slider and then add or edit sliders and so you can see right here on the right hand side these are all sliders that have were created beforehand but to create a new one basically just name something that you would be familiar with and then as far as the slider size a hundred percent would be the width all the way across and then as far as the height goes obviously that's how tall it is and so if you wanted to fill whole screen you know you make it a little bit larger or smaller and and so there's different effects that you can select here as I had mentioned before you always want to check just you can check to see you know what it looks like a kind of experiment with it I think doing the parallax scrolling effect is always neat so you check that a lot of these you know whether or not you want avocation arrows or if you have multiple sliders you know you might want to check a few of these boxes but once you're done and you've gone through these options and you've perfected it you just go ahead and add slider okay and then once you do that okay the slider itself is just simply the structure of the slide but it's not what you actually see on the slide and so to do that you go up here to add or edit slides under the fusion slider and so we'll go ahead and do that and then just click up here add new slide so here is where you actually create the content of your slide and so again just go ahead and label it something that you'll remember and you have a few options that you can do you can do a image such as this one right here or what's really neat is you can actually create a slide with video and I really like doing this option because you have you know an actual like video loop video happening here in the background and so you know you want to be careful that it's not too distracting but I found a lot to be you know to really be incredible and they look great so you have that option of doing either one you know if you do your self-hosted you just upload the right format you know mp4 is the most common one right there one thing I will tell you that if you self host your video what you have to do is you actually have to upload and a separate image for mobile devices because the the video action won't play on your mobile too so you just have to have an image that's maybe similar to it that's static so that's the only drawback to it however if you're looking on a desktop it looks really great and so you know you want to go through these options you have the options to mute it auto play loop the video those are all selected it's pretty self-explanatory right here and of course coming down here you'll go to the heading area and so this will be where you actually put the type and so you have kind of a heading like an h1 heading right there and then you have something underneath there okay so the heading area you'd put it right there the size of the font that you want to course color you know any type of background area and then the caption area would be the smaller text right there and so again you would customize that to how you like it and then here at the bottom you have a few options of you know you can actually have the as far as links you can have either have buttons or the full slide if you simply want just one button all you have to do is actually just delete the text on one of these if you want two buttons side-by-side you just leave it as it is and so you have to go through here to customize it you actually have to know a little bit about coding if you're going to do a link to something you want to actually put it right between these parentheses and put the web address and you can change you know the size of the button the shape and again you have to be a little bit familiar with with the code here as far as how to change those exactly I'll you can just go right here you can see some of the options as far as the buttons go so once you're done with that in order to associate this slide with the slider all the sliders are right here so the one that you just created will be over here on this side so what you have to do is actually click on the slider select it and so it'll associate this slide with that slider if that makes sense okay once you do that you want to hit publish and then what you'll want to do is you want to go back you want to go back to the edit page and if that's the slider that you want to use okay what you'll do is you'll go all the way to the bottom here to fusion page options and if you want the slider on that particular page what you'll do is you'll first select fusion slider there's a couple other sliders that are a part of Levada but you'll just pick fusion slider and then you'll go ahead and pick the slider the name of the slider and then of course you choose where you want it on the page and once you do that and you hit update or preview changes that slider will be there and that's it it's really it's pretty easy to make the slider the only thing that really tripped me up was the fact that you had to create a slider and then you had to create a separate slide and then associate the two and so that took me initially wait way back a few years ago that that took a little bit of trial and error to figure that out but if you do it correctly you can have an incredible slider the fusion slider and it looks great and it'll really enhance the look of your page so far you should be progressing along fairly well you got the content of your page you got a fusion slider I'm going to show you how to get your menu system set up really quick as you can see here we don't have any menu up at the top we do have the logo over here but all we see is the fusion slider so to do that from your dashboard what you want to do is go to appearance and then from there I want you to go to menus so here in the menus you can see the pages that you we've actually created the home and the blog page and those are the ones that we've had so far and so go ahead click those two and then you add to menu once they go over here then you can manipulate them just a little bit if you have any kind of attributes or menu icon anything like that you can associate that with that and you can also play with the fusion mega menu which just makes the the it just makes them really big in other words and so also what you can do is if you have anything like a hierarchy of so Earth we can do is you can drag these and so if you drag it over it make it a sub-item basically you'll have the blog and then underneath that will be the home page and so if you have any like main topic with you know subtopics you can do that also you can just move these around any way that you like okay and that's how and this is the order that they'll appear right there click main navigation and top navigation and then all you do at that point is you hit save okay and then you'll get the confirmation that the main menu has been updated all right very good so when you come back here to check to see if the menu worked there it is we have the home and the blog so it actually worked just fine now I want to show you another option really quick if you go to appearance and theme options I want to show you how you can actually choose different headers so it will look a little bit different as well I've got over this before and the theme options but I go to your header and so currently this one right here is selected but we can make it look a little bit different as well Mabel's try this one really quick Save Changes and we're going to try to preview this and see if it looks any different yeah okay very good and so there you can see how it actually changes the look of the menu of course there's a lot of different options I had talked about these options before as far as the header goes let's make sure that the sticky header is on as well sticky header just simply means that when you slide down the sticky the header will stay with it and let's save changes well refresh this really quick and we'll see if it works all right yep there we go it's said that doesn't look really good right there in the middle of his head but that's just to show you that as far as the header goes there's a lot of different options that you can choose maybe we can choose this one really quick we'll take a look see what that looks like yeah doesn't look very good but again this is just a lot of things that you can do and so we have our menu all set up as you add more pages then you'll be able to add more selection to it but pretty easy to set up overall now in this video I'm gonna show you how to set up your blog your post page whatever you want to call it and I showed you this option before but what I want you to do is go to customize appearance and then customize and let's go down here to the static front page and I just want to make sure that you have this option clicked if you didn't see it in the video before so this is how you said if your blog you have to specify which one is going to be the home page so we have a static page if you're gonna have for instance like a news page or a home page that constantly changes you can actually make that we're kind of like your blog your the front page so you do your latest post okay but if you want to actually have a front page and then a separate blog page you just select the page from here so home and then post page will be your blog and that's what we named it before I just want to make sure that you have that selected and then from there from there what I want you to do is to go to appearance and then I want you to go to theme options scroll down here to blog click that and that's going to give you all the options for your blog and this is going to be universal meaning it's going to show up on every single page if you want to do individual options you'll be able to do that when you do oppose individual posts at the bottom of any individual posts in the Edit page you'll be able to select certain options for the page but let me just show you really quick what my blog looks like here on simple content creation so you can see that the blog up here this is the individual pages right there and actually you might want to come to the blog take a look at the some of these articles they might be useful to you but this is how we have it set up and let me click on here so you can take a look at one of the posts all right so this is one of my posts it has some of the related post right there comments box pretty simple and all those options right are going to be what you find right here so page title bar you will actually if you do select that you'll see a title bar up here I kind of don't like it I think it's kind of messy and if you're gonna have it heading anyways it just becomes redundant so choose that option if you like it my blog layout is actually medium alternate and that was what this is the medium alternate and I like the look of that so play around with those options see what kind of layout that you like the best if you want to have pages of blogs go ahead and select this or if you just want to load more infinite scroll word you'll just scroll it'll just infinitely scroll through all your different posts as you scroll down that's what that option means and again if you want to excerpt so I just have that I think my instead of 50 this is actually for this current right now but that would be the how long this excerpt is right there and then a featured image that would be this right here that's the featured image all right and then you can just set up the the formatting of the date and time if you want to set that block single post again these are all Universal options so they'll be they'll any post that you post in the future it'll select this these options on or off and so if you don't want like the author box or you know the pagination anything like that you can select all those options right here or if you just want to completely turn off comments completely on your blog you can turn it off right here and you don't have to do it individually and of course the blog the meta a lot of this I turn off I really don't like seeing all that in the meta I don't even think I have it here on my blog nope I have it all turned off and so all of those options are right there okay so if you're going to actually post your blog now that we have all that set up all you'll do usually go to post and then you'll go add new so let's go ahead and do that so if you'll notice the post page is a lot like the pages page when you're setting up a page and so we're going to use the fusion slider click on that and that's gonna make it really simple for us so it's the same thing as pages you just create a title of your veer post and then you just start building it from here okay and so you can start with containers they actually have some pre-built pages if you want to do it that way and you just start adding elements to it as you go along right here this is what I was talking about that if you want individual each page individually with certain things you can actually there's a lot of the options right here and so whether it's show you know show all the related posts which again a related post would be this option right there I kind of like that so if somebody reads your art they can go to another one really easily and so you can change this individually for each one turn out it on and off and you have a lot of the different options over here turning on your foot or your head or things like that so very customizable over here where you set your featured image okay that would be this right here is the featured image for this post and that's going to show up right there and that's basically you just click on here you'll go to your media library you just select something or you can actually upload it and then you just hit set featured image down here on the bottom right and that's it that's all you have to do they're tags if you if you want to make it a little bit more organized you know start adding some tags that will describe the article so if somebody does a search on your page they can find more quickly if you want to set up different categories that also is gonna make it a little bit easier to find things okay once you do that if you're not ready you can do save draft okay do not hit publish until you're ready to publish and when you are just go ahead and hit that button and then you can preview it at any time so if you make some changes you just go up here preview you see what it looks like and just make changes as you go along and that's about it as far as doing your blog goes once as soon as you hit publish it'll automatically show up on whatever page that you specified as being your blog page just like I had for mine so there's a blog so when I publish this it automatically showed up here and people could find it right from there okay so if you have any questions as always let me know but that's how you set up your blog I figured since I already showed you how to set up your homepage and also a blog I figured I'd show you how to set up a contact page as well because it's a little it's not tricky but there's a few steps that you want to do so a contact page a good example of that would be this one right here now there's a website that I created for another doctor and this page is actually ranked number one so pretty proud about that because there are a lot of different chiropractors in the area where this person's at but this contact page let's see a comprises having location map and then at the bottom a area where you can actually submit either a question or you know something like that and so in order to create a page a contact page similar to this one the first thing that you need to do is go to appearance and then go to theme options go ahead and scroll down here and then go to contact form click on that so the first thing that you need to do if you want to receive any kind of email as you'll need to put your email in there if you want to recap show you can do that as well now if you want the Google map what you need to do is you need to get a Google Maps API key if you just follow this link it'll talk you through it if you need any help you know just let me know it's pretty straightforward and you just put in the code right there as soon as you create it and you make sure that you put your address in here there's several different options that you have right here as far as the road map satellite hybrid terrain you can change the look of it you can also change as far as well here you can change the dimensions and then you can actually change how far zoomed in the map is so this one you know it's a zoomed out on the City of Greenville you know just slightly so you can change that option right there and you can decide you know all the rest of the options as well and another cool thing is you can actually change the default the styling so check these out these different stylings and you can see what those look like so once you've done all that what you need to do is you need to go to pages and you need to create a contact page and so that's just a matter of we're just going to name this we'll just name it oh geez bad contact and then down here and page attributes instead of default template generally you'll just leave this alone you're gonna actually select contact okay so on these options even with the fusion builder you won't actually see the map or the contact form anywhere on here and you might be wondering where it's at just set it up so it automatically will populate so whatever that you build your side out to you know as you can put all the containers you want well what's gonna default to is the map will always be on top and then this will always be on the bottom and so when you build out that page it's always gonna be all this stuff here in between so you can jam as much stuff as you want in between them but the map and the contact form will be on the top and bottom and that's essentially it you know go through the different options build it out and then you just hit publish and that will create this contact page with all the information that maybe your followers or the people that are looking for your business need okay that's it now in this video I'm going to show you guys how you can get started with widgets and sidebars so to get those set up we go to appearance and then go to theme options and with your sidebar okay all the options are right here for the sidebar so go through those options and you can see how you want to get them set up particularly for the pages and the sizing and all that okay but in order to set up those widgets go to appearance and widgets when I say widgets they refer to the ones at the bottom at the footer and also on the the actual sidebars themselves so let me show you really quick right here on this demo right here okay down here in the this is just above the footer so these are widgets right here there's four columns and it has four different items right there and of course the sidebar would be all this stuff right over here from my blog okay so in order to set those up or to edit those as I said you go to appearance and then go to widgets and so here we can see the blog sidebar and this has a whole ton of different items that you want there okay so you probably don't want your this many things in your sidebar I have about four and so this is just kind of by default it has all J's this looks like about 15 to 20 and so what you do is you just arrange things as you like all the options are over here on the left okay and all you have to do is take whatever you like and drag it over once you drag it over it'll open up and so for instance this this little add link right here you can do like a little image right there and then you just hit save if you want to delete anything all you have to do is expand it and delete it okay and then you can like I said you can rearrange anything so for a sidebar you know having something like recent post tagcloud to see a lot of people have that if you want to do text text is something that you could use if you wanted to put in some HTML code something like that if you had a certain thing you want to put in you just all you have to do is just copy and paste it if you put the title on it it'll be like this tile right there that'd be right above whatever the item is okay and then for your footer which would be these down here yeah footer 1 2 3 and then up here is number 4 and it's the same thing you just open it up and you'll choose from over here you know any of these that that you want there and you just basically just grab it and pull it down and you drop it right where you want it so it's very easy to set up you just have to actually spend some time and find the widgets that you want to display on your website and make it look good in uniform but those are it's it's really easy to get set up so I wanted to show you that really quick in case that's something that you wanted to put on your website if you have any questions just let me know all right that pretty much sums up creating a WordPress website using the avada 5.0 theme now I do want to thank you for taking this class if you have any questions because I know you'll probably have a ton for me definitely leave a comment shout to me I'm always willing to help there are so many different options for a vada 5.0 that there it would be impossible to talk about every single one of them but I think you should have a basic understanding of how to set up a page how to work your blog you know how the different elements work including the fusion slider now if you do have more questions or you'd like to take more classes of mine I do have a few include including the complete SEO course which has you know over two thousand students also check out my how to build a website course for the avada 4.0 now 4.0 it does have a lot of similar options to it and I actually go over a lot of SEO tips as well so take a look at that course I think it'll really help you out it's been a pleasure teaching you if you have any questions as I mentioned reach out to me otherwise I hope you're having an incredible day

Channel: Avadaphile

Views: 40,097

Keywords: Wordpress website, how to make a website, website tutorials, avada theme, beginners

Id: ejqP4Fb4mfs

Length: 76min 30sec (4590 seconds)

Published: Thu May 30 2019