How To Build An Affiliate Marketing Website 2024 (COMPLETE GUIDE)

0:00 so this might be the most valuable video I've ever uploaded on YouTube I've been doing affiliate marketing for about 5 years now and I've reached a stage where I'm making over $100,000 per month in profit consistently just from affiliate commissions so if you're wondering if it's still worth it to start affiliate marketing today then I can tell you 100% yes it is worth it if you're able to focus and if you're able to commit affiliate marketing is a long-term game you're not going to to see money rolling in overnight but if you're in it for the long term then I believe that there's no better business model to start than affiliate marketing now I'm not selling a course on affiliate marketing the reason I'm able to make six figures a month in affiliate commissions is

0:45 because I dedicate 100% of my time and focus to affiliate marketing so I don't have time to also be selling courses but here's the good news for you you're going to get everything you need all the information and instructions you need completely for free in this video first I'm going to show you how to build your own affiliate marketing website using WordPress and Elementor which is the best and most popular way to build websites we're going to start from complete scratch and I'm going to take you through step by step Click by click how to build a simple but effective affiliate marketing website we will only be using free tools to build and run this website so the only thing you have to pay for is hosting and I'm going to show you how to get hosting for less than three per month and in the second

1:31 part of this video I'm going to reveal to you my personal affiliate marketing strategy that has allowed me to scale to over $100,000 per month this includes how to find the best and most profitable keywords and how to craft optimized blog posts that actually rank on Google and don't worry if you don't actually like writing blog posts nowadays we have amazing tools like chat GPT that can do most of the writing for you I'll show you exactly how to use chat GPT to create create unique and high quality blog posts that are also optimized for the keywords that you're targeting I'll even give you the exact prompts that I use to get the most out of chat GPT so if you are really serious about starting your own affiliate marketing website that makes you money the best thing you

2:17 can do is watch and follow along with this video my name is Simon and I'm very excited about what I'm about to show you let's get started all right so we're going to be using Wordpress to build our website on WordPress is by far the most popular way to build websites and especially for an affiliate marketing website WordPress is the best option because it will give us access to the best SEO tools which help us to optimize our content so we have the highest chance of ranking on the first page of Google for our targeted keywords and at the end of the day this is what makes us money with our affiliate marketing website the other cool thing about WordPress is that it's

3:03 completely free to use the only thing we need to pay for is hosting so hosting is basically renting some space on a server that runs 24/7 so we can have all of our website content stored on that server so that our website visitors can access our website at any time and we're going to be using hostinger as our hosting provider now the reason I recommend hostinger compared to other hosting providers is just because I had the best experience using them compared to other providers I've used in the past hostinger is very reliable it's very fast and it's also very easy to use which is great for beginners and at the same time it is one of the most affordable options you can actually run your website for as low as $2 per month

3:48 which is incredibly cheap personally I recommend to go with the WordPress starter option here because this will give you some additional features like unlimited bandwidth or a free domain the domain is basically the name of your website so this will come down to $3 per month which is still incredibly cheap now to get access to the best prices for hostinger you want to use the first link Down Below in the description this will take you to this site here this is my special uh landing page for my audience as you can see here it says special deals for medic media audience and basically they gave me a better deal for you guys because I've been working with them for some time I'm also going to show you how to actually decrease the prices you can see here and by an

4:35 additional 10% by using my discount code so make sure you use the first link Down Below in the description and then once you're on this page here you want to just scroll down and you want to click on select here for the WordPress starter option and this will take us to the next page where we're going to have to decide on how many months in advance we want to pay for our hosting so the longer pay in advance the cheaper it's going to be as you can see here the 48 months option this is the cheapest option this way we get four years of Hosting for only $2.99 per month and the plan renews after four years for $6.99 per month so this definitely the cheapest option then we have the 24 months option this way we get 2 years for $299 and then it's going

5:21 to renew at $7.99 per month then here we have the 12 months option it's going to be $299 for one year and then it's going to Renew at $88.99 per month then there's also the monthly payment option which I wouldn't recommend because this way it's just going to be much more expensive um after two months you're already paid more compared to this option here because here you also get a free domain which is already worth like $10 so I would highly recommend to go with the 48 months option pay a bit more up front but then in the long run it's going to be much cheaper now for this video I'm just going to choose the 12 months option because I'm just going going to build an example site to show you how it's done but I'm not going to really use this site um for myself so this way I only have to pay 3588 to

6:09 create this video so once you've chosen your plan just click on continue then here we're going to have to create our account so choose your country here and then you can either sign up using Facebook Google or you can also just use an email address I'm going to use one of my email addresses here that I've created for this video and then click on continue and this will take us to the payment options now before you choose your payment option and type in all the information you want to make sure to click on have a coupon code and then you want to type in medic media this is my personal coupon code when you click apply it's going to deduct an additional 10% off the price so you can make sure to actually have the cheapest price possible to get your hosting once that's

