How to Start Domain & Hosting Website & Business in WordPress & WHMCS - White Label Reseller Hosting

hello friends amnesia you can train this real show you step by step how to start your own domain and web hosting business using wordpress and whmcs the best thing about this website or this business is that you don't have to do anything manually we'll be using a free software that will help us to automate the entire process of web and domain hosting and it will also help us to automate billing sending invoices collecting payments taxes reminders and more thus saving us valuable time and money now as you can see on your screen this is the exact same website that we will be creating in this video now as you can see over here if a customer wants to register a new domain name they can simply type in that domain name over here and after that they can click on search now if this domain name is available it will simply show this purchase button now the customer can simply click on this purchase button and they can purchase this domain and obviously if it is not available it will give them this message that this domain name is not available so as you can see over here this thing is working now if you scroll down we have some more sections so here as you can see in the next section you can create different types of hosting or you can sell different types of postings in this example as you can see we are selling shadow string cloud hosting and wordpress hosting or obviously if you want you can sell only one single type of hosting then when you scroll down you will see that this hosting platform that you're using this provides ssd persistent storage and ultra fast network now let me first explain you this entire process here we are not actually purchasing or starting or even setting up our own databases or servers or anything we'll simply be purchasing high quality hosting services at a very small price from big hosting businesses and we'll add our margin on that and we'll resell it under our own brand name so this is completely white label we'll be using our brand name in every single place now if you scroll down here your customers can see all the different features that you provide on your website so they can get free ssl certificate in some more features which is all available in cpanel the customer can click on advanced features they can see some advanced features over here and we can also send some extra add-ons like we can sell domain privacy site log and spam protection these are extra add-ons that you can sell on your website so we are selling domains we are also selling uh hostings and with this you can also sell these domain names to increase your income now when you scroll down you can see that we have created three different plans over here startup drive and turbo now obviously if you want you can create four or five different plans it all depends on you and here i'm providing all these features with these these different plans obviously if you want to improve these features or if you want to increase or decrease some web space or anything like that you can do everything is super easy i'll explain you everything step by step so just don't worry here we have created two different tabs this is your monthly tab if you click on a yearly tab you will see the price will change so monthly if a person is trying to purchase monthly plan they will have to pay 8.99 for startup plan 14.99 for drive plan and so on and if the customer is ready to pay yearly they can click on this tab and now they have to pay only 5.99 for startup and 898.99 for drive so they're getting some discount so i'll show you how this entire process works how you can create different plans and how you can allocate all these resources to different plans now when you scroll down at the bottom you can see some more features you can tell the customer where all your data centers are located obviously it is not your data centers these are the data centers from the hosting uh from of the hosting that we'll be purchasing and obviously at the bottom you'll see your footer now let me do one thing let me first very quickly show you a process how this entire thing works now if a customer comes to your website if they want to purchase this drive plan they can simply select this plan and click on this select button now they will be redirected to this page here if your customer wants they can register a new domain name and they can also select some different domain name extensions which are available over here so in this video i'll show you how you can create different domain name extensions and how you can sell them on your website so as you can see i'm selling six different domain name extensions if you want you can sell 60 or 100 different domain name extensions if you want it all depends on you now if a person for example if a customer wants to purchase this domain name xyz or any single for example this domain name they can simply type in this domain name and click on check if this domain name is available they will get this message that this domain name is available and they will get this price so this is the price that they have to pay obviously if you want you can set different prices for different domain name extensions now there are some more options available over here for example if your customer wants to transfer their domain name on your website they can do that as well or if they already have a domain name they can also use an existing domain name with this website for example i have a domain name for him dot in so i can type in this domain name and click on use now once they click on that thing they will automatically be redirected to the next step here the customer can see the plan name that they have selected so they have selected the drive plan and they can see all the different options that they will be getting with this plan now if a customer wants they can go with monthly or they can go with annual plan if obviously they will select the monthly plan they will have to pay extra that is 14.99 and if they go with annually they will have to pay way less that is just one seven one zero seven dot eight eight dollars per year and as you can see as soon as you select any other option the price is updated automatically now as i said earlier we can also sell some add-ons so here as you can see we are also selling these add-ons now let me give you an example for example if a customer is purchasing 5gb plan it will cost them 350 dollars per month but it will cost you only few dollars for example only few cents or maybe just one dollar for you and you can charge some extra money on that and obviously if you want you can also change these prices if you want now if you scroll down there are some more add-ons available now if this customer wants they can click on continue now on this step they can see all the different options they have selected they have selected this drive plan they have also added this 5gb personal data and they are using the sitelock free version again again and again we will re recommend them some more add-ons so that we can make some more money you can also create some promo codes to give some discount to your customer now if this customer is satisfied with this and if they want to do the checkout they can click on this checkout button and obviously they will be finally redirected to the checkout page and here if they want they can now pay with paypal stripe or any other payment gateway you want there are more than i guess 50 60 payment gateways available so whatever payment gateway you want to use credit card debit card cc avenue paypal paytm so many different payment gateways are available you can integrate all those payment gateways over here and obviously whenever someone clicks on this complete order this order will be placed and your customer will get this cpanel and everything but all the other things we'll see later on in this video so this is how this entire process works now let me very quickly show you the design of the website because the design is also really good as you can see this is your first section and we have seen some other sections but when i scroll down you can see these beautiful animations and all these different images and icons that that we have used now all these images and icons are actually very free this these are actually absolutely free you can create your own images and icons like this and you can change the color structure for example i'm using this color as my primary color obviously if you want to use red blues green any other color you can do that as well and creating these are super easy you don't need photoshop or coreldraw to create these kind of images i'm also giving these images for free but you can create your own images i'll show you how to how that is done later on in this video now in this video we'll also see how to create different mega menus so here as you can see when someone hovers over these pages or elements they can see that this is a mega menu and we'll also see how to create different pages for example if you want you can create different pages for different types of hosting if you click on shadow string button if you click on learn more or if you go to this page shadow string page you can see that this is how this page looks like okay so here as you can see we have provided the same option over here here also if a customer clicks on this button they will be redirected to the next step and you can give all the features that you're offering like domain resources protection scalability sss certificate all those different options you can also add some testimonials over here all these options are all available over here we have some more pages for example we have a dedicated page for domains so if a customer wants to register only domain on our website on and not any other hosting or anything they can do that thing as well so they can come over here and they can register that domain name so we can also make some money from only from domain names as well we'll also see how to create some other pages like your about page contact page support page all the other pages so as you can see this is one example this is how your about page looks like obviously these things are not compulsory but i have included everything i have tried to make it a complete solution whatever you like it you can keep it or whatever you don't like it you can just reject that thing okay so this was a very short demo of the exact same website that we'll be creating in this video i hope you guys like the demo website if you like the demo website and if you want to create the exact same website make sure you watch the complete tutorial and throughout the video if you have any doubts any comments any suggestions for me you can always leave them in the comments section below if you find this video helpful and if you want to watch more videos more useful and resourceful videos like this one make sure to subscribe to the channel and click on the bell icon if you find this video helpful give a thumbs up to this video and share it with your friends on facebook twitter whatsapp whatever social media platform you use i guess now let's start creating this website i guess now to create this website we need two basic things a domain name and a hosting account a domain name is simply the name or the url of your website for example as you can see in this case famhosting.com this is the domain name of this website some other examples can be google.com youtube.com so this is basically what a domain name is so your customers will use this domain name they will enter this domain name in the url bar to land on your website now the second and the most important thing is your hosting account now for this website we don't need any regular shared hosting or cloud hosting we need a reseller hosting obviously because we are going to resell domains and resell domains and hosting services to our customers now to get this reseller hosting account you have to open a new tab and type in blogtoot.com a2 now this link is also given in the video description below so you don't have to type in this thing simply click on that link and you should be redirected to this page now you will be redirected to this shared hosting page as you can see web hosting services we need reseller hosting so click on reseller which is given at top and select the first option reseller hosting now here as you can see there are four different plans kickstart launch grow and scale now for most of you guys i would recommend you to start with the launch plan don't start with the kickstart plan because here as you can see you're not getting this software for free you're not getting free whmcs you're getting only blaster whereas in launch grow and scale you're getting free whmcs so this will save you some money and with this launch plan you're getting 100 gb ssd storage 1000 gb or 1tb transfer bandwidth and some more free features 9 feature if you need more ssd storage or more bandwidth you can obviously anytime upgrade your plan to grow or scale plan and obviously if you need even more ssd storage and transfer then skill plan you can even get that thing as well and i think launch is the best plan to begin with so just select this plan and click on this get plan button or get launch button now here you have to register a new domain name so whatever domain name you want you can simply type in that domain name over here so for example if i want to register this domain name hosting.com i can select this thing and click on check if this thing is available it will say that this is available and you can now click on continue now when you scroll down you'll see that you have selected this launch reseller you'll see all your features and you will see your billing cycle by default 36 months is selected obviously i would not recommend you to go with that i would recommend you to select either 6 months or 12 months plan because you don't want to spend or you don't want to invest a lot of money very at the very beginning so you can start with the 12 months plan now when you scroll down make sure you don't tick mark anything from here or else you'll have to pay some extra money we just need this basic thing now once you select this option now click on continue again they will recommend you some extra add-ons make sure you don't tick mark anything from here just click on continue again now you'll see you have registered this domain name you're registering this domain name and with that you're also getting this launch reseller so you're purchasing these two plans now when you scroll down here you can see your total amount that you have to pay is this amount or if you have selected six months or one month or 12 months 24 months amount might differ okay so i've selected 12 months launch reseller and one domain registration so this is what is costing me now i can simply click on this checkout button to do the checkout obviously and over here just enter your personal information your first name last name email address phone number then after that enter your company name or you know this is optional you can just leave this thing just enter your address and if you have a vat number or gst number anything like that you can enter those details over here now just scroll down and here you have to select account security so if you're doing this for the first time you have to set a password for your account so next time whenever you want to log into your a2 hosting account you will have to enter this password to enter or to log into your account okay so you'll have to enter this email and this password to enter or to login to a a2 hosting account now you have to scroll down at the bottom and if you want to make payment through credit card debit card atm card you can select this option you can also make payment through paypal or bank transfer so whatever option you like you you can just tick mark this thing then after that tick mark this thing i want to i have read and agree to terms of services and click on complete order now once you click on this complete order you will automatically be logged into this page my.a2hosting.com this page here you have to click on this option manage your accounts click on secure client login and now you will be redirected to this page my.hosting.com clientaria.php here you have to enter the email address and password that you have entered in your previous step and after that click on login now this is your main client area here as you can see you will see your active product send services earlier for demo website i have purchased reseller or gold reseller and right now we have purchased this launch reseller so whatever you have purchased you will see this option now we have just purchased this option your hosting.com launch reseller so click on this option now here at the left hand side you will see login to cpanel and login to wm at whm first click on login to cpanel because right now what we want to do is we want to install wordpress on our website now in this tutorial we'll be using two different softwares we'll be using wordpress and we'll also be using whmcs and i have divided this tutorial into two main parts in the first part we'll be designing this website using wordpress and the second part of this video will be doing all the technical things like creating products or creating your hosting packages and all and that too using whmcs so this is your first part you can see all the timestamps in the video description below now first of all whenever you log in first make sure that the left hand side you have your primary domain name and besides that it says something like this that this certificate is installed which simply means that ssl certificate is successfully installed and activated on your domain name if you don't see uh anything like this not no certificate installed or anything like that i would recommend you to come come back after some time until ssl is successfully installed on your domain name this generally takes around one or two hours so if you have just registered new domain name this might take some time so you can just go take some rest come back once you have this certificate installed now once you come back and once you see that this certificate is installed you can now go back or you can just come over here search for subtaculus app installer and you will see this option soft tackle is app installer click on this option and here you will see wordpress so we'll be using this softaculous app installer to install different softwares now as you can see there are so many different softwares that you can use we will be using the same option later on in this video to use or to install another software for now we want to install wordpress now if you don't see wordpress over here you can again from the left hand side search option search for wordpress and here as you can see we get this option click on wordpress from the left hand side now click on install now now under install or choose protocol make sure https is selected so that ssl certificate is successfully installed on your website and you're creating a secure website now you have to choose your domain name so we have selected or we have registered this domain name hosting.com select this domain name now you can give your website some name so i'll name my website in a year hosting because this is my website name you can change these things later on as well i'll show you how you can do that and under site description i'll type in best wordpress hostings all right our best wordpress hosting in india all right so not hosting hosting in india so that best wordpress hosting in india i would recommend you to select a niche market okay then you have to choose a username and password for your website so i'll type in something like this make sure don't type in admin or username something like this on username type in some unique username for yourself and after that type in some password over here so let me do this thing okay you need a strong password as you can see you must have you know characters and numbers everything in your password now once you have entered your password after that you have to enter your admin email address over here you can do one thing you can just leave admin at near hosting.com or you can just enter your personal email address i would recommend you to just leave it at admin hosting.com because later on in this video we'll be creating different email accounts like admin at yourwebsitename.com billing at your website name.com these kind of email accounts so you can just leave it as it is now scroll down at the bottom and click on install now wordpress is getting installed on your domain name okay guys so i see some error over here this says that this installation path is not empty and it has some file called index.php so if you get some error like this it is really simple just go back to your control panel click on control panel and over here the first option you will see is this file manager if you don't see option just search for file manager click on this option now over here under file manager you have to click on public html and here as you can see you have this option index.php or you'll see this file index.php just delete this file okay once you delete this thing you can now come back to view trash and you can delete it even from trash so click on this and select empty trash all right now your now this file or now this folder is empty and now we can install wordpress on this folder so again come back to your dashboard again search for subtaculus app installer do the same process click on wordpress click on install now https your domain name then after that enter your site name site description your admin username password everything and after that click on install now wordpress has started installing on your you know domain name and this will take only few seconds as you can see now wordpress is successfully installed on this domain name now you'll get two links this is first link is your website link and second link is your dashboard link okay so as you can see this is how your website will look right now and this is your dashboard now this page your dashboard page is a very important page because from this page you will be controlling your website especially all the designing aspects you will be controlling from this page so whatever right now as you can see this is how your design looks like later on in this video we want to change the design of this website and we want to make it something similar and beautiful and professional like this one so you'll be doing that from this page from your dashboard page so make sure you remember this thing whenever you want to come back to your dashboard page you simply have to enter your website name uh in this case as you can see in airhosting.com and after that put a forward slash wp hyphen admin you will land on your dashboard now whenever we install wordpress on a new domain name there are few basic settings that we have to do and there are few basic things that we have to understand so let's first see them so first of all at the left hand side you'll see some option first option is your dashboard option and this is how your dashboard will look like second option is your post option using which you can create different posts different blog post third option is your media option so in this media option or in this media file you will see all the media files that you have installed for example here as you can see we have installer we are using this image this image all these images so whatever images or media files you you have installed or you have used on your website you can see all of those from here and you can manage them from here then after that you will see your pages option which obviously will be used to create different pages like your about page you know your services page contact page your hosting plans page all those pages then you see your appearance option now under appearance you'll see few themes are already installed for you and one theme will be already activated for you we want to do one thing we want to delete all these extra themes and later on in this video we'll be using some other theme obviously because the design looks really bad now what is the theme a theme is basically the design or the appearance of your website now because we are using this 2020 theme this is how your website looks like later on in this video we'll use some other theme that will change and that will convert your boring looking website into something amazing like this one so for now let it be as it is later on when we install a new theme we'll see the design change then from the left hand side click on plugins and here if you have any extra plugins like this just tick mark over here under bulk action just delete these plugins these are not really important and plugin is something like a software this plugin option will add some extra features and add-ons to your wordpress website now again come back to your dashboard now whenever you come back to your dashboard you will see all these extra widgets which are not really useful so we can do one thing click on screen option and we can untick all these options from here not really useful ones alright so as i said you just few moments ago that i have divided this website into two main parts in the first part we'll see how to design this website in the second part we'll see how to create different packages and all and how to connect your website with this website so right now what we are going to do is we are going to install a new theme and we are going to design our website like this one as you can see we are going to see all the designing aspects and obviously to do that thing we need a new theme because this design looks really bad we need a better design so to get that new design or to get that new theme you have to again open a new tab and type in blogtoot.com fox p-h-o-x and obviously this link is also given in the video description below so again you don't even have to type in this thing simply click on that link and you should be redirected to this page and this is one of the best themes available for whmcs websites you can see this has some really great documentation 24 7 support you can see all the different designs there are many different designs also available pre-made entire website so you can see some more features available you can just scroll down see all the different features that these guys provide so you have to purchase this theme and this will cost you only 49 now the reason i'm saying only 49 is because this is a one-time payment you pay 49 and you can keep and use this theme on your website for lifetime you never have to renew or upgrade or anything like that not only that even if this theme gets updated in future and right now as you can see seven demos are included with this theme so in future if more demos are included with this theme still you don't have to upgrade or pay anything extra you can get all those updates in future for absolutely free don't have to pay anything else with that you also get six months of support from this node from this theme developer so if you have any problem with yours with setting up your website you can contact them and these guys will help you out so you just have to click on add to cart or click on buy now and make sure you purchase this theme once you purchase this theme you will see your login or you will see your username at the top right corner hover over that and click on downloads now here you will see all the different themes and plugins that you have purchased with theme forest we want to use this option fox hosting wordpress and whmcs theme select this option click on download select the first option all files and documentation now a zip file a new zip file will start installing as you can see we'll start downloading let me do one thing let me cancel this thing because i already have this zip file and let me show you this zip file okay so as you can see your zip file will look something like this it won't say fox it would say something like themeforest or something like that you have to do one thing you have to right click on this and click on extract files now once you click on extract files a new folder will be created by the same name so the file name was fox a new folder name will also be named fox so open this folder inside that open this folder fox hosting wordpress and whmcs theme and inside this you will see some more you know zip files we have to use this fox dot zip file on our website so to install this theme you have to come back to your dashboard click on appearance now click on add new now because we have the file we have to upload that file so click on upload theme choose file and choose the file that have just showed you so it is under forks under this folder and here it is select this file click on open and click on install now so this theme is now getting installed on your website right now as you can see once this theme is successfully installed you will get a screen like this you have to click on this activate link to activate this theme and once it is activated it will show it will show you this screen and to have or to have a whmcs website you must have all this thing tick mark so the reason we are selecting a2 hosting is because these guys use the latest technology and as you can see that is the reason why everything is automatically tick mark you don't have to do anything manually now you have to do one thing you will see this screen at top begin installing plugins or you can click on this option required plugins and you can now tick mark this thing we have to install all these plugins from here so instead of installing them one by one we can simply tick mark over here this will select all this option and under bulk action select install and click on apply so this will install all the plugins at once we don't have to do one by one okay so once all these options are installed once all these plugins are installed you will see a new link at the bottom return to required plugin installer click on that link and now it's time to activate all these installed plugins so again tick mark over here under bulk action select activate and click on apply all these options all these plugins will be activated for you now again come back to dashboard now once you click on dashboard you will see this elementor page so again come back to dashboard now if you completely want to skip the first section first let me do one thing let me just again get rid of this widget now if you want to completely skip the first section which is your designing section what i'm going to show you is i'm going to right now show you how to design this entire website especially this home page step by step from scratch how this thing is created how all these things are created so if you want to completely skip this section if you want to save some time which would be probably one one and a half hour i guess so you can do one thing you can install this demo content so to do that thing you can do one thing you can uh you know see this option fox option hover over fox and click on theme options and here you'll see the option to maybe not over here let's see under appearance okay so under appearance you will see this option under appearance hover over appearance and click on demo import now once you select this option under appearance demo import you can see all the pre-made websites for you and this is the one that we are using classic demo so if you want to save some time you can simply click on this import button this will import this entire website for you so once you have this thing imported you can again go in the video description see where we start installing whmcs and you can proceed from there or if you want to see this entire process if you want to see how how this entire website is designed step by step you can follow my steps let's first do one thing let's first refresh this website let's see the changes in the design now as you can see this design looks so much better and obviously we'll make it even more better now again come back to your dashboard now we'll start designing the home page so to design the homepage first of all we have to create the home page so to create a new page hover over pages and click on add new now you can give this page any title you want so i'll give it a title of home because obviously this is our home page so i'll just give it a title of home and click on publish now once you publish this page and once you open this in a new tab this is how this page design will look like this is the default layout of this theme you have this header title and after that you also have this option this sidebar and this is your small content area obviously we don't want this design and with that we also see one problem over here if you see the url bar here it says your website name slash home if you see the demo website it does not say slash home so this basically means that we have created a new page or we have created a new home page but this is not your homepage this is just a regular page we have named it home so just by naming it home it does not become your home page we have to set this page as our home page because right now if you click on this fox icon or for fox logo you will be redirected to some other page which is your home page so let's do one thing let's set this page as our home page so to do this thing click on wordpress dashboard now under settings click on reading and over here you have to select the second option your home page displays a static page and under home page select the page that you have just created and click on save changes now again if you come back to this page and refresh it you'll see that slash home from the url bar is gone and if you click on this icon you're still on the same page which simply means that this page is now set as the official home page now let's start designing this page so to do that thing come back to pages select your homepage click on edit and obviously to design this thing we'll be using elementor which is really useful and this will help you to design the website very easily let me show you just click on this button edit with elementor now once you click on that button you'll see this screen and now this is how your page will look like now let me first show you or let me first explain for those people who are who are going to use elementor for the first time so elementor is basically a page builder and here as you can see at the left hand side these different options are different elements so using these elements we have created this entire website this home page blog page about page all the hosting pages all these things even all your mega menus and everything is created using these elements so we basically use these elements to create pages and how we do that you are going to see that right now so first of all remember one thing all the pages whatever page you want to create home page blog page hosting page any page you want to create all pages are divided into different sections so in this case as you can see this is your first section then after that your hosting platform second section this is your third section then after that fourth fifth section so everything is created section by section and to add a new section you click on this big plus button and you select how many columns you want in that row or in that section so as you can see on the first section or in the first row we have two columns at the left hand side we have this text and the search icon or search form and the right hand side we have this simple image so we need two columns so select this option two columns now let's start with the left column so in the left column we have this title and we have this simple description so to add this thing first of all i'll simply copy this thing just to save some time i'll come over here now as you can see at the left hand side settings have now changed so again to go back to your elements option you can now click on this nine dots icon if you follow my mouse cursor click on this nine dots icon and again you will come back to this elements page and here you have to search for heading select heading and select this icon this colorful icon which says heading drag and drop this option over here now enter your title so this is my title and after that you go to description and enter your description so in this case this is my description i'll copy it paste it over here now right now your design will look something like this obviously it is not looking really great and also we don't want this divider in between so you can come back to layout and you can first of all we don't want to show subheading we just want to show heading and description and we also don't want to show this divider so make this thing off as well now let's design this thing so come back to style and here as you can see you can change the color font family all these things from here first of all we want to use this simple black color so i'll come over here instead of this color i'll click on this color and i'll search for this color code i'll just type in this color code 242424 this will change this thing into this black color now for hover color when i hover over this as you can see the color change if i set this to red color or some other color let me show you now if i hover over this as you can see the hover color changes to red but for me i don't want to make it really fancy i just want to keep it very simple and classy so i'll make it two four two four two four as well so i don't want any different animation for hover color then after that you have the typography option so click on this pencil button by default roboto is the default found family i want to change this thing i want to make it pop ins so i'll click on this font family i'll click on roboto you will get hundreds of thousands of different font families available i just want to select pop-ins from here and now as you can see your font family or your font style is changed i also want to increase the size of this thing instead of this i want to make something like 39 or 40 pixels with that you can also do some more things you can make it lighter as you can see if i select 100 it becomes very light if i select 900 it becomes very bold obviously i want to i want to keep it at in the middle so i'll select 600 you can also do one thing you can add some line height and all those options for for this option i want to do one thing i want to add a little bit line height as you can see so line height is the space between these two lines so let me do one thing under line height let's type in 1.2 just a little bit more okay obviously if you want you can also increase this option as well then after that you have some more option let me do one thing let me first add some margin at bottom so as you can see this is your option below this thing we have some small gap over here so to add this gap we'll do one thing we'll first make the margin off and here from bottom i'll type in maybe 16 pixels or 20 pixels just a little bit margin at bottom then after that we have our description so click on description this is the default color for description i want to change this thing i want to make it 7e7e7e this color okay light gray color and i also want to change the typography for this i want to make it carla okay so k-a-r-l-a karla select this option and i want to decrease or i want to a little bit increase the size of this thing so i'll type in 17 pixels and i'll make it lighter so 400 okay so this looks so much better select this option and we all you can also add some line height over here i can add 1.7 all right now you can do one more thing you can go to wrapper or and you can decrease the width of this option so as you can see you can do it like this if you want your option to be within a certain width you can do that as well let me select maybe 470 or maybe let's select 450. so whatever option you want this is not obviously necessary you can just leave the wrapper as it is or you can change this wrapper setting as well now click on update so whenever you do any changes on your website make sure to always update the page so that the changes are saved now after this we have this option we have this search option so a person can come over here they can search for the domain name so again to use this option we can click on this nine dots icon come back to this page and search for button you will see not button search for form you should see this option form option forms option drag and drop it over here now you have to set your placeholder input so as you can see the placeholder says example.com so i want to keep it at example.com we also want button so i'll select this thing yes and you'll get this button over here we'll design this thing don't worry this is how this thing looks right now and the button says search so instead of check i'll type in search over here all capital so i'll just type in search now if you want you can also create all the domain name extensions so here as you can see dot com is 14.99.net is 9.99.org dot store you can have different domain name extensions as well so click on add new and instead of extension i'll type in dot com and price you can set this price so maybe i'll set it to 15.99 okay then if you want to create more click on add this time let's select dot net and the price with this of this will be maybe 14.99 so you can create all these different extensions let me just you know duplicate these things and after that again make sure to update this page now to style this option or to style this form come back to this style option or come to this style option if you want you can give some background to this so let's add some background so under search button background select this option and you can add any color so i want to add this color 6a 6 to f e okay as you can see we get this color now i want to do one thing i don't want to add this color i don't want to type this color code again and again so you can do one thing you can save this color code so you can click on this plus button and let's name it first color or primary color so i'll just name it first because this is going to be my primary color i'll i'm going to use this color again and again on my website okay so this is now saved and how to use this thing i'll show you very soon i don't want any border right now as you can see we have this red color border besides or you know outside of this button i don't want that border so for border width i'll make it 0 pixels now it's time to change the background for this tlds okay this domain name extensions so you'll come back to this option tld background and we want to make it transparent we don't want this background color so for extension also we'll select this option will make it transparent okay select this like this and for price also we'll make it transparent all right now click on update now to achieve that design that we have uh used over here you can now go to advanced and here you will click on this option you will see the css classes type in this thing over here okay i'll i'll show this thing i'll type in this thing on your screen wdes hyphen domain hyphen classy once you type in this thing this css class it will automatically design this form like this okay so this is how this thing looks like once you achieve this thing simply click on update all right so now it's time to use this image over here now obviously i have given all these images for free so there is a link even in the video description below if you click on that link you can download all these images for absolutely free or you can do one thing if you want to create your own image if you don't want this database image or if you don't want this illustration if you want some other illustration and if you want some other color you can do that as well you can go to this website undraw dot co slash illustrations and here you'll get to all these illustrations for free for example as you can see this is database or server illustration so i can come over here you can also search for this option if i search for server let's see what all results you get if you scroll down as you can see this is the very first image as you can see server status if i click on this this is the image that i've used over here so all these images that you see on the screen on this website all these images are downloaded from here if you don't want this color if you want to add some other color you can just change this color to some other color and now as you can see it is automatically changed so it all depends on you whatever color you want to use i want to use this color i can select this option you can download svg file or you can download the png file for your website so whatever file you have selected or you have downloaded now after that you can come back to this website come back to extensions and use the image extension so drag and drop this image extension at the right hand side click on choose image and upload the image that you have just downloaded so let me do one thing let me upload this image that we have just downloaded click on open once it is uploaded you can click on insert media and now as you can see this is how this thing will look like again just make sure to update this page now let's do some changes in the row in this section so as you can see we have some space at top and bottom of this row and everything is aligned in the center in middle so to do this thing you can click on this edit section as you can see over here in the top section you will see this six dots blue icon you can click on that and you will see edit section at the left hand side now if you're not able to click on this six dots icon you can do one thing at the bottom left corner you will see this navigator icon click on that and here as you can see this is how this thing will look like select this option and here click on section now once you click on section from here you'll see edit section at the left hand side now let's do some changes so here first of all let's increase the height so under height select minimum height and here type in 600 so minimum height will be 600 and you have to also select this option vertical align middle so everything is in the middle okay now again click on update now with this your first section is actually completed but remember one thing whenever you create any section always see how that section looks on mobile phone and also on tablet so to see that thing you can now see this option over here at the bottom left corner responsive mode click on that icon and select mobile now as you can see on mobile phone this is how this thing looks like so let's fix this thing so click on this and let's change the style and everything so go to style change the size of this text first text if you increase or decrease it it will look like this first of all let's go to wrapper and let's do one thing let's increase this wrapper to let's keep it at 300 okay for mobile phone now again go to heading you can increase or decrease the size whatever you want so i think this looks good and you can also do one thing you can make everything center align now go to description make it center alignment for this also you can change the height and all then after that rest everything looks good now let's go to tablet so click on tablet and this is how this looks on tablet i think this looks good or if you want to do some changes again if you want to change the size and everything you can do that click on this pencil button go to design select this option and here you can change the size of this text first let's go to wrapper i would recommend you not to type anything under wrapper this is creating a lot of problems over here so don't type in anything under wrapper or else you have to set different wrappers for different devices all right so under wrapper i'll make it 360 for for tablet and now let's change the size of this text okay maybe let's see this looks good so maybe 30 31 and for our description we'll decrease this thing to maybe 14 all right so this is how this thing will look like now once you achieve this thing just click on update and again come back to desktop our main option our main aim will always be desktop i guess now with this your first section is 100 completed we have seen how to create this section we have also seen how to make it mobile friendly now let's create a second section now to create a second section again scroll down and click on this plus button and this time we just need one single column because here as you can see we just need one single column for you know showcasing all these carousel icons so select the single column and inside this thing come back to this elements option and search for image carousel select this option drag and drop image carousel at the bottom and you can upload all these images again all these images are also given to you for free you will see a link at the in the video description below simply click on that link and you can download these images for free so go to logos folder and upload all these images for free now once you upload these images click on create a new image obviously you should not be uploading these images just like this i would recommend you to upload some you know images like cpanel icon um you know let's encrypt icon those kind of icons or offers that you're offering on your hosting plan now under image size you can change this thing if you want and we want to do one thing we want to change this thing slides to scroll to five so that we have five logos displaying at top and image stretch will be no and slides to scroll will be one uh image stretch will be no all right and i also don't want to show all these navigation icons so i'll select navigation none now click on update now we also want to do one thing we want we want to add this divider at the bottom as you can see this divider so to add this divider i'll come over here we'll search for divider drag and drop this thing at the bottom now uh divider width will be 100 that is fine but i want to do one thing i want to go to style and change the color i don't want this black color obviously i just want light gray color so just type in e e e six times you'll get this very light gray color and we also don't want any gap so make gap zero now go to advanced and let's add some margin at top so that we have decent amount of space between these icons and this divider so under margin top i'll add maybe just a little bit 10 pixels at top now click on update now let's do one more thing let's add this extra space at bottom okay as you can see below this we divided we have a lot of space over here so to add this space we'll select this option this row option edit row go to advanced and under margin bottom i'll add 125 pixels so this will add this extra margin at the bottom now click on update so that when we create our next section we have this space in between okay so to create this section our new section will again come back over here click on this plus button and this time again we need one single column so click on single column now the first thing that we need is the simple title and subtitle so i'll again come back over here go back to elements and search for heading again drag and drop this heading element over here now what is your title so this is our title i'll copy it paste it over here then after that what is your subtitle so this is our subtitle so we'll go to sub heading or subtitle and we'll paste it under maybe highlighted text okay and we don't want any description over here and we don't want this divider so we'll go back to layouts we'll make a description of divider off okay now let's go to content make it center line go to style let's style this thing first of all the color of this subtitle or the color of this subheading so select sub heading and let's change this color to this primary color that we have already saved last time so you'll click on this globe icon and you'll see this color that we saved click on this or maybe we have to change the color of the top one so let's not change this option let's make it default come back to heading change this color to this first color heading color and for hover icon also for hover color also i want to keep it to same color now we want to decrease the size we want to make this thing smaller and we want to make this thing bigger so to make it smaller first of all we also have to change the font family and all so for the first one i want to change the font family to pop ins and we want to decrease the size so let's make it 15 16 or something like 17 pixels and let's you know make it lighter okay so i'll set this thing to 400 you can also add some line height if you want i'll add 1.6 line height now let's see subheading so click on subheading now for this the color is this simple black color so again and again and again we don't have to type in the same color let me do one thing type in two four two four two four and let's save this color so click on this and i'll name it two four black okay so that i know what is the color okay now click on create again and now for the hover color we just have to click on this group icon and click on this 2 4 black color and you have your color over here to change the typography click on this pencil button instead of roboto let's again make it poppins and after that the size of this thing will be 33 and yeah 600 looks good now once you do this thing again just click on update now because we have created this thing next time we don't have to create it again so as you can see we have a similar design of heading many times in the website this is also similar design this is also similar design similar color and all so once we have created this theme next next time when we have to create this thing we don't have to do that anything we just have to you know copy it from here and we will paste that thing over there i'll show you how that is done now below this thing we need three different columns so we can do one thing we can come back to elements and we can use this inner section so drag and drop this inner section below this heading now this will add these two inner columns i want to add three columns so you can do one thing right click over here and click on add new column and now as you can see we have one two and three columns now first of all i want to do one thing i want to add some space at top okay as you can see so that we have this extra space over here in between this title and this section so we'll click on this option edit section edit inner section go to advanced and under margin top i'll add 40 pixels and as you can see we have this extra space over here now let's add all these options inside this so first of all we want to add this icon or this image this desktop image again to get this image you can again come back to illustration click on search and search for desktop or any other image that you want so if i search for desktop as you can see you can use any one of these maybe i want to use this one so you can click on this and click on download png for blog now once you have your image you can now again come back over here come back to elements and search for image element now drag and drop this image element over here in the left column upload that image that you have just downloaded so this is the image i'll select this thing click on open and click on insert media and this is how your image will look like now below this image we want to add again this title and subtitle so we'll use the heading option so again come back and search for heading drag and drop it below this option now your title is shad hosting if you're selling shadow string and your subtitle or your description is this thing so i'll copy it or maybe i'll paste it under description so let's paste it under description now let's design this thing first of all go to layout and we want to make subheading and divider off and we want to make it center line so go to content make it center align now go to style first of all for title the color is this and hover color is different when when i hover over this as you can see the color changes so i'll select color this black 24 color and for hover color i'll set this to this first color now as you can see so this saves a lot of time now for typography again i'll set this thing to pop-ins now you can save some time here as well let me show you if you set this thing to pop-ins and if you do one thing if you click on this plus button this font family will also be saved just like the colors so i'll just add pop-ins okay next time you don't have to select pop-ins again if you just click on this option select pop-ins it will automatically become pop-ins and after that you can do some more changes in this for example we want to change the style or we want to change the height to 22 and we want to make a little bit lighter 500 weight now for the description so select this description and change this color instead of this color i want this 5a 5a 5a okay a little bit darker gray color now i want to make it poppins or maybe not poppins for this i want to make it karla and i want to save this thing as well i want to save this font family as well so i'll click on this plus button save it so that next time we can save some time click on this option now click on this pencil button to change this style or change the size just make it 16 pixels i want to make it lighter so 400 and let's add some line height of 1.6 now if you want you can add some space as well as you can see margin top and margin bottom all these spaces are added over here so if you want you can do that thing go to advanced and you can add some margin once you're done just click on update now in the bottom we have this button get started button so to do this thing we'll search for button so search for button over here and select this thing drag and drop this button option now the button text over here says get started so under text will type in get started and you can link this button to any page you want right now we have not yet created any page whenever you create any page you can link this button to that particular page now make it center line and we also want to add icon so click on this icon and we just want this simple you know right side icon right arrow icon so search for right and select this arrow right icon and click on insert now i want my icon after the text so icon position make it after okay now as you can see this looks much better now go to style and now let's change the styling first of all the color is this black color and when you hover over this it becomes this color so for typography first make it poppins and let's decrease the size so click on this pencil button let's make it 24 or maybe not 24 let's make it 16 because we want a smaller button change the font weight to 500 now let's change the color of this thing so first of all you have your text color i'll make it this black color 2 4 and for background color we don't want any background color so you can do one thing you can click on this and you can select the second option make it extreme left this will make it this will make this thing transparent okay now border type select solid because we want this border at bottom as you can see and make everything off and under border bottom type two pixels or maybe not two i think one is fine just type in one pixels and under border radius make it zero now if you again see this is how your button will look like all right we see this extra space at left and right because of this padding so we can do one thing we can decrease the padding we can make padding zero and only for bottom we can add some padding of 8 or 10 something like that okay let's see again this looks much better now click on update now finally just select this row click on edit row go to advanced and let's add some margin at bottom so i'll add maybe 125 pixels at bottom so that for the next section we have this extra space at bottom all right now again click on update and with this here this section is also completed for our next section which is very simple again we'll click on this plus button will add two different columns in the left column we will add this heading so come back over here search for heading and drag and drop it over here under title this is your title and after that this is your subtitle or your description so i'll add this maybe under description now again we have seen this thing several times go to layout of subheading and switch off this divider now go to style now the color of the title is this black color so i'll select this 2 4 color hover color also you if you want you can have this color if you want you can change this color now for this typography i'll make it pop ins and to change this size and all click on this pencil button increase the size to 39 or 40 pixels and 600 is fine let's add a little bit of line space or line height i'll add 1.3 em over here all right then after that you can do one more thing you can add some margin at bottom if you want so maybe at bottom let's add 20 pixels just a little bit margin now select this description uh we don't want this color for this description i want to some other color let's see let's see 7e 7e70 let's see how it looks i think this looks good again for this i want carla so i'll click on this globe icon click on carla and you can see the font style is changed now click on his pencil button let's change the height to 17 pixels or size to 17 pixels make it 500 and let's add some line height of 1.7 okay this looks much better now click on update now below this thing we have these two options so for this we can do one thing we can add another inner column over here okay like this and we can add these icons in that i've given you these icons so you can just you know upload them or if you want to create your own icons there are many websites that you can create it from for example if you want to create icons like this or this you can go to a website the simplest way is to go to logomaker.com l-o-g-o-m-a-k-r not k-e-r-m-a-k-r dot com and here you can search for that logo for example logo or icon for example if you want this globe icon or www icon just search for www and here as you can see you get hundreds of thousands of icons like this now whichever you want to use you can select this option and let's see suppose if you want to use this one click on this and if you want to change this color so here as you can see this is the color that we're using if you want to change this color just change it like this all right and once you're satisfied with this you can now click on this option this crop icon at the bottom right corner click on crop make sure this section is selected and click on save logo at the top right corner and from here select this option no thanks download low resolution file this file will be downloaded for you as you can see png file which means that your background is transparent so this is how you can create many different type of logos and icons and you can use them on your website i have given you these two icons so if you want you can simply use them so come over here let's add image first of all so drag and drop this image element upload your images from here let me upload these two images in fact let me upload all these three images click on open let me use this one click on insert media or maybe let's do one thing instead of using instead of creating it like this we can use a pre-made element that will save you some time so let me just delete this thing and instead of using this element image element search for image box element here you'll see image box drag and drop it over here now upload your image over here so i'll select upload my image and the size is full you can obviously change this thing you can make it large wide whatever size you want you can change the size of this image for example if you select large if you select medium if you select small you can also give a custom size to this one now you're heading so this is your heading i'll copy it paste it over here then this is your description copy it paste it over here so this will save a lot of time now we don't want this thing in the center line we want left align so you go to style and you change the alignment let's see where it is i think it will be under content if you click on content here as you can see left align make it left align now you can increase or decrease the image size and all these options if you want for example here as you can see spacing is 15 you can increase or decrease the spacing it will increase or decrease the spacing between this image and this title you can also do some changes in the font style and all so it all depends on you can increase or decrease the image size and all now go to content let's change the content now first of all for the title i want to change this color to this black color and for typography i want to make it pop ins click on this pencil button let's change the size and all so for this size i'll make it 18 pixels size and for weight will make it 600 all right then after that you have your description option so for description we'll make it color and we'll change this size to 16 pixels and obviously we'll make it lighter so we'll select 400 weight and for the line height we'll make it 1.6 so this is how this thing looks like obviously if you want to add some margin here and there you can do that as well once you're done with this just click on this update button now you can copy this from here and paste it over here just to save some time instead of this image change this image instead of this title add some other title from here all right so this is how you can save some time now click on update again now finally we want to use this button so to use this button we can come come back to elements now again search for button and you will see your button over here drag and drop your button at the bottom now this time the button text is learn more so we'll come over here under text we'll type in learn more or whatever you want you can type in that thing and again you can link this button to some page if you want then if you want to add some icon again we are using the same icon right arrow icon so i'll search for this icon and we'll make it after text and this time we also want to make one thing we want to increase the space between this icon and this text so under icon spacing type in 13 and now as you can see the space between this icon and this uh this text is increased now go to style now for typography i want to make it pop ins and we want to decrease the size to 16 okay and i don't want 600 i just want 500 okay now you can do one thing you can also increase the radius and all so if you select border radius 50 this will make it nice circular button and obviously for the background we want this color background okay so i'll select background color this now you can do some more thing if you want to increase the size of this button you can increase the padding if i make it zero as you can see this is how it looks like i can add my own custom padding so i'll add 17 pixels from top and bottom and 35 pixels from left and right all right now as you can see the size of this image or the size of this button is now increased now let's add some margin at top so go to advanced and for top margin let's add 20 pixels okay now as you can see we have some space over here this looks better now click on update now finally the right hand side again if you want to use this image you can go over here you can search for mobile and let's see now if you scroll down here as you can see this is the image that we are using cloud sync you can just download this image and you can use it over here so let's very quickly do that download it png come back to your website and search for image element drag and drop it at the right hand side upload this image that you have just downloaded so select this image that you've just downloaded click on open and click on insert media and now as you can see your image is displayed over here now select your row option because this time we want to do some changes we want to add this background color and we also want to add this thing as you can see this top and bottom divider so to do this thing or to achieve this thing click on edit section first of all make sure everything is vertically aligned in the middle now go to style let's add this background color so for this the background color that i have used is f7fafe okay this will give you this very light blue color now we want to add shape dividers so click on shape divider we want to add shape divider both at top and bottom so for top select tilt and for bottom also we are selecting tilt but we want to flip this thing and right now as you can see i don't know if you can see this thing is or not this is how this looks like i want to decrease uh the height okay the height is a lot so i want to make it 45 okay very subtle for bottom also i'll do the same thing go to bottom select tilt and flip this thing make it 45 height click on update and obviously we because we have this thing is cutting both at top and bottom we can add some padding so go to advanced and let's add some padding at top and bottom so for this i want to add 125 padding both at top and bottom and this is how this thing will look like again just click on update and with this this section is also completed then we have our next section so for that we'll add a new row and because we have already created this option we can now copy this come over here paste it at the bottom okay just like this click on update i've just seen that i have not copied paste it over here once you create this option you can just paste it over here just like this and save some time so i'll copy it paste it over here copy the button paste it over here now click on this image and just replace it with some other image now change the title and also this will save you a lot of time now come back at the bottom now let's change the content so click on this option we already have this style and everything we just need to change the content so for the title this is your title so paste it under title for this subheading let's copy it and paste it over here all right so this looks much better now click on update again now below this thing we want to add these tabs options so these are different tabs so to add this option again come back and search for tabs and select this colorful icon drag and drop it at the bottom now here as you can see three tabs are automatically created for you let me do one thing let me delete bottom two tabs i just want one tab for now now for the tab title over here i want to type in features so i'll just copy features paste it under title and now as you can see it will say feature i don't want any icon so hover over this icon and click on this just pin icon and this icon will be disappeared now when you scroll down under content type instead of editor select template so what we will do right now is we'll create different templates and we'll display it under these tabs i'll show you how that thing works but for now just type in uh just select template under content type now let's do one thing now you can duplicate this thing multiple times if you want now go to style let's style this thing first of all i want to make it center so under tab control click on tap taps control and make it center so this is the first thing that we need now let's do some changes to this item all these different these are different items so select tabs control item now we want to change this typography from here so under typography make it pop-ins you will see this style is changed over here and for this size and all i'll make it 17 pixels and we'll make it lighter at 400. now i also want to do one thing i want to change this active color so as you can see the active color over here is this color and here this it is this red color so select this active color just search for active color oh it is over here select this aft click on active and over here just select your first color okay and now as you can see this looks much better now scroll down you will see this option under description you will see padding make it zero okay under description padding type everything zero just add a little bit at the bottom so everything will be zero only at bottom i'll add 33 pixels now scroll down you will see border option here you'll see border type make it solid and make make it zero again and you'll see all this border is disappeared around this thing okay so that is what this will do now we need just one single thing below this thing whenever whichever tab is active as you can see we have this border at bottom this color border so you can do one thing uh dealing this thing under border bottom type in two and change this color to this first color and now as you can see this is how this thing will look like now click on update now select tabs content now this is setting related to content which will come over here at the bottom so this is all content so this setting is related to this content now in the content i don't want padding from all sides so i'll make it like this or maybe i'll just make it zero first then after that i'll dealing this thing i want padding only at top 60 pixels at top okay so we have this extra space over here let me explain you that so this is against extra space over here this is 60 pixels padding and after that i want my content and i also don't want uh this border from all sides i want border only at top as you can see only at top of this content not all on sites if you just hide this thing right now as you can see we have border from all four sides i don't want that thing so again go to border and for top let it be one for right left and uh bottom just make it zero let's see again now this looks much better now come back to this page and just update this page now before we create our content let's do the final thing click on this edit row go to uh advanced and for margin top and bottom make it 125. okay just so that we have this extra space to divide different sections now click on update now we need to create different templates and we need to add those templates over here so what i'll do is i'll keep this tab open and i'll open my dashboard in a new tab okay this is your dashboard now in your dashboard you will see this templates option click on templates now let's create a new one so click on add new and under select select section okay so type of template select section and you can name it anything so we are creating it for features so i'll name it features section now click on create template now once we create this template we can simply add this template under these tabs i'll show you how that is done first let's create this template so this is what this template is as you can see we have three different columns and below we have this button so we'll come over here under this template option click on this plus button add three different columns now inside these columns we want to add these image boxes so click on this option go back to elements and search for image box drag and drop it over here at the left hand side now upload your image so we have already created this logo or this image select this image and click on insert media and now change your title and description so this is our title we will replace it with our title and this is your description now once you enter all these things it's time to style this thing so go to style first of all let's do one thing image position let's make it left because in this case also we have this image position left now again come back to this page let's go to style and let's do some changes over here first of all i want to increase the space between this uh image and all this text so instead of 15 i'll make it 30 okay now as you can see the space is now increased between these two things i also don't want to do anything i want to decrease the size of this thing so instead of 30 i'll make it 20. now as you can see the icon or the size of this icon or this image is now decreased now let's do some changes or some styling to the content so click on content first of all we have this title so the title color is i think black color as you can see and this color is this gray color so we'll select this title we'll make it 24 black change this to poppins and decrease the size make it 17 pixels and 500 weight now for the description we'll make it color and we'll decrease the size or not 1 pixels we'll make it maybe 16 pixels and let's make it lighter 400 you can also add some line height if you want i'll add 1.6 over here now click on publish now once this is created you can simply copy it paste it in all the other columns and now you can click on the second column change the title subtitle all those different things okay now select this section click on edit section go to advanced and for top margin let's add some margin at top so i'll add maybe 40 pixels at top you can do one more thing you can create this button we have already seen how to create a very similar button in our previous section so i'm not going to cover that this button thing you can watch that thing again and you can create a very similar button now once you create this section you can now come back to your page your home page refresh this page and similarly you can create different templates for different you know columns now scroll down and select this option features click on features and we have selected templates now select the template so as you can see feature section the template that we have just created as soon as you select this thing you will see your template coming over here now click on update i think we have added we should not have added that extra 40 pixels space at top but that is fine you can just delete that thing but as you can see this is how this thing works now for all the other tabs as well you can create different templates and you can add that in those tabs okay so with this this section is also completed now our next section is maybe the most important section obviously because we have created different you know pricing plans for different product plans hosting plans over here so to create this section again click on this plus button add a single row single column and first we need to add this title and subtitle so i'll copy it from here and we'll paste it over here obviously we'll have to change the color and all but no this is how this thing looks we'll change the color later on first let's add this background color so we'll select this option edit section go to style and change this background color select our first color now once you have this color now go to advanced and let's add some padding at top and bottom so i'll add 125 pixels padding top and bottom and we also have to add this tilt at top and also at bottom okay this tilt divider so go to style again shape divider top select tilt select 45 height not 450 45 and make it flip okay for bottom also obviously if you want you can select cloud and all many different options are available i'm just selecting the one that i have used in the demo website now again click on this title subtitle and change this color to white color so i'll change this to white color and i'll add this white color because we'll be using white color a lot so i'll add this white color over here okay now for this also i'll click on this icon and click on white color okay select sub heading white color for both the options so once it is done you can now click on update you can do one thing we can go to heading i think we need some space at top at bottom below the title i want to add maybe 10 or 20 pixels of padding okay now click on update this looks much better now let's again add these tabs because these are also different tabs so to add these options again we'll search for tabs drag and drop it over here at the bottom i just want to create the first tab which is your monthly tab so i'll give it a title of monthly again we don't want any icon so i'll just delete this icon and again under content we want to change this thing to template now let's do one thing let's go to style and let's style this thing first of all under general tab we have to do one thing we don't want any padding or any margin so make everything zero under padding also and everything under margin also should be zero now go to tab controls so select this tab controls option and i think it is in center so make it center align now i want to add four pixels padding from all sides okay so that we have this option as you can see this is how this thing will look like and we don't want any margins on the margin make everything zero now under border radius type in 50 pixels okay first make sure you have border type okay select border type this will give you this border change the border color to white so select border color change this thing to white and make sure border radius is 50. right now obviously it is looking really funny really bad but we'll change this thing but before that just go to item tabs control item and just scroll down and change the style of this thing so here as you can see the color of this active and all again we have to change that thing so the active color is this color and the background color is white color so active color will change this thing to this color all right and normal color normal color i think is fine normal color is white so we'll change this normal color to white we don't have any tab let me do one let me duplicate this thing so that we see normal and active okay now as you can see normal and active difference between these two now go to style again click on tab control item and we have changed the color of the background click on first click on active and here let's see when you scroll down under background type you can change background color to white which is already white but if you don't see white color background you can change that thing to white now you'll see this padding option under padding i want to add let me show you 10 from top and bottom and 40 from left and right and again under border radius make sure you type 50 so that you get this option over here and then the border type make it solid and make it zero we don't want any border okay for this option also this is this was for active for normal also we don't want any border so border type select solid and make it zero okay this looks much better this is how this thing will look like now finally let's change the style of the content so click on tabs content because we don't want this background color and all for the content so select this content option taps content option first of all for padding i don't want any padding at left and right i just want padding at top and bottom so for top and bottom i want 90 pixels but for left and right i want zero okay just like this we also don't want any border or any border radius so under border type i'll just make it 0 pixels and no border radius so make it 0 as well now finally go to advanced and under advanced margin top let's type in 40 pixels and again to give it a style similar to this one simply go to css classes and type in this thing classy hyphen plans hyphen border hyphen radius again i'll i'll type this thing on my screen so you can see that now click on update okay let's also change the background color we don't want this white background color for the content so go to style tabs content scroll down search for background here it is background type and background color select this color select any color and make it transparent okay just like this we don't want that white color in the background click on update because what that will do is this that will add white color below all this thing we don't want that i guess now again we have to go to template and we have to create different templates for different plans so let's see how we can do that again open your dashboard in a new tab okay so again to create a new template from the left hand side hover over templates and click on add new or click on save templates now click on add new from here now again under type we'll select section because we are just creating a section not an entire page so make sure you just select section and after that you can name it anything so we are creating monthly plan we have to create two two templates one for monthly one for yearly so first let's create monthly plan which is over here let's give it a title of monthly or anything you want now click on create template now let's see what we have to do here we have to divide this template into three different columns obviously for three different plans so click on add new select the three different columns from here now before you do anything else before we create any content let's do this section settings first so under section you have to do one thing go to advanced and let's add some padding at top and bottom so under padding top and bottom let's add 30 pixels for both top and bottom now look go to style and make sure you make uh the background image or background color transparent so just bring this thing below thing at the extreme left this will make it transparent now click on publish now once it is done now we can start adding all this content over here so to add this content come back to your elements and search for pricing table here you have this option price table drag and drop it over here now this is pretty simple this entire process or this entire structure is created for you you just have to change the content for example here the title is startup so i'll copy it paste it under title if you have any subtitle you can just copy and paste it over here we are not using any icons or any logo so here so i'll delete this thing but if you see we are using that in the shadow hosting page if you click on shadow string page this page will be creating later on we actually won't be creating we'll be importing this page but here as you can see you can create icons you can color it and this is how it will look like right now we are doing it without any icons or anything so this is your title subtitle and after that you have your prize no icons so we'll come over here we'll select price and here the price is 8.99 for my monthly plan so under instead of 39.99 i'll just type in 8.99 per month obviously you can change the you know dollar instead of dollar if you want to change the currency symbol you can do it you can you know put in rupees or anything or any currency you want okay instead of suffix instead of per month you can type in per year if you're creating yearly plan also then we have to add all the different features so go to features we don't want any title for the feature so i'll delete the title and let's add all the features so the first feature over here is that you can create one website i don't want any icon so i'll delete it and i'll cut these things now i'll duplicate this thing multiple times just to save some time now the second option or the second feature here is 10 gb of ssd web space all right third feature over here is 100 000 or 10 000 monthly visitors now right now what we are doing is we are doing only the designing this is not actually adding 10 gb of web space and it is not adding any limits or any features so here this is just the designing part in the later part of this video we'll see how to do the technical part how to add how to actually add these switches and all then your next feature is 100 500 mb bandwidth so i'll just copy it from here paste it over here then your next option is free ssl then no daily backups or whatever your feature is you can add all these features from here all right copy it paste it over here now you can go to footer now under foot i want to do one thing or if you want to add if you want to change the button text or anything you can do that so here the button text says select so instead of by i'll type in select now later on we'll see how to replace the link right now if you click on this button it won't do anything but later on we'll see how to add this option that whenever someone clicks on this button they are redirected to this plan page we'll see all those things later on now let's do styling so go to style first of all under table i want to do one thing i don't want this button at bottom i want to bring this button at top just below this pricing so you can do one thing come over here and you will see the order option now under footer order type in three and under features order type in four so as you can see this is what happens footer goes at top and features comes at bottom now we also need to do few things if i you know hide this thing as you can see we have this border over here i don't want this border so if you want to get rid of this border let's see here as you can see border type just type in 0 from all sides now under border radius type in 4 so what this border radius will do is as you can see the corners it will a little bit it will make the corners curve as you can see right now it will make this thing like this so instead of sharp corners it will make it like this now we also want to add some padding from all sides so for this i want to add 40 pixels padding from all sides and if you remember for the section background we have made it transparent so for this background we have to change the background color so we'll go to this option background type and change this color to white color so click on this and select white color so that on real website this is how it looks like okay now let's see how we can design the content so in the content first of all you have your header which is this thing startup your title and subtitle so for title color we'll make it this black color typography will make it pop ins and we'll change the size and all from here so for this i want to make this size 23 and we'll make it 500 weight i don't want to add any margin if you want you can add any margin if you want all right now for the description here we have for this subtitle basically select this subtitle if you want to change this color i'll change this color to 4d 4d40 okay a color like this dark gray color or light black color anything you want then after that for typography again we'll select karla and we'll change the size to 16 pixels and we'll make it lighter 400 weight now let's do some changes on the pricing option so we don't have any about title so leave that thing come to pricing and here first of all we have the prefix so here as you can see this is your prefix this dollar sign so if you want to do some changes over here you can do that as well so we'll change the color to this black color and we'll make the this time we'll make typography different because this is only related to this icon or this symbol dollar symbol so instead of instead of roboto or poppins this time i'll select monster it okay select monster it and this is how your symbol will look like now you can do some more thing you can increase or decrease the size i'll make it 17 pixels just a little bit smaller and a little bit lighter then after that you can also change the vertical currency position you see as you can see if i increase or decrease this thing you can see the changes on your screen okay so this is how this looks like now let's do some changes on the price so pricing color is this color so first let's change the color to this primary color now let's change the typography so for this also i want to change it to monster it so under font family i'll search for monster it then after that we also want to increase the size of this thing so i'll make it 40 pixels and 600 is fine then we have suffix which is over here for this we have again this black color so we'll just select this 2 4 black color and this will also be monster so we'll select this option change the font family to monster it the size of this thing will be 14 pixels and we'll make it lighter at 400 pixels all right then after that we have the features options so select features now for the features i want to change the typography to carla and after that we want to change the size of this thing to 16 pixels and make it lighter at 400 if you want you can also increase the line height because as you can see this does not look good so under line height i'll type in two okay this was for feature header that is the reason why no changes have taken place we have to select this feature item which is over here select this feature item scroll down and here you have your typography so under typography will select carla so you can search for this thing and after that you can change the size to 16 pixels make it 400 and change the line height to 2 pixels or 2 em also make sure to change this color to this black color now finally we have our photos so click on footer option now the first thing that we need to do for footer is add some margin at bottom so that we have some space between these features and this button so under margin bottom type in 40 and let's add some margin at top as well so maybe let's add 15 pixels at top and for bottom maybe let's add 30 instead of 40 because 40 was a lot of space 30 looks much better now for this typography also we want to set this thing to carla so you can scroll down come under button and select typography select karla from here and you can change the size to 17 pixels make it lighter at 400 and let's change the padding so you can come back again over here as you can see first make it zero and now let's add some custom padding so from top and bottom i want to add 8 pixels and from left and right 55 pixels all right this is how this thing will look like and let's also make it circular so under border radius type in 50 this is how this thing will look like now if you see the demo website here as you can see the button does not have anything in the background in fact the button background color is white and we have this border color so to do this thing first select border solid one pixel width from all side and color of this border will be this okay and for background color of this select background color and you can make it transparent from here like this okay and text color let's make it black or not black i think okay it is this color primary color so not black let's set this thing to our primary color and this looks so much better now click on update now do one thing select this option edit column click on this option edit column go to advanced and make sure zero padding is added from all sides now once you have created one option all the other option becomes so much easier you can simply right click on this and click on duplicate again right click on this and click on duplicate and now you can delete these empty columns now for the middle column we want to do one thing we want to add some shadow you cannot see that shadow but once we add that thing you will see it so click on this center option center pricing table go to style and here let's add some shadow so you will see shadow option let's see here as you can see box shadow enable this option once you enable this option this is how it will look like let's first change the color of the shadow so come over here click on this pencil button instead of this color you can change change it to some other color so i'll change this thing to our primary color which is 6a62fe okay this is your primary color and this is how this thing will look like if you hide this thing now if you want you can do one thing this is you can change the z index which will make it at top so to do this thing you will go to advanced and here you will see z index type in two or three or any any number above one and now this is how this thing will look like now we also want to do one thing we want to enable this stripe over here so as you can see here it says trend or popular or you know famous something like that so go to content and you can enable stripe and whatever you want to type in for that for example let's type in trend or trending now again go to advanced and let's add some padding from left and right so under padding or left and right type in five just a little bit and if you want to change the styling of this uh stripe which you have just added you can do that as well here as you can see stripe option select this option text color so here the text color is white and the background color is your primary color so text color will be white and background color will be your primary color you can also go ahead change some typography if you want now click on update now once you create this template again come back to this page refresh it now scroll down and add this template under monthly options so click on monthly add this under monthly template select this template monthly and this thing will be added over here this is how this thing looks like i think we have a lot of space over here let's do one thing click on this option instead of 30 let's make zero at top let's try it again click on update refresh this page now scroll down and i think still we have a lot of space so you can click on tabs and go to style select tab content and here instead of 90 pixels top padding make it like 40 pixels all right now this is much better click on update again now similarly you can go to or you can actually duplicate this entire content and create your option for a yearly content let me show you you can go back to your dashboard click on templates now select this monthly option and you can do one thing click on export template once this template is exported click on add new select section this time give it a title of yearly click on create template now after that just click on this icon this folder icon click on this option go to templates now import this template that you have just exported or you can do one thing actually we already have this thing over here monthly option just insert this thing click on yes and now as you can see this is inserted for you you just have to change the content so instead of this price some other price this styling is everything is done you just have to change the content again just click on publish and again you can come over here and instead of yearly let's go to content let's change the title to yearly first and we can select monthly or yearly whatever option you have created for that okay once you do that thing you can just click on update and this section is also completed now only two sections are remaining and those two are really simple one so this is the first one location section so to create this section first we can simply copy this title come over here click on add a new section and paste in the title over here change this title and subtitles so this is your title this is your subtitle or subheading then after that we just need this data center option and we don't have to create this thing again come back to this elements option and search for world map you'll see this option drag and drop it below this title or below this heading and this is automatically created for you you just have to add wherever your data center location is added so whatever hosting you're using we are using a2 hosting go to a2 hosting website and see what all data centers they're using most times you'll see singapore usa those kind of data centers so once you see that thing just click on that instead of this name just to change that name and you have to enter the latitude and longitude code for example if this data center is also available in mumbai i'll click on add item and i'll give it a title of mumbai and you need the latin long code of mumbai so you have to go to a new website called latlong.net and over here you have to type in mumbai or whatever place you're searching for now click on enter or just click on find here you'll get the latitude and longitude code copied from here come back to this website paste it under latitude copy the longitude code and obviously paste it under longitude and now you'll see this option this data center is added in mumbai now click on update again just make sure you add some padding at top and bottom so click on edit section go to advanced and let's add padding 125 both at top and bottom now scroll down at the bottom and here you have your footer section which is again a very simple section click on add new section and add a single row now for this again you have to copy this title and subtitle you can do one thing you can copy it from uh the first section this time copy it from here paste it over here and just enter your own title and subtitle okay so this is your title paste it under title make make sure it is center aligned go to description copy your description paste it under description all right now go to style and make sure you just delete this wrapper we don't want any wrapper now we need to change the color of this thing to white but before that let's add this background thing let's add this cloud divider and let's change the background color so again we'll click on edit section go to style change this background color to this color now go to shape divider only for top so select top and type clouds okay this is how this thing will look like you can also make it bigger if you want you can add some height it will make it even more bigger i really don't want to do that i'll just go to advanced and add some padding at top and bottom so 125 pixels both at top and bottom once it is done we can again come back to this option and change the color of this to white both for title and for description all right now click on update again you can copy the buttons from top here as you can see is a button copied from here come at the bottom paste in your button do some changes on this button for example if you want to change the color background color to white you can do that text color to this color you can do all these things and click on update all right so with this your homepage is now 100 completed now we can do one thing we can come back to our dashboard and let's very quickly import all the other pages that we need so first of all we need to create our about page so hover our pages click on add new again i'm saying we won't be creating this entire page from scratch which is we just will be importing it give it a title of about or about us and publish this page once it is published click on edit with elementor now click on import template go to my templates let's import few templates so again if you open the file that you have downloaded in the media folder you will see another folder called files and in this you'll see all the file that you need to import your about page contact page all the other pages your domain page fax page support page all the pages so one by one you just have to import all those things so click on this import button click on select so under media select the files folder and select about page click on open register as you can see about page is successfully imported now simply click on insert and this entire page will be imported and inserted for you okay as you can see now whatever changes you want to make simply click on that and we have already seen how to do changes with all these options all right so you can change the content according to your website now click on update again again come back to your dashboard and let's create our next page which is your contact page so again hover over pages click on add new now let's enter the title of contact again click on publish and once it is published click on edit with elementor now again repeat the same process click on templates go to my templates import the contact page template from here which is this thing now click on open once it is successfully imported you can click on insert now this is how it will look like first click on update now here you won't see these two options need support and sales inquiries uh let me show you first how this actually looks like if you go to pages and if you go to your contact page which is this so this is how this thing should look like now you can do one thing come back to your dashboard click on contact option from the left hand side you can simply copy this contact form uh url from here come back to this website and instead of template select editor and paste in this option over here and this is how your page will look like okay do the same thing with the second option okay sales inquiry select this option instead of template select editor and paste in the same option over here or paste in the same shortcode over here now click on update now let's create our next page which is your domains page from where customers can register domain so we have a dedicated page for domains okay like this one so to create this page again hover over pages and click on add new now you can type in anything under title i'll just type in domain click on publish again click on edit with elementor follow the same process click on this add template go to my templates import this domains page template which is so here select this click on open once it is imported just click on this insert button and your domains page is also created obviously now you can go ahead do some changes if you want now click on update again come back to your dashboard we have three more pages to create so however pages click on add new this time let's create a plans page hosting plan space so you can name it anything hosting plan shareholding you can name this page anything you want and after that just click on publish edit with elementor now again click on add template go to my templates and now import this template your plans template hosting plans page which is for your hosting plan page select this option click on open and again once it is successfully imported simply click on insert and this page will be inserted and imported for you okay this is how this thing looks like we'll see later on how to change the link of all these buttons for now you can just click on update and we have already seen if you want to change the features and all how you can do that again come back to your dashboard now if you want to create a support page and fax page you can do that as well if you want to create a support page give it a title of support and publish this page now click on edit with elementor now these things are not really compulsory but if you want to create these pages i want to give you all the options available now click on this option go to my templates and import this support page template which is over here select this option click on open now simply insert this template over here and this is how it will look like all right again you can do some changes if you want and finally let's again come back to your dashboard and import our fax page so first we need to create the fax page so give it a title of fax publish this page click on edit with elementor click on add template go to my templates and import this template as well here it is fax template select this click on open and now click on insert so all the pages are now 100 completed now again come back to your dashboard now and to do one more thing i want to import two more templates and let me explain you for what so if you see we have created this mega menu if you hover over hosting you see this option if you hover over pages or elements you see this option this is a mega menu you can create these options as well using templates i'm not doing that because this you know designing thing is getting very long i don't want to stress this thing anymore longer because our main aim and main purpose of this video is to you know is to cover the technical part whmcs part okay so i'll just import it so click on templates click on import templates choose file and select these two files mega menu hosting and mega menu pages first one by one mega menu hostings mega menu hosting's page then after that again import template this time mega menu pages okay click on import again i'll show you how to use these things if you want to if you go to if you go to this option for example the one that we have just imported which is so here as you can see classy pages and classy hosting you can also view this page in a new tab as you can see when i view this in a new tab this is how this template looks like so we'll add this template under this option under this hosting option as you can see the same template is created over here so let's see how we can use this thing so to use this thing first we'll have to create a new menu because we have not yet created any menus so to create a menu you have to hover over appearance and click on menus now first let's start with our main menu which is this menu so let's give it a title of main menu or primary menu anything you want and click on create menu now select all the pages that you want in this menu so i want the home page about page contact page domains page for sure and plans page and maybe also fax page and support page whatever web pages you want not support page maybe let's select all these pages you can also rearrange these things if you want if i can bring this domain over here i can bring this plans over here you can also change the title so instead of plans i'll type in maybe uh hostings or maybe wordpress hosting i'll type in wordpress hosting over here now once this is done you can simply tick mark this option primary menu and click on save menu now if you open your website in a new tab let's see how it looks okay as you can see you have your menu over here now let's select template for mega menu so that whenever someone hovers over any of this option you can display that mega menu so maybe i want to display under let's see under wordpress hosting so i'll select wordpress hosting and i'll take mark this option mega menu and here we'll select mega menu with template and select this template so we have selected we have seen this thing classy hosting select classy hosting and click on save menu now if i come back over here refresh this page if i hover over this option now as you can see this is working if i hover over wordpress hosting this is the mega menu now suppose uh under about i want to add those pages mega menu i can go to about again tick mark mega menu and select this option mega menu with template and select that template which is classy pages and click on save menu again if i come over here refresh this page now if i hover over about this is how this thing looks like so this is how this mega menu is created now we need to create one more menu which is your top menu as you can see this is your this is basically a menu so to create this menu again we'll come back over here click on create a new menu and i'll name it top menu you can name it anything you want click on create menu make sure secondary navigation is stick mark over here now go to custom links now first of all you have your mobile number so whenever someone clicks on this uh it will automatically dial this mobile number on the cell phone if they're using a cell phone so if you want to achieve this thing under url you have to type in tell colon your mobile number suppose this is my mobile number i'll type in this thing and under link text however you want to display your mobile number maybe i want to display it like this okay now click on add to menu you can also add some icons with this like we have added over here as you can see so to add this icon you can again come back to this option select icon item select menu icon item and search for that icon for example here we want the phone icon and maybe i want this icon to select this option okay the second option is your email so whenever whenever someone clicks on this thing it will automatically open some mail application or it will automatically open you know google or something like that so to do this thing under url you have to type in mail2 after that put a colon and enter that email address so maybe it is email gmail.com something like that you have to enter your email address obviously i'll copy the same over here click on add to menu and finally if you want you can also add some page link so maybe i want to add this support page link which was okay we have not yet maybe let's add this contact page link click on copy link address paste it under url and type in contact click on add to menu again if you want to add some you know link with this click on this option icon with this suppose if i want any support icon maybe i want to i use this icon i can select this thing you can also change the icon color if you want whatever icon color you want you can select this option let's make it 6a 62fp our primary color for these two icons as well come over here here it is icon color then for top one as well icon color now you can simply go ahead and click on save menu again if you come back to your website and refresh it okay as you can see this is how it looks like okay i think we did not put any icon to this email address so let's very quickly do that as well select icon and let's select envelope icon for this one okay now again click on save menu come over here refresh this page you have your icon will obviously make it left align don't worry but this is working as you can see i guess now let's see how we can create the footer because our footer is blank we want to add something like this in the footer and right now if you see your footer is blank so to add your footer to create footer under appearance click on widgets now here as you can see we have footer one two three four so under footer one first thing we need is this option your about option so i'll copy this link come over here and search for about if you scroll down you will see this option about option whm ces d yes i don't know what all you'll see is about option but if you don't find this thing simply press ctrl f on your keyboard and search for about scroll down here as you can see you have this option select this select footer one click on add widget now what you want is your title we don't want any title i want to type this under description you can upload your icon or your logo from here let me upload this logo this one select this click on open click on select file then after that you can enter your map of basically you can enter your location your email address phone number everything from here so location this is the email address i'll just click on copy link copy email address and copy telephone number then after that copy this number paste it over here and click on save now after that i also want to display this social icons so you can again come come over here scroll down you will see this social option which is so here at the bottom again select footer one click on add widget and you don't have to do anything we have not yet added any social links but later on in this video when we add you can see those social links over here then after that all these options that you see this company about services these are just simple links so if you also want to add these links you can actually do one thing first of all and we have to do it under footer too so search for custom html which is so here drag and drop it under footer too and now again open your media folder and here you will see this option footer menu custom html open this and this is how it should look like copy everything from here paste it over here under title for example we want this title company paste it over here and obviously if you want this is simple links so this is the text about and if you want to link this text with some link or you can or some page link or anything you can just replace it you can replace your link with this hashtag for example if i want to replace the about link with my about page i can copy link address come over here instead of this hashtag i'll type in this link okay click on save so this is how this works you have to do the same thing you have to add two nav to custom menu in the footer two two custom menu in footer three obviously if you don't wanna add two if you wanna add one it all depends on if you don't wanna add anything again you can do that as well and finally if you want to use this newsletter you can again come back to this page and here you can search for newsletter which is over here select this option i want to add it under footer for click on add widget and you can give some title or some description so this is your description paste it under description this is your title okay now click on save again if you come back to your website and refresh it now if i scroll down at the bottom as you can see everything is now working fine now very quickly let's do the final customization of the website so as you can see your header looks a little bit different your foot also looks a little bit different we have not added our copyright text we have not changed the logo and also to do these final customization you will come back to this page you will hover over fox from the left hand side and click on theme options now first of all you have your general option under your general option you have to upload your logo so click on upload logo and let's upload this logo select this click on select file you can upload the same logo under retina logo and after that if you want you can also upload your fav icon if you have your fav icon so i'll select this option click on open click on select file now click on save once you do this thing we have some more options under header click on header which is your second option here make sure you display all these uh icons okay if you want to display it for example here as you can see for in the in your header you we are displaying all these icons so if you want to display that you can select this thing click on save then after that you have your footer click on footer now here we have to enable few things we have to enable this payment method so here in the footer as you can see you can enable these payment methods now whatever payment methods you want to enable just select those options from here maybe i want to add i want to enable these payment options then after that you can add your own copyright text over here for example copyright 2020 niya's shake anything like that okay and make sure this back to top button is also available now click on save now let's add a social media link so click on social media i'll just enter my website link everywhere but you just have to enter your you know all your youtube link facebook link all those links now again click on save and finally to do some changes in the color that will make changes on your header in your footer and all you have to go to this color option so click on color let's start with the topic i'm not going to cover this color a lot because this is there's a lot of option as you can see over here i'll just show you some basic i'll give you an idea about how this thing works and you can do some changes by yourself so first option is your top header here as you can see in our demo website in in our top header we don't have anything in the background our background color is white and our text color icon color is this black color so i'll do one thing under background color i'll select white for this also i'll select white and let's see then border color we do have border as you can see over here but it is very light so i'll make it e e okay very light border color then after that as you can see menu link color what is your link color so here so all these things are your links so i'll add this color maybe black color or two four two four color two four two four two four this will give you this black color i'll copy it then when you hover over that what color you want maybe some color like this or you can add your primary color over here social media icon color uh what color you want so these icon colors what color you want you can select that again i'll select black and if you hover over that what color you want again you can select that thing as well shortcuts icon again i want black color and for hover icon i can select this color so as you can see this is how it works if i save this page right now and again if you come back to this page and refresh it okay as you can see this is how this thing works so this is how it works now similarly you can do the same thing with your you know with your main menu with your footer and all if you scroll down you will see your header again for this also i want white color background border bottom color again we want simple e e e this gray color sticky border also maybe i want the same gray color then after that you have your menu link color so link color i want this black color and after that link hover color you can add some color like this active color also you can add some color like this again if i scroll down save this page again come over here refresh this page okay now as you can see this is how this thing looks like so you can control this thing you can do same with footer you can see how this footer looks on this website the background color and everything can be changed from here so this is how this thing works now again come back to your dashboard all right so with this the entire designing process is now 100 completed now it's time to jump on to whmcs and do all the technical things for example we have created these plans we have just added all these uh details but let's see how we can actually add how we can actually purchase we have already purchased hosting reseller hosting how we can create different slabs and how we can sell them to our customers so all the important things we'll see right now so to do that thing okay so to do this thing we need to do one thing we need to install a new software on our website so just like we installed wordpress on our website now we need to install this new software called whmcs on our website and this is going to be the most important part of this tutorial but i'll make it really easy for you so you don't have to worry about that now to do this thing open a new tab and type in my dot a2hosting.com client area dot php basically you have to come to your client area and you have to log into this account and here you will see all the things that you have purchased so we have purchased this option reseller hosting launch reseller click on this option now when you click on this option you will get several options for example here as you can see you have your name servers all the different options are given to you now the one thing that we need to do is we need to click on this link login to cpanel i'll open this link in a new tab all right so this is your cpanel now again under search option you have to search for subtaculous app installer so we have to use the same subtacular app installer to install wordpress and to install any other software now we have to search for from the left hand side under search option search for whm cs all right you will get this option click on this option now click on this install button and make sure you have selected https so that your website is secure now we cannot install this new software on this domain name because we have already installed wordpress on this domain name so what we can do is we can install this new software in a new directory so in in directory option type in something like billing all right something like that you can type in support something else this is just you know the extension this sub domain type of thing so i would recommend you to just type in billing over here now data directory name this is just the name of the folder wherein your data will be saved and you can see this folder will be created over here you can see the location then after that you have your cron option cron job we'll change this option later on for now just let it be as it is then after that enter your company name so my company's name is for him media you can obviously enter your company name admin folder name the by default the name of the admin folder is just admin if you want you can change this thing if you don't want you can just leave it as it is now your company email address is this email address so if it says billing at your at your website name for example here it says billing airhosting.com so remember one thing you because it says this email address so here we have to create this email address so make sure you remember this thing now you need to enter your valid license key your license key for this software whmcs so to get this thing again come back to your client area and if you go back to your services click on my services now here you should see this option whmcs license starter if you don't see this option don't worry you can do one thing you can click on my services or not my services click on services and after that click on view available add-ons now under this option at the left hand side you should see this option additional services click on this option and here you'll see different licenses we need the basic one whmcs license starter select this option and click on order now now this is saying ten dollars but once you click on order now and once you click on continue this will become zero dollar for you because this is free with this package so you don't have to purchase this thing don't worry about that obviously i'm not going to do checkout because i already have this thing but you will just see zero dollars over here click on checkout and you will have your license code now as soon as you do the checkout you will receive the license code on your email address let me show you right so as you can see i have received this license code so you just have to copy this license code from here go back to your website under sub calculus app installer paste in this license code scroll down now you have to change your username so under your username type in something unique something unique username now make sure you don't type in admin or username anything like that over here type in something unique then after that you can set a password or it has already generated a password for you if you want you can click on this key icon this will generate some password and if you want to keep this password just save it on your computer or if you want obviously you can type in your own password i'm going to type in my own password over here now once you have entered your password after that you can enter your first name last name and after that you have to enter your admin email address now remember as you can see we have one email address so here admin at near hosting.com and another one over here billing at neohosting.com so after we do this setup we need to install or we need to create these two email addresses all right so remember this thing now once you have entered all this information scroll down at the bottom and click on install now click on update password if you want now this software is getting installed on this website okay so as you can see this is successfully installed now you can do one thing you can open both the links the first link what this link will do is this this will show you this software which is this whmcs software okay this is how it looks like now as you can see it has your website name now your hosting.com billing if you click on fam media nothing will happen right now because we have not connected both the website what we want to do is when someone clicks on fam media or home they should be redirected to our main website which is this website but because this website is not yet connected this is not happening the second link is your admin link or your dashboard link so we have seen our dashboard for wordpress this is your dashboard for wordpress and this option is your dashboard for whmcs so enter your login details and click on login okay so this is how your dashboard will look like and as soon as you log into your dashboard you will get this quick setup wizard this is very important for now we can skip this thing you can come back to this screen and you can anytime have that setup wizard for example if you want to again see that setup visit you can click on this range icon or you can hover over this wrench icon and click on setup wizard and you will see this screen we'll do this thing uh later on before that let's do one thing let's first connect both the websites okay then the new website that we have created this billing website and our main website so to do this thing come back to your dashboard and hover over settings and click on whmcs bridge now here you have to enter your whm csu rl which is this url that we have just created neshik.com billing so whatever you have entered under in directory that is what your url will be so i'll type in this url over here basically your website url will be your website name slash billing okay now scroll down at the bottom under footer select none and click on save settings now once you click on save settings you have to go to help and here as you can see this this will create a new website link for you so basically if you open this website link in a new tab let me explain you what is happening right now all right so right now what is happening is you will see this screen over here and if you see properly this screen and let me bring this screen this screen and this screen looks very much similar okay as you can see here it says home store announcement knowledge base contact us and this search icon for this search bar for your domain name search and here also same thing home store announcement so what this has done is this has connected this website with your website and to do this thing it has this has done one thing this has copied this entire thing from here and it has pasted this entire content in this new url as you can see whm whmcs bridge so here also the same thing happen and here also will same thing will happen now if i see this option and here if i click on fox now as you can see i'm getting redirected to my main website which means that this is successfully connected now when you see this screen for the first time it might look a little bit different for you so if you want to change the designing of the screen again you can come back to your dashboard and you can hover over fox and click on theme options and here again under color if you scroll down you will see this option related to let me show you here as you can see wm uh whmcs bridge so if you want to do some changes for example this is the background color header background color which is this header so if i want to change the header background color to maybe suppose white color all right i can do it like this and after that header search button background color so this is your search button background color if i want to change this thing to maybe suppose black color i'm just showing you that you can redesign it like this then transfer button background color this is your transfer button as you can see so maybe for this button i want some other color maybe this color or maybe this color you can select this option then you have some more options like tweet border back button background all these options okay so all this color can be changed from here now if i just save this setting from here come back to this website and refresh it and now as you can see everything is successfully changed this entire thing is become white so that is the reason why we cannot see that let me do one thing once small changes can be done over here i just wanted to show you that this is how it is done so again come back to this option your ws whmcs bridge and instead of white let me select this this color again if i scroll down click on save come back to my website again and refresh it okay now as you can see this is all changed so this is how you can do some changes over here now any customer can come and they can now register a new domain name for example if a customer wants to register this no domain name is shake dot com or dot org dot net they will have to first enter this captcha so they will have to enter two q 9 or whatever the captcha says and then then they can click on search and now as you can see they will be redirected to this page and here they can do this do some more things so we have some more options remaining but before that let's do few more things so before that i want to do one thing i don't really like this captcha i don't want my customers to put in this captcha every single time just to search for a new domain so let's first get rid of this option so to do this thing you have to come back to this screen whmcs admin basically your website name slash billing slash admin and here you will click on this wrench icon or you will hover over this wrench icon and click on system settings now click on general settings this might ask you your password again click on enter your password and click on confirm now under basic settings first of all make sure you can you have your company name email address everything proper here if you see your domain name and if you see only http over here make it https for example if you see it like this this is right now http colon your website name so make it https okay very important again scroll down under this option as well whmcs system url here also if you see http only http like this make sure it is https okay and click on save settings or save changes very important setting then you have your second option localization no need to do any changes ordering again no need to do any changes now domain and all right now just come back to this security option and here you will see this is the captcha they are using i would recommend you to just select this option to always off and click on save changes now again if you come back to this website and refresh it let's see the changes and now as you can see that captcha is gone now anyone can just enter that domain and they can follow the same procedure now let's do the second thing if i if you remember just few moments ago i have explained you that we need to create two different email accounts so let's see how we can do that so for that again you have to come back to your cpanel so uh select this option we have selected this launch reseller near hosting.com click on manage and under this you will see this link login to cpanel open this in a new tab and over here under search options search for email accounts which is over here select email accounts and here we have to create these two emails so click on this option or click on this button plus create now the two that we wanted to create the first one was billing at nayashik.com or near hosting.com whatever your website name is so billing at yourwebsitename.com now you can set a new password for this i'll just set this password now for storage space i would recommend you to just keep it at 250 mb that is more than enough no need to make 1gb or 2gb like that just keep it at 250 mb then after that go ahead go ahead and just click on create and just like this your first email is created as you can see billing at near hosting.com now similarly to create another one click on this plus create button this will be admin at newerhosting.com again set a password for your email account you can change this space i would not recommend you to do that and again click on create and with this both your email addresses are now 100 created then after that again come back to your cpanel and we have to set one more thing in this option in the search option search for cron job okay chrome jobs or whatever it is click on this option scroll down you will see one chrome job is already created for you just click on edit i as i said earlier we'll be fixing this thing so right now we are fixing this thing now under common settings select every five minutes and click on edit line this will be saved and now here you should see something like this as tricks slash five which means every five minutes now again come back to your cpanel now once you do these settings now we can install or now we can do the basic setup of whmcs and to do this thing come back to your whmcs admin panel now go back to your home page you should already you should automatically see this setup wizard again i'm saying if you don't see this setup wizard however this wrench icon and click on setup wizard you'll see it over here now let's click on next to fix this thing now first of all you have to give your company name we have already entered our company name over here now we can upload your logo so for this i'll just upload this logo this theme logo now for email address we have already created this email address so that's great enter your address i'll just enter mumbai something enter your country name and after that again click on next then the second option is your payment option so basically whenever customer comes to your website and they try to purchase any hosting or any domain names what all payment options do you want to give them so we want to give them paypal option we want to give them credit debit card option basically there are many 50 60 different payment gateways available like for india we have cc avenue paytm pay you many different payment gateways here this is because just a basic setup we are getting only one option paypal after we complete the basic setup we'll enable some more payment gateways so for now just enter your paypal email address and this will be fine now click on next now because we want to sell domains to sell domains first you have you must have enorm account so make sure this thing is enabled this will automatically create a new enum account for you and you can tick mark what all domain extensions you want to sell so by default they are giving us five options.com.net.org dot biz and dot info obviously we can go ahead later on in this video we'll see how we can sell some more domain name extensions for example dot in for india dot nc for new zealand you know those kind of domain name extensions or dot store dot shop those kind of domain name extensions now the default price for these domain name extensions are is 14.95 but later on again we'll see in this video i'll show you step by step how you can have different price for different tl tlds or different domain name extensions for now you can just select this option and click on next now because you have tick mark this option enorm option in the next step you have to enter all your details and this will automatically create a new enom account for you so first of all enter your name then after that enter your email address then after that enter your address enter your city name enter your state name then after that enter your postal code your country name and your phone number so i'll i'll just enter some random number don't try to call on this number and after that your desired username so whatever username you want you can type in that username and your desired password select this option after that select this option uh you know security code favorite teacher favorite pet maybe i'll select this option enter my answer and click on next now i have already created an account with this option so if i click on next i'll get some error here as you can see a login with this email address already exists so i can simply click on this option login using as existing account and i can enter my details over here now if i click on next this will accept it just like this now here you have to enter your basic web hosting details like your host name email your username password all these details so under your host name if you want to get all these details again come back to your client area and here you will get all your details so if you see this is your host name simply copy your host name from here come back to this website and paste in your host name over here now you need to enter your username which is given over here this is your username everything is given just have to copy paste copy your username paste it under username now you have to copy your password which is present over here i will dealing this thing or i'll unhide this thing copy your password paste it over here and click on verify connection now most of your times it will just say access denied but you don't have to worry about that we can manually enter all these details so if you if you click on verify connection it will enter all these details automatically if it does not happen we can enter these details manually let me show you how first of all you have to enter your server name so this thing is just your server name if you copy this much paste it over here this is what your server name is so before this dot super cp.com this is your server name so whatever is before uh dot c super cp.com this is your server name then your primary ip address now to get your primary ip address again you have to go to your cpanel and in under your cpanel you will see your shared ip address this is your primary ip address copy it from here come back to this screen paste it under primary ip now to get your primary name server and your secondary name server come back to this page your name server page or your client area page and here you will see four name servers are given for you just copy the primary and secondary one so copy your name server number one paste it under primary name server copy your name server number two and this is obviously your secondary name server once you enter these details now click on next now once you click on next you will see a new option which should say market connect so with market connect what you can do is you can connect your website with this market and you can sell all these extra add-ons so code guard site log weebly these are some extra add-ons that will see how to sell on our website so selling these you can make some extra money now once you do all this information or once you enter all this information simply click on next and with this your setup is 100 completed now you can click on finish i guess now it's time to do the most important thing about this tutorial that is creating different packages so as you can see here we have designed this thing but this is just a design so this does not do anything uh if you see even in the demo website we have designed this thing but these are just simple design this will not actually do anything so if a customer clicks on this nothing happens so right now what we will do is we'll actually create these packages and we'll have different slabs so in if a person pack purchases one package we will set this option that one they can create one website they will get 10 gb web space so that is the main thing that we are going to do right now so to do that thing again you will come back to your dashboard to this whmcs dashboard and here you will see this option which is over here this wrench icon select this wrench icon and click on system settings now here you have to search for this option product and services which is over here if you don't see this option just search for products and services and select this option now before we create any single product or any single hosting package will we have to first create a new group so to create a new group you'll click on this option create a new group and you'll name your group anything so for example here as you can see the placeholder says shadow string this is just to give you an idea so i'll give a title of wordpress hosting so you can create different groups to sell different types of hosting for example shadow sting you have vps dedicated hosting those type of hosting but obviously for the sake of this tutorial to keep everything very simple we'll be using and we'll be creating only one type of hosting then you will see your headline and tagline we can just leave these things not really important just leave them and we can also leave this template option because we are using a custom theme and a custom template so these things are again not really important so you can just skip them now available payment gateway if you remember in this setup wizard we have one payment gateway that is paypal basic later on in this video i'll show in fact in the very next step i'll show you how we can add some more payment gateways once you do all these things just click on save changes now before we create any packages under this option under this group or wordpress hosting let me do one thing let me add some more options or let me add some more payment gateways so to do this thing what we'll do is let me open this option in a new tab let's open this admin panel in a new tab now to add new payment gateways again you'll hover over this wrench icon and click on system settings so basically this system setting is the most important thing about your website you will be doing most of the things from this page now here you have to search for payment gateways which is so here click on this option now click on all payment gateways and here as you can see we are already using paypal basic now there are so many different payment gateways for different countries for example here as you can see different payment gateways are available if you're from india for most of you guys in in india i would recommend you to go with cc avenue which is very easy and it has a lot of options so you can accept net banking credit card debit card all those options using cc avenue and there are some more payment gateways whatever you like you can go with that now for this demo purposes we'll use stripe which is the most easiest option so select stripe and make sure stripe is enabled over here now instead of display name stripe i'll type in debit slash credit card now to enable stripe you have to enter the publishable api key and you know secret api key and to get that thing open a new tab and type in dashboard.stripe.com now enter your email address and password for your stripe account and click on login and once you sign in you have to click on this option developer from the left hand side and click on api keys now copy your publishable key come back to this website paste it under publishable key now copy your secret key obviously again do the same thing come back and paste it under secret key now click on save changes right so we get some errors so if you get any error like this that invalid url it basically means that your website somewhere is saying http and not https so to fix this thing you can come back to this page whmcs page and here you can do one thing you can again hover over this wrench icon click on system settings click on general settings and make sure this is https not http both at top and also at bottom here also make sure it is https under whmcs whmcs system url and domain name both at both places it should be https select this option and click on save changes now once you do this setting again you can now come back over here and try it again click on save changes and this time it should accept this thing now it says successful now again let's do one thing let's cut this thing come back to this page and let's go back to our products and services so again hover over wrench icon click on system settings and here you have your products and services click on this we have created this group wordpress hosting now let's first click on this edit option for this group edit this group so click on this pencil icon and make sure both the payment gateways are enabled you now click on save changes now let's come back to product list so click on this button back to product list and let's create our first product or let's create our first hosting package so to do this thing click on create a new package now you have to select the type of hosting that you are creating obviously we are creating basics obviously we are creating just basic shadow string or wordpress hosting so just select this option shadow sting now the group name that we have created is this wordpress hosting so make sure you have selected this option the second option is product name now for the product name i want to do one thing let me first open my demo website now in the demo website here as you can see we have created three different packages or three different products startup drive and turbo so i'll copy the name startup paste it over here now under module make sure cpanel is selected and make sure this hidden is off if you select this thing if it is on no customer will be able to see this package so make sure this is often under module you have selected cpanel then after that click on continue now in the next step you have to type in the description of the product like what all features are available in this product for example i'll simply copy few uh first few features from here and paste it over here just like this okay and after that just click on save changes now again let's come back so click on back to product list and let's create a second product so so to save some time i'll do one thing i'll click on this option i'll click on this uh button basically duplicate the product now select this startup plan because we want to duplicate this product and new product name will be drive plan here as you can see i'll type in drive and click on continue now all these settings will be same we just need to change the product description so here earlier it was you can create one website 10 gb of web space all these things here you can create more you can create five websites you are getting 20 gb web space and 50 000 monthly visitors these options so i'll come over here replace these features now click on save changes again again you have to come back to this option so click on back to product list now again click on duplicate a product now this time let's duplicate the drive product and for the new product name it will be turbo i'll copy this product name paste it over here click on continue now once you do this thing again we just have to update this option so this time you can create unlimited websites you have 40 gb or 30 gb of web space 100 000 monthly visitors all the latest features i'll paste in over here again click on save changes now this thing again will not work right now to make this thing hundred percent complete we have to come back to client area and we have to login to whm so you'll see this button login to whm open this link in a new tab again and now we have to create the same packages under whm so you'll see this option over here right over here add a package if you don't see this option from the left hand side search option search for package and click on this option add a package now for the first package i'll name it startup and if you open your website here as you can see with this startup plan a person can this person will have 10 gb of web space and 500 mb of bandwidth so under disk quota i'll type in 10 000 which is 10 gb if you want to get this thing you can just go to google and type in mb to gb and you will get it better let me show you mb to gb so 1 mb as you can see is 0.001 if i type in 10 000 over here 10 000 megabytes is 10 gigabytes so i'll type in 10 000 over here now for the bandwidth here as you can see bandwidth says 500 if you see this page this person is getting 500 bandwidth so that is the option that we are setting over here i don't want to give maximum i don't want to give unlimited ftp accounts i just want to give maybe two or three ftp accounts again i don't want to give unlimited email accounts like a person cannot create unlimited email accounts like billing at name.com account and your website name.com because this is the most basic package so we don't we want to give them all the unlimited features here person maybe can create only two email accounts and for max quota per email account i reduce this to 250 mb max databases i want them to be to be able to create only five databases and i don't want them to be able to create more than five sub domains and this is very important under max add-ons make sure it is zero so that they cannot create more than one website okay if you add four they can create more uh one plus four website so that is five websites we don't wanna do that now once you do all these settings go ahead at the bottom and click on add and with this your first plan is created now we have to follow the same procedure again click on add a package from the left hand side now for package number two which is drive for this we want to give them 20 gb so 20 000 uh bandwidth maybe let's give them 5 gb okay max ftp account maybe i want to give unlimited email accounts unlimited databases unlimited everything is unlimited now under max add-ons type in four so they can create five websites with this so five or four you can type in this option over here again go at the bottom and click on add now let's create our final package so click on add a package under package name type in turbo now for this i want to give disk space as 30 000 or 30 gb here it says 40 but i want to give them 30 because 40 is a lot i don't want to give them that much and for bandwidth also maybe i'll i want to give them 50 gb of bandwidth rest everything will be unlimited this time even add-ons will be unlimited so that they can create unlimited websites alright now again go at the bottom and click on add with this all your packages are created if you click on packages from the left hand side click on edit a package you can see all the three packages are successfully created now again you can come back to your whmcs whm cs page and click on back to product list now let's do some more changes step by step so first select startup plan select this package click on this pencil button now go to pricing let's set the pricing for this package now for the pricing i don't obviously don't want to keep it free i don't want a one-time payment i want a recurring payment so i want to enable two options because here in the demo website as you can see if a person purchases monthly they will have to pay 8.99 for startup but if they purchase yearly they will have to pay only 5.99 for startups i want to enable monthly and annually okay now for monthly i want them to i want to charge them 8.99 for the startup plan and for annually as you can see 5.99 so 5.99 into 12 will give you 71.88 so i'll type in 71.88 or 88 over here now you can go ahead at the bottom and click on save changes do the same thing with the other packages also click on back to product page select the second option drive go to price recurring enable monthly and annually if you want you can also enable semi-annually if you want for six months now for monthly here they have to pay 14.99 and for yearly 8.99 so monthly i'll type in 14.99 and annually it will be 8.99 into 12 which is 107 888 so 107 now click on save changes and finally for the third plan we'll click on back to product list uh and this time turbo edit this option go to pricing select recording monthly and also annually so monthly if they if a person purchases monthly plan they will have to pay 19.99 and for yearly 14.99 so monthly 1999 for yearly let's see 14.99 into 12 179 888. so i'll type in the same thing 179.88 once you do this thing click on save changes now we have to do one more thing you have to go to module settings now under module settings make sure first of all under module name cpanel is selected because if you remember earlier we had used cpanel and this is the option that we'll be using to give it to our customers then the second option is whm package name under this thing also make sure turbo is selected because we are editing the turbo plan and if you remember we have created these three plans over here drive uh startup and turbo so basically right now we are linking this whm package with this package that you're creating over here so if you're creating turbo package under module name also make sure you select turbo then at the bottom select this option automatically set up the product as soon as the and the second the second option as soon as the first payment is received so as the as soon as the payment is received this package will be activated for the customer so select this option and click on save changes then after that if you want to add some custom fields which is not recommended just leave it for now then just go to upgrades so if a customer wants to upgrade they can select this option i i don't want to select anything over here because this is the highest plan but if you have to select the upgrade option for the lower plans like the startup and drive plan now if you want to give free domain name with this plan you can do that for example if you want to give free domain name if a customer selects annual plan so you can select annual plan and you can select this option offer a free domain name registration and renewal will be normal so when when they renew they'll have to pay that price but for the first year you can offer them for free and you can select what all domain name extensions you want to offer so basically i would recommend you to just offer if you're if you're planning to offer free domain name this offer.com but i would recommend you not to do this thing just leave it as it is don't recommend or don't give free domain names now click on save then you have the other option so under other tab we don't have anything useful over here if you want to enable affiliate payout i know for affiliate program and all very complicated thing not part of this tutorial so we'll skip this thing now go to links and now these are the links that we'll be using at the end of the video to link these packages with the designing process so when a customer comes and if they click on select right now nothing happens as you can see i clicked on select and nothing happened so later on in this video we'll copy this link and we'll use it with this link so whenever custom clicks on this link they will be redirected to some other page and they will be purchasing this plan for now just click on save changes after you click on save changes now click on this button back to product list now let's do some remaining settings for turbo and for startup and drive so first select startup and click on this edit button now under startup we have done all the settings we have we have done the pricing as well now come to module and under startup module make sure under package name you select startup and for this also select this option automatically set up the product as soon as the first order is received our first payment is received not order click on save changes now come to upgrades and if a person has purchased startup plan we want to give them upgrade option to drive and turbo so that they can upgrade their plan to drive plan or turbo plan so make sure you select these two options and click on save changes now again just click on back to product list and finally select this drive plan so select this plan and click on this edit plan button we have already seen these settings just come to module setting and again under package name make sure drive is selected because we are creating for the drive package again select this option second option automatically i set up the product as soon as the first order is first payment not order again and again i'm saying that thing as soon as the first payment is received now go to upgrade now if a person is if a person has purchased drive plan we want to give them an option to upgrade to turbo plan obviously not to start up because that is not an upgrade that is a downgrade so we want to select the turbo plan click on save changes again alright guys so this was the most important part of this tutorial we have completed this thing as well now come back to your whmcs homepage which is this page now let's do one thing if you remember we have enabled selling domains that is that we can sell domains on our website and we have enabled.com.org we are selling these domain names but we have done one thing we have made the price of all the domain names at or 1499 something like that but in reality you are getting all these domain names at different prices so basically when a customer purchases this domain name they are purchasing from enorm which is the main company that is selling this domain so right now what i want to do is i want to change the pricing of each domain name extension or each tlds so let's see how we can do that to do this thing again you can click on this wrench icon or you can hover over this wrench icon and click on system settings now under system settings search for domain pricing which is so here select domain pricing and we have enabled all these options.com.net.org.biz.info and the price of all these domains is same if you scroll down at the bottom you can give a certain price for all this domain like a single price for all the domains under bulk management but obviously that is not at all recommended because as i said earlier we are getting all these domain names at different prices so let me actually show you what all prices we're getting these domain names for so for com if you click on pricing here as you can see uh you're just giving them the pricing or you're just giving them the option for 14.95 for net also if you select pricing same price for all the other pricing same price now do one thing go to enorm dot com now over here we have to log into this enorm account so if you remember while doing the quick setup setup wizard we have created an enorm account so you have entered some email address and some password you have to enter the same email address and password here first click on my account enter your email address and password and click on login and here you will see all these different options reseller quick links under this option you will see edit domain pricing click on this option and here are the real pricing the main pricing so as you can see dot com you're getting it for 9.98 if a customer is registering for suppose 15 and you're getting this for around 10 dollars so your profit will be ten dollars or five dollars okay fifteen minus ten five dollars now if you see some other domain name extensions for example dot me selling for twenty three dollars so you're getting this domain name extension for twenty three dollars and obviously you don't want to sell this for 14.95 because if you do that you are losing 10 dollars so we don't want to do that so you can see these pricings from here and you can do some changes on your website if you want to add some domain name extension right now we have you know these five ones i want to do one thing i want to add dot in because that is very common especially in india people purchase that a lot if you don't find this domain name i can find it over here but if you don't find this domain name extension simply press ctrl f on your keyboard and type in dot in okay and you will see all these domain name extensions which is so here now here as you can see you're getting this domain name extension for 1750 which is pretty expensive and they are giving you some recommendation that if you want to sell this thing sell it at 24 or 25 dollars something like that so if you want to do this thing come back to this website and under at tld type in dot in now once you type in dot in select this option enorm and click on save changes now you can click on pricing and you can enable first-year pricing now the register fee uh as you can see they are recommending 24 but you can charge anything about 20 1750. so that you make some profit so instead of this option instead of zero obviously i'll type in maybe twenty dollars okay for transfer and renewal also twenty dollars select this option go at the bottom and click on save changes similarly for all the other domain name extension as well for example let's see dot bsn dot info they will be at top because they are very common and very famous if you don't find them again press ctrl f dot base which is over here let's see okay so you're getting this domain name for 17.70 and here we are selling it for 1450 okay so we don't want to do that so select dot base click on pricing and instead of this i want to type in maybe 21 okay and go ahead at the bottom click on save changes now similarly you can do the same thing now make sure you select this thing epp code so that your customers can get tpp code if they want to transfer their domain names in future they can do that now we have some more options like id protection email forwarding dns management if you want to enable these options as well they will customers again will be charged if i scroll down if you come back and this time select this option edit product pricing and here as you can see for id protection you are getting this first 375 so you can sell it for some other price so first of all make sure you enable id protection if you just tick mark this thing it will be selected for all the option now for id protection i want to do one thing scroll down at the bottom at the bottom right corner you will see id protection price we are paying 375 so maybe i can charge maybe 575 for this okay click on save changes similarly for email forwarding and all these options if you scroll down let's search for email forwarding okay email services email forwarding so we are not uh we are not getting charged anything email forwarding is zero dollars so this is a free option so we can enable email forwarding for all our customers similarly if you want to enable dns management again come over here type in dns and let's see for dns management you you're getting charged five dollars and if you enable you want to enable this thing you can come over here under dns management you can type in something like seven dollars or 775 750 something like that okay click on save changes and you can enable this dns management as well once you do all these things just click on save changes and now you can come back to your website so again let's come back to whmcs dashboard now if you want to create different coupon codes for your customer you can do that as well that is also really simple you can just select this option click on this wrench icon and here you can search for promotion you will get this option promotions and coupons click on this to create a new coupon click on create new promotion type in the coupon code so i'll just type in free something like that okay this is just uh for me so i want to later on in this video i'm going to show you a complete process how a customer will do this thing so if i want to give them some discount for you know promo code and all i can select this thing percentage i want to give them 100 discount so under value i'll type in 100 or 100 if you select instead of percentage if you select you know fixed amount that will be hundred dollars minus hundred hundred dollars discount but i want to select percentage hundred percent discount now to what all services or products it is supplied i want to select all the products from here all right so this applies to all these products or services now scroll down at the bottom you can also select a start date and expiry date for this domain if you want and under maximum use i'll type in 1 so that i only i can use it and no other people can use it so i'll select this option and click on this save changes button and with this your new promo code is created i'll show you how to use this thing now before we proceed further let me actually show you one more thing if a customer comes to your website and if they click on any or let me just go to this whm bridge whmcs bridge so here if you come back to this page here you'll see there's some changes on this website for example here you can see these links knowledge base announcements if you click on announcements there will be nothing present over here because this is the default setting but if you want to create your own announcements or if you want to create your own knowledge base uh which you might have seen on some other if you go to any other hosting company click on knowledge base you can see what that is okay basically how to do how to install wordpress how to install ssl those kind of knowledge base or simple articles so if you want to create these things you can do that from here again from the whmcs dashboard so for that you'll see all these options under support so you'll see this support option and when you hover over that you can see this announcement you can see the knowledge base simple one is announcement so let's see that first click on announcement and one announcement is already created as you can see if you scroll down if you come back to announcements option here it says thank you for choosing whmcs this is the default announcement i obviously want to delete this thing so i'll click on this delete button click on ok now if you want to create your own announcement click on add new announcement and whatever your title should be so i'll just give it a title of demo title okay and you can type in some text over here let me copy some dummy text paste it over here so whatever your text is now i'll scroll down and tick mark published click on save changes now if i again come back to this page and refresh it and now as you can see this domain or this announcement is created similarly to create different knowledge base you'll again hover over support and click on knowledge base now to create knowledge base make sure to first create different categories you can go to some other hosting company and you can see the knowledge base you'll get an idea so i'll click on category maybe this is related to technical things so i'll type in technical you can go to different domain hostings and you can get some idea about how to type this thing or you can even you know refresh just copy the content rephrase it yourself okay and under description you can type in some description i don't want to give any description just title click on add category now i want to add some article in this category so i'll click on add article or give it a give it any name for the article for example how to install wordpress now click on add article and make sure you select the category so this is under technical category now i'll come to come back over here and i'll type in all these steps how you can install you know wordpress or whatever the topic is you can also in include or you can also insert some images videos if you want so if you you if you want you can simply record a youtube video and you can link that video here you can install or you can upload images you can just type in some simple text over here so all these options can be done once you're done with this let me again just copy some dummy text paste it to here once you're done with this click on save changes now again if you come back to this website if you click on knowledge base now here as you can see one category is created technically if you click on that okay we have one article how to install wordpress so this is how this thing works now for this support which is very important how a customer support for example if i'm i'm a customer i have purchased something from your company from your hosting company obviously i need support from you if i have any problem i'll contact you i'll raise a ticket and i'll ask you for example i'm not able to install ssl certificate i'll contact you and i'll ask some help from you so your customers can easily do that by raising a new ticket so here as you can see they have this option my support tickets now they can come to this option they'll have they'll have to first enter the email address and password once they log in they can now raise a new ticket now once there is a new ticket you will get this option and you have to set up a billing department or support department for that so that you get this email and you can help them now if you don't have any experience or anything like that don't worry whatever question you get you simply forward this question to your support team for example you have purchased this hosting from a2 hosting you can go to support click on tickets let me open this in a new tab and whatever your customer has asked you question copy that question paste it over here open a new ticket and they will help you out once you receive the reply just paste in the reply to this customer so that is how easy it is now to create a support department first let's see how we can do that you can click on this wrench icon again and here you can search for support and here you see as you can see support departments click on this option enter your password click on confirm password now for general enquiries this is not hidden i'll create a new department click on add new and i'll type in technical department now you can give some description now under email address you have to type in the email address where all these questions will be sent so i'll actually i'll create a new email address for this support at nigerhosting.com or whatever your website name is now you can also assign some admin for that so maybe i'll assign myself because obviously when you're doing this for the first time you don't have a big staff or a big company or anything like that you're probably the only guy who will be handling all these things so make sure you select this option and we want to allow this only for clients if anyone has any question if they have not registered or if they have not purchased any plan we don't want to provide them any support so this is only for clients you can do some more settings over here and click on add new department obviously once you create this email account you have to actually we have just entered this email account we have not yet created it so to create this email account you have to go to this option we have seen this several times you have to again go back to your cpanel click on login to cpanel and over here you have to create a new email account we have seen this several times but let me very quickly show you again click on email accounts click on create email enter support at nearhosting.com enter some password and click on create email this email will be created and if you want to visit any one of these emails just click on check email for example i'm visiting what is this admin hosting.com i can click on check email i'll click on open and here as you can see you can see all the different emails but you don't have to worry about that for billing and for tickets uh you don't have to come to this page you will see all those options over here you if you select this option support option and if you click on support tickets whenever a new ticket is raised you will see those tickets over here now you can click on that and you can respond to them so this is how this thing works everything will be covered everything will be you know controlled from this dashboard whmcs dashboard oh yes now let's finally do one thing let's see how we can sell market connect with our website or how we can integrate market connect with our website so with market connect you can do one thing you can also sell some extra or some additional add-ons like website security website backup and all these things and you can make some more money with these add-ons so doing this thing is also really easy you have to again come back to your dashboard whmcs dashboard click on this wrench icon and over here you have to search for market connect which is so here select this option click on enter and you have to create a new account so click on this option or click on this button login slash create account and let me do one thing click on this option create a free account enter your first name last name your company name your email address and enter some password for your email address and click on create account now if you want to save this obviously you can click on or save now click on ok and so easily as you can see you have created your account this is your link this account is linked to this email address as you can see now first of all you have to do one thing for example if i want to start selling code card now which is a website backup add-on i can simply click on this button start selling click on activate now you can also see the pricing if i click on ok now click on manage now go to pro products and here as you can see there's different options whatever option you want to sell you can simply tick mark that from here and you can also control your pricing for example for 1gb you're getting this for 158 per month you can sell it at 2 9 or increase or decrease the price from here you can click on this button pencil button you can increase or decrease this price you can also activate or deactivate any particular plan then you have some more option you can select it like this as you can see this is activated whenever you want to deactivate it come back simply click on this button similarly if you want to sell this option site lock click on start selling and again click on activate once it is activated click on manage and again go to products and you can change the pricing and all so this is selling for free a site lock lite plan is free for other plans you can control the pricing for that and click on this option now remember one thing to sell or to enable this market connect an enorm account you must first add some deposit money to to their account so if a customer is purchasing this option for example if a customer is purchasing 5 gb personal plan which is selling for on your website which is selling for 350 dollars per month so your account must have some money so that when they purchase basically what is happening over here is when a customer is purchasing your purchasing okay so whenever a customer is purchasing actually you're purchasing this option from market connect at 263 and you're selling it to the customer for 350. so you must have some money you know as deposit with these guys so to deposit some money you can click on deposit funds and here you can deposit any amount you want twenty dollars forty dollars the minimum amount is twenty and the maximum is five hundred whatever amount you want to deposit select this and click on make deposit similarly on enorm as well come back to that enum page now here also you have to deposit some money so you can select this amount whatever amount you want click on refill account and here also you can deposit some money as you can see the minimum price over here is 25 dollars and maximum is 3 000 so you must deposit some money over here so that your customers can purchase domain names and if they want they can also purchase these extra add-ons okay so with this all the basic settings in fact all the settings related to your website is 100 completed now finally one more thing is left let's see how we can add link to this website so right now if you click on this if a customer clicks on this select button nothing happens so let's see how we can do some changes so that whenever whenever customer clicks on this button they are actually redirected to the plan page so to do this thing actually first go to your whmcs bridge plan or bridge page open this in a new tab and open your dashboard in a new tab so let me actually do one thing let's add or let's open two different tabs in one tab i have opened my dashboard in other tab this option now click on order hosting now over here you can see all the different plans that we have created now if you notice one thing the currency right now is this indian rupees so if you want to change this currency instead of indian rupee us dollar anything like that you can always come back to this page wsn whmcs dashboard click on this wrench icon and search for currencies click on this and here you can see the default option is inr i can click on this edit option instead of inr i can make it usd change the logo okay suffix also i'll change this option you can change the converter you can change the format and all and click on save changes now you can again come back to this page and if you refresh it now as you can see everything is now on in dollars so we have to now copy these links and paste it with this option so we'll come back to this option click on templates and select let's see let's select the yearly template so click on edit with elementor so these are the templates that you have created but right now if i click on select nothing happens so first click on select uh go to footer and here you have to paste in this link so this is for startup plan so i'll see here is your startup plan right click on this button order now click on copy link address come over here paste it under link now go to your second option which is your drive plan click on drive come back to this option right click copy link address this is your drive go to footer paste in this link similarly for the final plan select this option this is your turbo plan copy link address come back to this page and select the third plan go to footer and enter this link header says startup this is not startup this is our turbo plan and here under header it says again startup not startup this is your drive plan so this is working now if i click on update this is how it works similarly i would recommend you to go to some other pages that you have created for example if you go to pages we had created this plans page click on edit with elementor and do the same changes over here if you scroll down here as you can see startup geek pro you can change do the same changes click on this option go to footer and paste in the link now once you do this thing hundred percent everything is completed now finally let's see how a customer will do the checkout so right now i am a customer i come to your hosting page i scroll down maybe i'm interested in yearly plan drive options i'll select yearly drive click on select now as you can see once they click on select they are automatically redirected to this page here they can if they want they can register a new domain name suppose they want to register this domain name or new year one two three or nia shake.com something like that they can see whether this domain name is available and this is what they will have to pay if they want they can also use the existing domain name so suppose this person wants to use an existing domain name fam dot in they can click on use after that they can click on continue and they're automatically redirected to the next step now here in the next step as you can see because they have selected the drive plan they're getting five websites 20 gb web space all those options now if they want to sell change the plan instead of monthly and annually they can do that and this price will automatically change from the right hand side and because we have created these extra add-ons now this customer can choose any extra add-ons if they want once they have selected these options they can click on continue and here they can see all those things they have selected they have selected startup light which is a site lock light which is not costing them anything drive plan which is costing them annually 180 now because i have this promo i can just enter this code and click on validate code and i'll get hundred percent discount as you can see hundred percent discount it says hundred percent one time discount now i don't have to pay anything i can click on checkout now this customer will have to enter the details so whatever detail let me very quickly enter some details over here okay so i have just entered some dummy details over here after that i can go ahead at the bottom select paypal or credit card whatever option i want to select and click on complete order and now as you can see once the order is completed your customer will get their order number now they can click on continue to client area and now they have their own client area just like we have okay we have purchased hosting from e2hosting we have our client area this person has purchased hosting from your company and they have their own client area and you can see the link as well now they can do all the things that you can do which all we have seen throughout the video they can go to services they can go to their own cpanel they can control their own domains and all they will get their own options okay so this is all working this is active they can click on this plan and let's see what happens okay as you can see they have all these options now they can log into their cpanel they can manage all these things if this person wants to log into this cpanel they can click on this login to cpanel button and now they are redirected to this page now you can do one more thing under cpanel here it displays cpanel logo you can display your own company logo so to do this thing let me show you very quickly how you can do that come back to this page come back to your whm option so log into whm and under this option search for customization and click on customization now over here you can change your company name so let me type in for him media you can enter you can change the help link documentation link and you can upload your company logo so let me upload this logo click on open you can upload your webmail logo you can upload your fav icon so i'll select this option and after that click on save now once this settings is saved again if this customer comes to this website if they refresh it now as you can see instead of cpanel it displays your company logo now this customer can do everything what other people can do and here as you can see they got this 20 gb space everything is working fine okay because we have created these packages they got the exact same option that we configured we configured 20 gb space in the drive plan so that is the reason why they're getting add-on domains we had selected five domains so that is the reason they are getting so everything is working 100 fine also one thing once they sign up with your account they will receive this email address with your own logo as you can see this is your own logo and they will receive all the details like their username their password they will receive their server name server ip name servers all these options okay so they also receive their server names name servers all these options on their email address so this is how this thing works all right guys so finally with this this entire tutorial is completed i hope you guys enjoyed this tutorial i hope you find this thing helpful now if you enjoyed this tutorial if you want to watch more useful tutorials like this one make sure you subscribe to my channel and click on the bell icon so that you don't miss any future updates if you find this video helpful give a thumbs up to this video share it with your friends on facebook twitter whatsapp whatever social media platform you use and throughout the video if you have any doubts any comments any suggestions for me you can always leave them in the comments section below thank you so much for watching this tutorial see you in the next one

Channel: Nayyar Shaikh

Views: 268,645

Keywords: reseller hosting, web hosting, reseller hosting tutorial, wordpress, wordpress whmcs integration, wordpress whmcs, whmcs, whmcs tutorial, how to resell hosting, how to resell hosting services, how to create a web hosting business - whmcs tutorial, how to start hosting business, how to start hosting company, how to sell hosting services, how to sell hosting, how to sell web hosting, white label hosting reseller, white label hosting

Id: eK0J4K30xe0

Length: 175min 5sec (10505 seconds)

Published: Sun Oct 25 2020