6:54 done just choose one of the payment options here I'm personally going to go with credit card type in your in inform here and then click on submit secure payment and by the way hostinger has a 30-day money back guarantee so if for any reason you want to cancel your plan you can just message hosting or tell them you want to cancel your plan if it's within the 30-day period they're just going to give you a refund no questions asked so just keep that in mind so then here just type in your password and click on confirm so now we are in our hosting or dashboard the first thing we want to do is confirm our email address that we have used to sign up so let's go to your inbox of the email you have used and then look for the email saying verify your email address then click on the email and then

7:39 just click on verify email here and this will take you back to hostinger now the next step is going to be choosing our domain name this is going to be the name of your website so for example the name of Apple's website is just apple.com the name of Facebook's website is facebook.com and now for our website that we building we also want to choose our domain name which is unique which people can type into the URL box and then they will get to our website and now on hosting or here because we have chosen a plan that includes a free domain we can just simply click on claim domain here and then we can look for a domain that isn't taken yet so first of all we want to choose the extension here

8:24 at the end so this could be a com it could be AET a Co or whatever you want now personally I would recommend to go with a doom because it's basically the best one to choose it's the most legit it's what people are used to so if you can go with a doc and then you want to type in the name of your website now you want to spend some time thinking about the name because it's not something you can easily change you once you have decided on a name so if you don't really don't know what you should name your website and the easiest thing you could do is just name it by your own own name so it could be something like um Sams smith.com if that would be available and um for this website I'm building in this video I'm going to just use the domain

9:11 medic reviews.com because it's going to be an affiliate marketing website filled with mainly reviews of specific products where uh I'm an affiliate of so um once you type in the name here just click on check availability and then you can see either the domain is taken or you can actually get it so in this casee the domain is still available so we can just click on claim domain and then to register this new domain we're going to have to fill in some contact information so just follow the prompts here and fill in all the information then let's click on continue and then don't worry about what you can see here just click on skip I don't need a website and then we get to this page here where we need to verify our email address that is

9:56 associated with our new domain as you can see here email verification status so what you want to do is go to your email inbox the same email you've used to sign up for hostinger and then you should get an email looking like this request for email address validation click on it and then you want to click on the link where it says please click on the following link to confirm you have received this email and validate your email address just click on this link here I'm not a robot verify and then once you see something like this you can just close the tab or the window and go back to hostinger reload the window here reload the page and then you should be able to see the email reification status is now verified great so now that we have set up our hosting

10:43 and also our domain name it's time to install WordPress so in the top menu let's click on home and then under setup WordPress starter let's click on setup then click on start now and then we're going to skip all these questions by just clicking on skip I don't want personalized experience so now we also need to create an account for WordPress and I would recommend to just use the same email you've used for your hostinger account and by default they already put it in here so all we need to do is just type in a password and then click on continue then here we don't want to install any of these plugins so we're just going to click on skip I will manage plugins later we also don't need a template yet so let's click on skip I

11:30 don't need a template and then we're going to have to choose the domain of our website this is going to be the domain we have chosen before so here you can see it's already selected for us medic reviews.com so I'm just going to click on select here and then here we can also select the location of our server this is the place where all of our website files will be stored and the closer the server is to the person visiting your website the faster your website will load so if you know that most of your visitors are going to be coming from Europe then you want to choose a server location here in Europe but if you know that most of people will be in the United States and then just choose United States also if you're going to have a international audience don't worry just go with the default

12:17 location it's going to be fine and click on finish setup and then once WordPress has been successfully installed we can go to our WordPress dashboard by clicking on edit website so now we are inside of the WordPress dashboard which is basically the back end of your website here is where you can control every part of your website and throughout the video you're going to get familiar with how to use WordPress so don't worry if everything looks kind of overwhelming now we're also going to clean up this whole dashboard here because there's a lot of things we don't need so we're going to delete them in a second but first let me quickly show you how you can easily access your WordPress dashboard at any time because that's already something many beginners get confused about they don't know how to

13:02 get to their WordPress dashboard and you're going to be going here a lot especially when you start building your website so the easiest way to get to this dashboard is to just open up your browser go to the URL box and type in your domain so for me for me this would be medic reviews.com and then uh type in/ wpen admin and then hit enter so WP hyphen admin stands for WordPress admin hit enter enter and this will take you to your WordPress dashboard sometimes it will take you to a login screen where you can log in using your WordPress login credentials that we have set up before so this is the quickest way what you could also do is just to go through your hostinger dashboard so when you log into hostinger just go to websites which

13:49 is a new tab that will be created for you once you have a website and then just click on edit website here and this will also take you to your WordPress website what I could also recommend is to just add this URL as a bookmark to your browser so whenever you want to access your dashboard you can just click on that bookmark and then it will open up your dashboard now the next thing we're going to do is we're going to look at some basic settings here on WordPress that we need to change before we start building and we're also going to delete a lot of things that come pre-installed with WordPress that we don't need such as different plugins different themes and stuff like that that make everything kind of cluttered and makes it a lot harder to kind of navigate through your dashboard so you're going to see that

14:35 everything is going to look a lot easier and cleaner once we are done with that step so we're going to start here on the dashboard so just click on dashboard here on the top left and then you want to click on screen options here on the top right and make sure all of these options here are unticked which will just get rid of all of these windows that we just don't need as you can see it looks a lot cleaner here now later on you can just add any dashboard boxes but that's not something we have to worry about right now right now we just want to have everything clean now let's move on to posts later on in the video I'm going to explain exactly what the difference is between posts and pages but for now we're just going to delete everything here so we have an example post let's just tick it here make sure

15:20 it's selected then go to bulk actions move to bin apply and then to really delete it permanently you want to go to bin and then you want to click on empty bin right here and now we have zero posts now we want to go to we can also go to Media this is basically where all of your files and images will be stored currently we don't have anything in here which is fine so we don't need to do anything let's go to Pages now there is two sample pages so a privacy policy and a sample page we want to get rid of both so let's just take both of them go to bulk actions move to bin apply and then we want to empty the bin so let's click on bin and empty bin and now we got rid of these Pages as well then uh on the

16:06 comments we don't have any comments we don't need to do anything here um we don't need to do anything here then we want to go under appearance and click on themes so as you can see there's already three themes that are pre-installed with our WordPress account we want to just delete all of them basically so let's click on this one first click on delete okay the second one delete okay and then for the third one we can't delete this one yet because we always have to have one theme installed so we're going to leave this for now and later on when once we install the theme that we're going to use we're going to also delete this one here then let's go to plugins and then as you can see here there are already some plugins that come pre-installed with your WordPress dashboard most of them we don't need so whenever you don't need a plugin you

16:52 just want to get rid of it because having more plugins will just um lower the speed of your website which is bad so if you don't need a plugin just delete it so we're just going to take all of the ones that we don't need so we don't need this this we don't need the hostinger one we do need the light speed cache plugin so we're just going to keep this one but we're actually going to deactivate it for now so let's just click on deactivate and let's just tick those again and also the wp forms so also need we also going to need this one um so we're just going to leave it here and then we're going to go to bug actions first of all the activate them click on apply and once they already activated select them again and then go to bul actions delete apply okay and now we are

17:39 just left with the light speed cache plugin and the wp forms light plugin next let's go to settings and general then here we can change our site title from just our domain to an actual title so we're just going to name this one medic reviews obviously you want to change it to to your own website name and then we could also change the date format time format here but the default settings are fine in my opinion so I'm just going to click on Save changes and then we also want to go to peral Links here under settings and then here we need to change the permalink structure which is basically the default way our URLs will be created for our blog posts so for example this is a blog post on an

18:25 example site and here at the top you can see the URL this is kind of what we want it just should be the domain of our website and then for Slash and then the blog post keyword or the blog post name now by default WordPress sets it to this link type which is really ugly so what we need to do to change this is just click on post name so it basically adds the post name here to the end but if we just use post name we have this forward slash here at the end we want to get rid of this so we're going to go back to custom structure and then we're going to delete the last um character here the for slash like this and then we're going to click on Save changes and from now on we have we will have pretty URLs for our

19:10 blog posts on the website then what I would also recommend is to disable the comment section on your website so usually when you go to an article of a website and you scroll all the way down sometimes you have the ability to comment something here um under the post but when you're starting a new website most of the comments or pretty much all of them will just be spam comments and you don't want to spend any time dealing with those comments I would recommend is just to turn off the comment feature completely by going to settings and then clicking on discussion and then here you want to untick this option allow people to submit comments on your post just untick this option and then click on Save changes here at the bottom and now all of your new blog posts won't have the comment section now you can always

19:57 turn on comment on any post that you have so don't worry you're not giving up any options here for the future but believe me it's kind of a lot less annoying when you turn off this feature in the beginning great so now that we have cleaned up our WordPress dashboard and we have gone through the most important settings we can start building our website now whenever you want to see how your website currently looks like you can just come over here to the top left where you can see your website name then right click on visit site open in a new tab and then in this new tab you can see how your website currently looks like it will basically just go to your domain so we can always check out how the website currently looks like obviously it looks very bad and we're going to change everything here and the first thing we're going to do is actually install a new theme which is

20:44 going to give us the basic structure of our website so let's close this tab and then to install a new theme let's go to appearance and then click on themes the currently active theme is the 2023 theme as you can see here this comes pre-installed with a new WordPress account so what we want to do is just add a new theme so we're going to click on add new on the top left and this will take us to the theme Library where you can see there are over 5,000 themes you could choose from and the theme that we want to install for the kind of website we want to build is this one here the ocean WP theme so if you don't see it you can just type in Ocean WP here in the search box and then you can see it will come up this is one of the best

21:30 themes you can use for creating a blogging website which is basically the same thing as an affiliate marketing website so just click on install right here and then once it's installed click on activate and now you can see we have two different themes the ocean WP which we have just installed and the old one which we can now delete so let's click on the old theme click on delete on the bottom right confirm and now we're just left with this theme we want to actually use now you also want to make sure to click on enable auto updates so click here and that's everything we need to do now the next thing we're going to do is we're going to add a few plugins that will make building our website a lot easier so let's go to plugins here on

22:16 the left side and then you can see we already have two plugins that came pre-installed with our WordPress account these are the ones that we didn't delete before so plugins are essentially an extension to your website that give you a additional features like for example you could add a plugin that gives you the ability to add a chat function on your website or that gives you some more design options and that's one of the great things about using Wordpress is that pretty much anybody could code a plugin for WordPress websites so that gives you virtually Endless Options of what you can do with your website just by applying or by just by installing the right plugin now a lot of plugins are free and for this video we're only going to use free plugins but there's also some paid plugins as well now to add a

23:01 new plugin we're going to just click on add new on the top left and then the first plugin we're going to install is called Elementor so let's type in Elementor here in the search bar and then it's going to be this plugin right here this is like a visual page builder that allows us to use drag and drop when creating our website which makes everything very very easy and this is also the most popular page builder for WordPress so let's click on install now and then the next plugin we're going to install is called ocean extra this is like an extension for our um theme that we have installed before that gives us a few more design options so let's click on install now here then let's go back and click on plugins and now the first

23:46 thing we want to do is we want to enable auto updates for all of our plugins so that we don't have to manually come into our WordPress dashboard pretty much every day and manually update these plugins so on the the right side you can see enable auto updates you would just want to click on each of these links here so that we have enabled auto updates for all of our plugins if you don't see this option you want to go to screen options here and then you want to tick this option automatic updates and click apply and then you should be able to see the this uh this button right here and then with plugins you can basically have them deactivated or activated once you have them installed and you can always notice if they are activated by looking at the background of the plugin so here we can see it's

24:33 this light blue background and we can also see a button that says deactivate this means that this plugin is currently activated and all the other ones that have a white background they are not activated now to activate the plugins we could simply click on activate right here or we could also select multiple ones like I'm going to select the ones we have just installed and then go to bulk actions activate and then click click on apply then just simply close these windows here that show up just to make things look cleaner again so these are all the plugins that we need for now throughout the video we're going to install a few more plugins to build our website but we're going to install them as we go so that you understand the exact purpose of each plugin that we're

25:18 going to use now before we move on building our website I want to give you a quick overview of the website structure so that you understand exactly what we're actually doing so in affiliate marketing site has two main Pages it has the homepage and then it has the blog page with all of the blog posts and then usually there's also an about page where you can talk about the website or the business and then you can also have a contact page where people can just fill in a form and contact you sometimes there's also other Pages like for example different categories that you could add also to the navigation menu but these are basically just a specific summary of some of the blog posts that get into that belong to this specific category now you could also add a resources page or different things and

26:03 I'm going to show you how to do that but um we're just going to build the basic structure which is everything you need to make money with your affiliate marketing website because the money is actually here in the blog posts so I'm going to go to the next slide here where it kind of Illustrated how the website works and how you actually make money with this website so as you probably know blog posts are just informational posts where people can read them and then they get some information that they were looking for so what we want to do with our affiliate marketing website is we want to create blog posts about topics that actually lead to a customer buying something so for example when somebody types in best email marketing tools they're looking for an overview of the best email marketing tools so then we're going to write a blog post a

26:49 Roundup of let's say the seven best email marketing tools and then for each tool we're going to sign up for the affiliate program of that specific tool and then we're going to add our affiliate link to the blog post and when somebody clicks on that link We may receive a commission so that's basically how we make money and that's how we want to structure our page all these Pages here they're actually not that important they're just going to give our our website a structure but most people won't even see these Pages here most people will just see the blog posts because these are the pages that come up when people type in the keywords that we're going to create our blog posts for four so 99% of traffic will just go to these posts here and then sometimes people will also check out the homepage the about page or the contact page so

27:36 this is the homepage that I'm going to show you how to build very easy very simple very clean there's going to be a logo at the top here in the header then here you can see different links so there's the blog page we talked about the about page and the contact page and then here there's just a email newsletter signup section which is also a great way to get some additional Commission by creating a newsletter and then putting some affiliate links in those so that's something you want to do then we uh below the hero section of the homepage we're going to have the Articles so we're going to feature a couple of Articles here on the homepage and then that's it for the homepage so we're going to keep things very simple because you want to focus on creating blog posts and not really on creating the most beautiful website um so that's

28:22 why we're going to create something very simple very easy but very effective then we also have the blog page where you can see an overview of all of the blog posts with the different categories and then there's also a sidebar here where you can talk about yourself or the business another newsletter signup section some social media links and then the recent posts here when people Click on each of these posts they will obviously go to the blog post where this is just a dummy post here and then at the bottom you can see um suggested posts that are related to this post here and then again the same sidebar as on the blog page then we have a simple about page right here where you can talk about yourself and then the contact page just a simple

29:08 contact signup page where people can get in contact with you and then obviously there's also the footer of the website with the privacy policy and the terms of service and I'm going to give you templates for both of those as well now to make it absolutely clear what the difference is between a page and a post so for this website right here you can see these are all posts and when we go to blog to the blog page here are all the blog posts this is the content of your website this is the thing that will rank in Google and should get people to our website so to show you how this looks like in WordPress I'm going to go to the example side and go to pages right here so here you can see these are

29:53 all pages the homepage the about page Blog Page contact page privacy policy and terms of service these are all of the the pages right here blog about contact and so on and then these right here like I said these are posts and you can find them right here under posts and then these are the six posts the dummy posts that I'm going to show you how to import and when we click on them we can see that this is just basically text so this is text this could also have images or buttons and then what will happen when you add a new post then when you click on that post here then it would automatically be structured just like this and we can also customize how the structure will be and this is the difference between a page and a post what we're going to do is we're going to

30:39 first um create all of these Pages which is going to give our website the structure and then after this is done you're basically finished building your website and you just have to focus on creating these text image posts so this is going to be the work of building an affiliate marketing website just creating content adding it to the to the posts right here in the dashboard here under posts and it will show up on your website so the first page that we're going to build is going to be the homepage which again looks just like this we have this zero section here a newsletter signup section then we have the popular articles so these could be the latest articles or popular ones that you want to feature on your homepage and in order for us to see how this will

31:26 eventually look like we do already need to have a couple of blog posts on our page this is where I'm going to give you these sample posts these placeholder content posts and then we can see exactly what we're actually building how it will look like once you do have some of your own content so to save you some time I've already created these dummy blog posts that you can simply import to your WordPress website and I've created a Google Drives folder for this video you can basically access it by using the link in the description it's going to say something like Google Drive and then you should get to this drive folder here and once you're here you want to click on website content and then you want to click on dummy blog posts and then you want to download the dummy blog post. XML file so right click and download

32:14 download anyway and then just save this somewhere on your computer and then we're going to go back to the dashboard and we're going to go to tools and then click on import then we're going to go to Wordpress and click on install all now and then let's click on run importer and now we're going to drag and drop the file here into this window or you could just click on choose file and then find it there I'm just going to Simply drag and drop this file just right here and then click on upload file and import then here you want to select you yourself as an author so your account here and then also take download and import file attachments and click on submit and then all done so now we can go to to posts and now as you can see

33:00 these dummy blog posts are imported and now we also want to add some images to these posts because when you go to the example website you can see each of these posts has a featured image which is also visible here on the homepage right here so to get these images you want to again go to the Google Drives folder go to the um dummy blog posts and then under blog post images you can double click here and then you can just um download all of these images when that's done you want to unzip the download file and then you want to come back to your WordPress dashboard and then open up each of these blog posts so I'm going to just hit um command or hold down command or control if you're using Windows and then click on each of these

33:47 blog posts so it opens it up in a new tab you could also just write click and then click open in new tab and then we have these six tabs open with each of the blog post posts now to add the featured images we're going to first uh close this down and then on the right side under the post menu we're going we're going to go to featured image and then we're going to click on featured image and here we can just import all of the files at the same time so I'm just going to drag and drop all of the images right here and then to add the first image to the first blog post I'm going to select the first one here and click on set featured image and then simply click on update and I'm going to going to do the same thing for the other blog post as well so again go to featured

34:32 image set featured image then choose the second one set featured image update then the third one again featured image set featured image choose the third one set featured image update and when that's done for all the six blog posts we can just close all of these tabs and now let's create our homepage so let's click on pages and then let's click on add new and then let's name this page home and then at the bottom we want to change some settings so under content layout we want to change this from default to 100% full width and then we also want to disable the paddings right here then you also want to go to title and then disable the title by clicking

35:18 here and then you want to click on publish again publish and now we can look at how this site currently looks like by right clicking on view page and and then opening this up in a new tab then we can open up this tab and we can see this is currently how the page looks like it's basically an empty page but when we look at the URL here at the top we can notice that it that it has a for slome at the end of the URL so when we delete this section of the URL and just hit enter and actually go to our domain which our homepage should show up for we can see another page actually shows up so what we need to do is we need to tell WordPress that we want to have the other page we've just created this one as the homepage so let's go back to the

36:04 dashboard by clicking on this um icon here at the top left and then you can see here under Pages we have the new page created the homepage and now what we need to do is go to settings and then click on reading and now we want to go to your homepage display and select a static page and then under homepage you want to select the page we've just created which we called home so we're going to select home here and then we're going to click on Save changes and now when we go back to our domain so to our website by clicking here we can see that this new page that we've created is now assigned as our homepage and you can also see this by going back to the dashboard and then you can see next to the homepage it says front page this

36:50 means that this is now assigned as the homepage so now to edit this page we're just going to click on it here and then we're going to click on edit with Elementor Elementor is the page builder that we have installed before so this is the visual page builder that we're going to use to design our website it's very easy to use you can just drag and drop in elements from the left side to your page and Visually build out your website we're going to start with the first section of the homepage which is this section here and we're going to start with uh this text here but the first thing that we notice is that we have two columns so one column here for the text and the email signup section and then one column for the image so that's what what we're going to do first so here

37:36 we're going to click on the plus sign and then we can see we have different options for the layout so we have a just one column two columns three columns and so on we're going to use the two columns layout and that way we can have two different spaces to add elements for now to add an element we're going to go to the nine dots right here on the top left and this will take us to all the different elements we can drag in the first thing we're going to drag in is a heading so let's just click and hold and then drag the heading into the First Column here just like this and then we can already like change the text so let's just see it says helping you choose the right marketing tools so we can just either um just write it right in here or we can also write it in here

38:22 so wherever you want works I'm just going to type it in here so helping you choose the right marketing tools obviously you can just type in whatever you want whatever kind of website you want to build the tagline is going to be a bit different now the next thing you notice is that the color of the text is actually blue which is the default color that comes with a new website and if you look here the color is actually like this very kind of uh like this almost black but it's a bit more gray as well so we want to change the color so what you could do is when you click on this element ment here you could go to style and then go to text color and then change the color right here but you don't want to change the color for each single element what we want to do is we

39:08 want to set up some Global colors uh basically are default colors for the entire website so that when we add new elements then we always have the same color that we want for our website and that also makes it easy to change the colors later on once the website is finished so to set up our default colors we want to go to the hamburger icon here on the top left and then go to side settings then go to Global colors here at the top and then here we can see the default colors that are currently active so we have this blue that we've seen here with the text which is the primary color then we have a secondary color a text color and then also an accent color and then we can also add some more colors here at the bottom so now we want to Define what kind of colors we want to

39:54 use for our website now for the example website that I'm going to build here in this video I've used this green here as an accent color and then for the text colors I've just used this very dark gray and then for the bottom I've also used some kind of dark gray as well as the background here so a very simple color setup which I'm going to recommend to you to use a simple one when you're starting out you can always change this later on uh for your website now the easiest way to set up your colors is by going to a site called coolers.com start the generator and then you can set up your colors here now I'm going to

40:40 Simply do three different colors so I'm going to click on the X twice so we only have three different colors and then what you can do is just hit uh a space the space bar on your keyboard and then it will just generate different color pellets that you could use for your website so if you like a specific color so for example we like this one we could just click on the lock icon and then this color will basically stay here and then if we hit the space bar again it will just change to other colors that will fit well with the first one we have chosen here so you can do this and just find out the colors you want um I've basically created my own pette for this website here which I'm also going to link Down Below in the description so if you want to use the same colors uh for

41:25 building the website and then later on you can still change them you can use this pette as well so this is going to be the accent color this is going to be the text color and then this we're going to use as a background color for some parts of the website I believe it's just the footer so I always have this open here so I can just click on the copy uh icon here and then it will copy this color code that I can simply paste into um my my default colors so first for the primary color I'm going to copy this code here so I'm going to click on copy here then I'm going to go back and I'm going to change this primary color I'm going to just paste that in here contrl V and as you can see now the color has changed I'm going to use the same color for the secondary color as well and also for the text color just to keep things

42:12 simple like you don't want to um do too many complex things when you're just starting out building a new website um especially if you're a beginner so then for the accent color we're going to um go back to our pallet then we're going to use this one here copy and we're going to paste that in here as well and then I'm also going to add a new color for a background color going to click on add color here then I'm going to name this one background number one and I'm going to copy this last color by clicking here going back and then choosing the color like this and that's everything we need to do so these are the colors I'm going to use I'm going to click on update here at the bottom to save this and you can also see that the

42:58 heading we've added before the color has now also changed to the default primary color we have set here now what we also want to do is Define our default fonts for the website so let's go back by hitting the back icon and then going to Global fonts and then here if you want to you can just keep the global fonts that are set up by default for all the primary secondary and so on um I personally going to change this so I'm going to click on the pen icon and then the default one for the primary is Roboto I'm going to change this to open sense so I'm going to choose this one here and then it changes as you can see here if you want to you can also choose Roboto or any other popular um fonts I would just make sure you use basic fonts

43:43 that are easily readable and not use like very fancy ones because people just don't like to read um text in fancy fonts it's kind of more difficult to read and what I'm going to do is I'm going to use the same font for all of the different text um types so I'm going to um use open sense here as well and then for the text as well open sense and then for the accent as well so most of it was a Roboto which again is also fine so you can use that if you want to but I want to make sure you you know how to change your font Styles so once that's done let's click again on update so now let's close the side settings and go back to our elements so now we want to change also the size of this text of

44:31 this heading here so we're going to select it by clicking on the pen icon and then we're going to go to style and then under typography we can change the size so we can just drag this to the right side I just want to have it on three lines kind of like this then we can also change the the weight to make it Bolder by maybe making this 700 a bit Bolder and then maybe we're going to change the size again a bit less like this and then we can also change the line height here so I'm going to just increase the line height just a slight bit Pro like this looks fine to me then let's click on update and now we're going to add the second text here we're going to add this section here the the

45:17 text saying that you should sign up to the newsletter so we're going to go back and then we're going to go to the nine dots here and we're going to drag in the text editor like this just under the heading and then we're going to just change the text so I'm just going to copy and paste it from this example site copy and then paste this in here and then it just takes the default colors again and the default fonts we've already set up so that's fine but we want to go to style and then again go to typography and then also change the size a little bit kind of probably like this and then you can also change the weight if you want to I'm going to leave it here as it is and the line height is fine as well so let's again click update next we're going to add the email signup section

46:04 that you can see here so let's go back then click on the nine dots and go to the elements and then let's scroll down all the way to where it says WordPress so click the drop- down arrow and then we want to look for MailChimp so here we go here is MailChimp we just want to uh click and drag this below the text then here we want to do some adjustments so we're going to first delete the title here then we're going to delete all of the text because I just want to have the email signup section and not any text above and we're also going to delete the accept gdpr term section and then we're going to change the text for the button I'm going to change this to join now and then I also want to have this a bit

46:51 closer to this text here at the top and to to to get this closer we're going to have to go to Advanced right here and then we're going to change the margin so with margin and padding you can basically control how close the elements are to each other so the gap between each of the elements now uh what's the difference between margin and padding now there's an overview here so just look at this image here and you can see this is the content and then this is the border of the content um for example here this is the content and then this this line here is the border of the content now when you increase margin it will add spacing outside of this border if you add padding it will CH it will

47:36 add spacing inside of the border so just keep that in mind now we're going to remove some margin here at the top of the email signup section so first we're going to unlink we're going to unlink these values here by clicking on the link icon and then I'm going to remove some spacing here at the top by clicking on the down arrow and as you can see by clicking it the spacing here at the top decreases so let's just let's do minus 25 or let's actually do minus 30 that's fine then we're going to click on apply and there we go and now we can notice that the color of this join now button is in blue instead of the accent color green that we have added before under Global colors so we actually want to change this to this green right here

48:23 that we've set up before and the reason it's still blue is because we also need to set up our default colors on the WordPress level and not just here on the Elementor level which is our page builder so we're going to do that now so let's first click on update to make sure we save the changes and then we want to go to our website so we're going to Simply copy the link here of our URL here at the top and then open new tab and just paste that in here hit enter and then you're going to just going to see how the website currently looks like how the homepage looks like and you can see this bar here at the top you can always see this bar when you're logged into WordPress for the side you're on right now so let's just click on customize here then let's go to General

49:11 options then General styling and then here you can see we can also set up our default colors on the WordPress level so let's go back to our color pellet and I'm going to copy this scen here by clicking on this icon going back here or actually actually here and then changing the primary color I'm just going to paste in the color code here all right and then I'm going to also set a hover primary color so usually I use the same color and then I just make this a bit lighter or darker now let's just make this a bit darker kind of like this that's fine and then we can also scroll down and go to the colors here so for the link colors I want to set this to

49:58 the black that I've set here the gray and then just paste in the color code here and do the same thing for the hover I'm going to also use this green so I'm going to again copy this and then change the hover color to Green as well and then click on publish and now we should be able to reload the page so let's maybe just delete all this at the end go back to our website hit enter and then we can see the button color has now changed to green and when we hover over it the color has changed to the hover color which is a bit darker a darker version of the same green so now we can go back to our Elementor Page Builder and let's also reload the page here to see if the color changed here as well

50:43 and there we go it's also green now now later in the video I'm also going to show you how to connect your website to the email marketing tool MailChimp so that whenever somebody types in their email address on your website it will go to your email list on MailChimp and you can send them out email sequences or newsletters and so on so for now we're going to leave it at that but later on we're also going to connect it so that this um signup section actually works now you don't need to collect any emails on your website so if you don't want to you can just right click here on the pen icon and then just delete this email marketing section so next we're going to create the second part of the hero section which is adding the image here now you don't need to have a person here

51:29 um you can also add another image but this is a very popular design so I'm going to show you how to do it like this and I'm also going to show you how to remove a background from an image because this image here of this guy I actually found it on a website called pexels I believe pexels.com this is a website where you can find free stock images that you can use copyright free on your website so for example you could just type in guy with uh laptop something like that and then uh different people come up and you can basically just use these images completely for free make sure when you download one of these images you go to um you download this version here large or even medium don't go with the original size because it's just too large and it will decrease the loading

52:16 speed of your website which is very bad so I would just go for the large image here another site you can use is unsplash um.com so this one here here you this basically the same side you can just also find stock images that are copyright free now if you want to just recreate the same side you can just go to the Google drive folder for this video which again you can find in the description below then go to website content and then go to Hero section and here you can see this was the original image that I've found and then I actually remove the background so it just was this guy so the tool that I've used to remove the background very easily is I've used canva.com and I'm going to leave the link to this down below in the description as well it's a very nice

53:02 design tool very easy to use so I've just uploaded the image of this guy here and then I would click on edit photo and then click on background remover here but as you can see this is a pro feature meaning you have to pay for canva I believe it's like 10 bucks a month to be able to access this feature I think there's also a free trial so you can just use the free trial then remove the background and then download the image and then you don't have to pay anything but um when you when you remove the background you want to click on share and then go to download and then make sure you take the transparent background option and then click on download and then you get this file basically um without the background now if you if you want to get another free tool there's also this website here remove.bg and

53:51 there you can also remove backgrounds so I'm going to show you quickly how this works so I'm I'm going to just drag in this image here and then it will automatically remove the background and you can download the image for free if you want to have it high quality then I believe you have to pay something as well but it's very little so that's basically how it works so let's go back to our website here and let's add the image so let's go to the nine dots here and then look at the elements and now we want to add an image so I'm going to drag in the image from the left side put it here and then to change the image I'm going to just click on choose image and then I'm going to drag in the image I

54:37 have um created so I'm going to just drag this in here once it's uploaded click on select and now before we do anything with this image let's just align both of these um columns here in the center so we're going to click on the section here we're going to select a section and then we're going to go to vertical a line and change it from default to middle and this way we have the both of the elements here in the center and now when we go back to the example page we can see that there's like a gradient in this hero section going from the bottom all the way to the top so it starts here at a light gray color and then goes all the way to the top to a white color so we want to add that as well so we're going to go back and then we're going to again highlight

55:23 this section or select the section and then we're going to go go to style and then click on this gradient icon here once we click on it we can SE select the gradient colors so for the first color we're going to select a a wide so a complete wide with the code um 6 fs and then the second color we're going to change this to a light gray so we're going to do something like this that looks fine and now we want to also have this this guy come up right at the border of this section just the same way as we can see here so to do that we're going to select the image and then go to Advanced and then keep the values here for margin linked and then just remove

56:10 or go down with the value by clicking on the arrow and then by clicking on it you can see that the image gets larger and slowly gets to this border here as you can see so maybe one more maybe yeah just like this now if for some reason when you add the gradient the gradient stops here and doesn't go over the whole width of the page then you want to make sure to select the section and then you want to turn on stretch section here under layout so go to layout and then click on turn this on stretch section and then it should look just like what you can see here so now we're done with the first part of the homepage and we can move on to the second part which is this one here the popular articles section where we just feature a few blog

56:57 posts and in order for us to create this nice layout we need to install a plugin so let's go come back here and then let's go back to our WordPress dashboard by going to the icon here and then going to exit but before I actually click exit make sure you update your page so all the changes are saved and then click on exit and then you can simply click on the WordPress icon here and this will take us back to the WordPress dashboard so now let's go to plugins then click on add new and then the plugin we're going to use is uh the post grid so we're going to type that in the search bar and it's the first one that comes up so let's click on install now then activate and then we can just scroll down and click on Save changes and now let's go

57:42 back to plugins and look for our plugin which is this one here it's already activated but we also want to enable auto updates so let's click on enable auto updates here and actually let's also enable it for this plugin here the WordPress in importer which we have used to import our dummy blog posts so now that we have the plugin installed we can go back to our homepage by going to pages and now as we have already used Elementor we can just go and click on edit with Elementor and this will take us back to our editor so now let's first create the new section by clicking on the plus icon here then this time it's just going to be a one column section so we're going to click here and now let's go go to our Elements by clicking on the

58:28 nine dots and now we want to use this um this element here which is the tpg grid layout because we have installed the plugin we can now see this element so we can now drag this inside of our section and now we can already see that our posts basically show up here now we want to go into some of the settings so here for the layout we're going to keep the layout one then we're going to click on settings and for field selection we're going to deselect a few things so let's deselect the section title and also the metadata then let's open up this exerpt content menu and decrease the number of characters that should be shown as the preview text here to let's say 170

59:15 should be enough and then we also want to click on the read more button and I'm going to change for the button style from the default style to only text button and then read more is fine and I also want to have an icon so I'm going to uh activate the icon here and I'm going to choose an icon by clicking here and then I want to have something like an arrow so let's maybe choose this Arrow here click on insert and this will insert this Arrow here then let's go to the style settings by clicking here and then let's click on the read more uh section here and change the text text color so I want to have this in my accent color which is green so under text color I can just click on this

1:00:02 globe icon and then all of my Global colors will show up and I'm just going to choose the accent color we have already set up and then as you can see it will change to this screen now we can also go to post title here and this is about the title and as you can see when we hover over the title it's actually blue and we want to change this to our accent color so under post title let's switch from normal to hover and then here we can Define the hover color so I'm going to just going to click on the globe icon again and choose my accent color and then we can see when we hover over the title it changes to Green next let's click on card and then we're going to add a radius for the Post like the

1:00:48 blog post cards here is entire thing so we're going to just go to cardboard radius leave these values linked and then we can just click on the up arrow and then change this to let's say 20 and this will add these rounded Corners which looks a lot better and then we also want to add a box Shadow just like you can see here and we can do that by just clicking on this pen icon next to the Box Shadow and that's everything we need to do you can also change the values of the Shadow here but I think it already looks pretty good so that's how I'm going to keep it then we might also want to change the text size of the title and also of the um preview text so let's scroll up and first go to the Post title then we can look for typography

1:01:35 right here click on the pen icon and then here we can change the size so we can make it bigger or smaller I think I'm going to make it a bit larger I think this looks pretty good and then I'm also going to go to the exerpt and then go to typography and also adjust the size here I want to have this a bit larger this is too much so I think maybe like this actually let me go back to the post title and decrease the text size just a little bit maybe we do 22 okay now I think that looks great so to save this just click on update and now the only thing that's missing is the title for this section just something like this like popular articles or recent

1:02:22 blog posts something like that so let's go back here click on the elements icon and then drag in a heading just above our blog post section then we're going to change the text here to let's say popular um articles and then we're going to change the size so we're going to go to style go to typography and then first of all change the size to something a bit bigger 36 is fine and then maybe also change the wage to let's say 700 to make this a bit Bolder and then let's also also add a bit of padding or bit of margin here to the bottom of this text of this heading so let's go to Advanced and then unlink the margin values and

…