website design software tutorials
i'm gonna show you how to make a website stepby step. i'm gonna show you how to make a website step by step. with no steps skipped.well, the bad news is someone's gonna get fired. the good news is i'm gonna show youhow to make an amazing website step by step with no steps skipped. this video is partof our free website giveaway series. our winner was ted from eco star painting. let's go checkout his website. so here is ted's brand new website that i'm gonna show you how to makewith absolutely no coding knowledge necessary. we're gonna show you how to put in this logo,this menu, these social icons, which lead him to the social media pages, and i'm gonnashow you how to insert this slider with these main points on here. i'm gonna show you howto do this call to action right here just
in case people get sold from the main pointsand they just wanna call ted. your call to action should always be front and center.i'm gonna show you how to put in these three feature boxes, there's ted right there, andhere some of his other points. and i'm gonna show you how to make this call to action arearight here where it says learn more about our services. so you can click on that andhere we have another call to action up here just in case after they're done with the servicesthey see that they indeed need a pressure washing so they can call right up here. i'mgonna show you how to put in these different features and services that he provides. i'mgonna show you how to make an about page and, again, this is all without coding. this isall done in word press, which is a content
management system used by people like cnnand forbes and jay-z, katy perry and most professional web developers. it also has a56% market share, which means that it has lots of support from all over the world andmany different designs to choose from. so i'm also gonna show you how to make this,put in this picture, and make an estimate page because maybe people wanna contact himbut they want to know how much something's gonna be. so we have his information and i'mgonna show you how to make this box. and this get a quote within 6 hours. so if you fillout this form you can get a quote within 6 hours and ted will get back to you, so that'spretty cool. and we also have his service area over here in this sidebar area. that'swhat it's called: sidebar. so, again, you
don't need to know... have any experience,you just have to be willing to learn a little bit. super easy. this works on a mac, it workson a pc. you don't need any special tools or software, again, no coding, and this ismobile friendly. so if we resize this it will actually resize and everything will look reallygood. so it works on a smartphone, it works on a mac, it works on a pc, works on an iphone,ipad, any android devices, any mobile phones. so it's really, really great, really versatile,and really amazing. so before we start our exciting adventure, let's get a little todo list going so we can set sail in the right direction. so here's our to do list. the firstthing that we need to do is get a domain name. that's the same thing as your website name,so that's like www.yourewebsite.com. i'm sure
you've seen this before, like www.google.comor yahoo.com or microsoft.com or apple.com. so a domain name costs approximately 13 dollars...13 dollars yearly... yearly. so that's every year, you pay 13 dollars to get and registeryour domain name. so you register in your name, you own it, but it costs 13 dollarsyearly. the second thing that we need to get is hosting. so hosting is where you actuallystore all of your content, information, and pictures. so you can have a website name,but without hosting your website will just come up blank. so it's really important tohave a... both a domain name and hosting so that your website comes up and you see allof this really cool content. so hosting is basically a computer that's on 24 hours aday that holds and stores all of your content.
so hosting costs about 10 dollars per month.so 10 dollars a month for hosting and 13 dollars a year for your domain name. these are theonly two costs that are necessary in order to have a website. everything else is optional.alright, then after that we are going to install word press. so word press is free. word pressis used by, again, professional web developers. what word press is is it's a content managementsystem, which just is a fancy way of saying it helps you manage your content. so insteadof having to know all this coding and stuff, you can just type out what you want and youcan do it just like microsoft word where you just type in, drag in pictures, and you, youknow, rearrange things. it's really easy. so that is free, so that's awesome. thankyou word press people for doing that. then
we're gonna install a theme and what a themeis, it's the design of your website. so if we look over here we see that this is thisgray color and there's a big picture image right here and there's this box and thesefeatured images. that's the design of your website, that's called a theme. so it's, youknow, different websites can have different themes and they can look completely different.so that's another reason why word press is so good is because many people build themesor designs for them. and, yeah, it looks pretty awesome. so that is free, so that's reallyawesome that someone built this for you for free. then we're gonna install a plugin...install plugins. and what plugins do, they extend the functionality of word press. soby default, if you look over here, this form
doesn't come with word press. this form righthere where we fill it out and it emails you. it doesn't come in word press by default,but someone built it and all you have to do is install it, so that's pretty awesome. somost plugins are free, but we did install one that helps you add content visually, evenmore visually than before, and that cost 25 dollars, but that's optional. so 25 dollarsoptional. then we're going to add all of your content. so that's like your text, your images,this map, everything. so adding your content is obviously free, however, you can go andbuy stock photos. if you see on this website that we made right here, this is a stock photoand so is this and so is this, so... what we actually did is we purchased these stockphotos for ted and we put them on the website.
so that does cost money and we'll show youwhere to do that, but most of you will probably have your own photos. some of you will needsome stock photos. so that's free, sometimes it does cost money, that is optional. so that'soptional. so the total cost of everything is... comes out to 23 dollars, but i am gonnashow you how to get 35% off. so it's gonna come out to less than 20 dollars to start,so less than 20 dollars to start. now, that's pretty amazing considering that a regularweb developing firm would charge you thousands and thousands of dollars to make a websitelike this, especially to make an estimate form. so that's really awesome. so the wayi like to think about it is each of these different steps is a puzzle piece. so thereare 6 steps to the puzzle and once you put
all of the pieces together it creates a beautifulpicture and that picture is an awesome website. so why don't we take care of the first twopieces to the puzzle, which are getting our domain name and getting hosting. luckily,we can do this at the same place and that is hostgator.com, so let's go ahead and dothat. so we can go to www.hostgator.com. now, there are thousands of hosting companies tochoose from. i like host gator the best because they have really good prices, they have 24hour support, and they have a live chat, which is really cool. live chat right here. so youcan click on this. it does take, you know, a few minutes to... for them to answer you,but they answer you via live chat and that's saved me many times when either i can't geton the phone or i just don't want to. so that's
really cool. and they have unlimited diskspace, which means they're not gonna cap you at only uploading a hundred pictures, youknow, they'll... you can put a thousand on if you wanted to. and they have unlimitedbandwidth, which means that if, you know, a thousand people came to your website they'renot gonna just shut it down because you have too many people coming to your website. sothat's really why i like host gator. i haven't tried all of the hosting companies, but ithink they're the best. they have really good reviews online, so check it out. so afteryou get here you can click on web hosting right here and then it's gonna off you somedifferent plans. so we have a hatchling plan, a baby plan, and a business plan. so i'm justgonna go over them. the business plan is just
too many things, i think. you don't need itright now, you can always upgrade later. so, really, your choices are between a hatchlingplan and a baby plan. so the hatchling plan and the baby plan, the difference betweenthem is the hatchling plan only allows a single domain. so, like, www.yourbuisness.com. youcan't get any more domains. you can't have your friend's business, your mom's business,or, you know, a client's website. you can't have any of that. on the baby plan you canhave unlimited domains. so you can have your website, you know, you can make a websitefor your friend, you can make a whole bunch of websites. so if you know that you're onlygonna have one website, then going with the hatchling plan is the way to go. if you knowthat you're gonna have multiple websites,
then you can go with the baby plan. you canalways upgrade from the hatchling plan to the baby plan, but i personally have the babyplan so that's what i'm going to recommend. so what i like to do here is i like to choosebetween... they give you some different options. the longer you stay with them, the cheaperit is going to be for you. so you actually don't get any discounts s far for monthlyto six months to a year. so if you're gonna go for two years then you start to get thediscount. so what i'm gonna do is i'm just gonna go with monthly, because that's whati personally have also. i go month to month. and then you can click "order now." and anotherreason to go monthly is if they stop providing, you know, excellent service, then you canalways cancel with them. so that's another
reason why monthly might be good. they alsogive you a 45-day money back guarantee. so after you choose monthly, you either go withthe hatchling or the baby. just click "order now." and now it's gonna ask you whether youwant to register a new domain, and, remember, a domain is the same thing as your websitename, or if you already own this domain. so we're registering a new one, so i'm just gonnaput it in here, ecostarpainting.com. now it's gonna tell me congratulations that it's available.you wanna register your domain name because sometimes people can take it and then youcan't have it anymore. so... but this one is available. they also have another optionover here that says, "i already own this domain." so if you maybe went to godaddy or somethingand you registered your domain name there,
then you can click this an you can put inthe name here to get your hosting. okay? it also gives you different options for the .com,.net, .org, .info, .biz. if you're from a different county you need, for example, likea .co, .uk, then you would go to somewhere like godaddy and you would buy it and thenyou would say, "i already own this domain" and you'd put it in here. alright, so that'sthe way to do that. some of the other options it's gonna have is do you want to add the.net for $12.95 more a year. i usually don't recommend that. you don't need to do it. ithink you don't need to have all these names, just focus on one. i think it's better. soyou don't need... you can leave that unchecked. then it's gonna make sure you're confirmingyour baby plan. it's gonna say month to month.
so this will either say baby or hatchlingfor you. month to month it says 20% off, but i'm gonna show you how to get 35% off. thenit's gonna ask for your username. i'm just gonna put in "tyler" here. and then it's gonnaask for your security pin. i'm just gonna put a random security pin. then it's gonnaask for all of your billing information, so your email, your name, and that's pretty straightforward,and your credit card or pay pal. so if you're from another country you may only have theoption of pay pal. anywhere else, you can use a credit card. so that's pretty good.right here it's gonna... they're gonna try to sell you on some more add on's, and letme go through them and explain them to you. any time you register a website name, yourname and address gets stored in a database
for people to look up and see. so if you wantto hide your information and you wanna keep it private, then you can check this to addit on. it's ten dollars more a year. then all of your name and address and phone numberwill be hidden. so i trust people, so i am just gonna uncheck that because we don't needit, but that's really up to you. so you can either add it or not add it. for a sitelock,this adds an extra layer of security to your website. it's $14.99 a year. i usually don'trecommend it and you can add it at any time, so i'm just gonna uncheck it, but that's reallyup to you. this jumpstart your website, i really don't think it's necessary, but that'sreally up to you. so we're gonna keep all those three unchecked. and it's gonna askfor a coupon code. instead of "snappy," we're
gonna do "thirtyfive." so this actually savesyou, instead of 20%, you're gonna save 35%, so it's gonna save you an extra 15% and it'sgonna give me credit so i can keep on making these tutorials. so once you type in "thirtyfive"you can click "validate" and you can see down here that you'll actually get 35% off insteadof 20% off, so that's pretty cool. then it's gonna have you review your order. so you get24 hour live and email support and phone support, account activation, money back guarantee for45 days, you're doing the baby plan or maybe yours says hatchling plan. per month $9.95,minus 35%. no add on's, you may have some here, and domain registration, $12.95. soin total it's 19 dollars and 42 cents. under 20 dollars, which is amazing to, you know,start a business or if you have... you already
have a business, to expand it. so that's prettyawesome. once you do that you just click the "i have read and agree to the terms and conditionsof use," and you press "create account." this next page is just a thank you page confirmingyour purchase, and now we can go ahead and check our email. alright, so now i'm loggedinto my gmail account and we see we have a new email from hostgator that says "your accountinfo." so you can go ahead and click on that. and we see "thank you for your order" andwe see a lot of important hostgator account information. so you're gonna wanna print thisor somehow keep it safe and it has our username, our passwords, our domain name, and a bunchof important information. the most important thing that we need to do now is go to ourcontrol panel, but before we do that let's
look at our to do list. so here's our to dolist. so we got our domain name, so that's done. we got our hosting, that's done. nowwe need to install word press. we need to install word press and to do that we needto log into our control panel. so here's our link right here to our control panel, so wecan go ahead and click on it and it'll open up a new window. and just copy in your username,just copy that, paste it there, and your password. so here's our password, just highlight it,right click, copy, and paste in your password. so once you have your username and passwordin there, go ahead and click "log in." alright, we're now logged in and this is called thecontrol panel or cpanel. we can scroll down and under "software/services" we find "quickinstall."go ahead and click that. now, this is another
reason why i like hostgator is because theyhave quickinstall. usually installing word press is really hard and you have to knowcoding, but with quickinstall it's really easy. it's just one button clicks. so on theleft side here we can find word press. go ahead and click on "word press" and then press"continue." now it's gonna ask us which website we wanna install word press on and since weonly have one website right now, we're just gonna use that. and we're gonna leave thisblank because we wanna install word press on the main website, not slash anything, sojust leave that blank. put in your admin email, i'm gonna go ahead and put in my email fornow, and put in a blog title. later we... i'm gonna show you how to change this. soi'm just gonna put in "eco star painting"
for now and your admin user. because thisis gonna be ted's website, i'm gonna hand the keys over to him, i'm gonna just put in"ted." then click "install now." and now we wait for it to install. alright, so it installsand it says congratulations. you can access it now by going here and it's just a linkto your website. but really if you just... if you just bought hosting, you're gonna haveto wait two to three hours for your website to work. if you bought hosting, like, yesterdayor something, then your website will work immediately. we just purchased our hosting,so we have to wait a couple of hours until our website works. so i'm gonna go ahead andtake a break right now and wait a couple of hours and then come back and then see if itworks. so i will take a break right now and
i will talk to you soon. alright, so now i'mback from my break and it's really important to keep your username and password safe. ifyou lose it, you can either do hostgator live chat or a lot of the times they will emailyou your password instantly after you do this. so check your email, but if you have it righthere, great. now we can go ahead and check our website. so i'll click here and we'llwait for our website to go and there is our website. so you probably just saved yourselfabout 500 dollars. i know some web developers who charge 500 dollars just to do the wordpress installation, which is ridiculous. so we have it here and this is our sample website.we're gonna make it look much better. so there's a sample page on it up here and it's justsample, dummy text. it's not anything real.
so in order to chage all of this stuff, wehave to actually log in to word press. so the way we do that is we go back to our quickinstalland we see that our username is ted and our password is this... this long password righthere, so we can copy it. and what we do is we go to yourwebsite.com/wp-admin. so yourwebsite.com/wp-admin and go ahead andclick enter and it's asking for our username. if you remember, our username is ted, so wecan just type in ted right here, and our password, this is our password. we can go ahead andcopy it and paste it in right there, then click "log in." alright, so now we are loggedin and we can exit some of these prompts. we can, after we've printed or kept this informationsafe, we can actually exit it and exit our email. and basically what i like to do nowis just some website checks to make sure that
we're on the same page. one of the best thingsto do now is to change your passwords. so just click on "users" and find your usernameand go ahead and click on it and scroll down and change your password. so instead of thatreally long, confusing password that you can't memorize, do something that's equally as hardbut easy for you to memorize. so i'm just gonna put in a new password here and i'm gonnaclick "update profile." so now you have a new password to go along with your username.the next thing that i'm gonna do is i'm going to turn of caching. now, you don't need toknow exactly what caching is, but basically it helps speed up your website. but the downsideof it is you don't see your website updates immediately. so what we're gonna do here iswe're gonna go to "settings" and "wp super
cache." now, if you don't see "wp super cache"here, then you don't have anything to worry about, but since we see it here we have togo to it and click on the "easy" tab and turn off caching. again, this is just to make surethat everyone's on the same page. you don't need to know exactly what's going on. so oncewe have caching off, we're gonna click "update status." now, sometimes, but it's pretty rare,this doesn't turn off caching. so you're making updates to your website and you're not seeingchanges and it's really frustrating. so what you have to do if that happens is go to "plugins"and find wp super cache and actually deactivate it and then go one step further and press"delete." so if you're not seeing updates on your website then you need to delete cachingand you can press "yes. delete these files
and data." alright, so now that we have wpsuper cache gone, the next check that we need to do to make sure that our links are setup properly. so we want to go to "settings" and then "permalinks." so "settings," "permalinks."and what this does, it's gonna make sure our links are search engine friendly and humanfriendly. so sometimes when word press installs, it does the default link structure, whichmakes this ?p=123 instead of yourwebsite.com/about or yourwebsite.com/home or /services. so youwant it to have in your page name and not just numbers in your links. so make sure it'son "post name" or something else, but not "default." so just click on "post name" andclick "save changes." so most of you, these checks will be all there, but i just wannamake sure everyone's on the same page so one
one's getting confused about anything. oncewe do that, we can go back to our dashboard and now that we've installed our word presswe have to now get a new theme, so let's do that now. and i think the theme is one ofthe most important pieces to our website puzzle. so let's go over to wpexplorer.com. wp exploreris a company that makes premium themes, which just means there's themes for word press thatcost money, but they also make a few free themes. so let's get a free theme right now.go to "themes" and under "find a theme" let's click "free." and i'm just gonna leave a linkto this, in the description, to this theme so you don't have to do all this, but thetheme is called "tetris," right here. let's click that and then it's gonna say "log into download." so click that and then i'm already
a member, but if you need to create an accountjust type in your username, email, first, last, and password, and continue on afteryou log in. so i'm just gonna log in here and actually head back to themes, free, andclick... where is it? tetris, right here. so let's download it and just throw it on your desktop if it isn'talready and let's head back to our word press dashboard. alright, from here let's installthis theme by going over to "appearance," "themes," "install themes," and let's click"upload" right here, "choose files," and i'm gonna go to my desktop and find tetris.zip.so this is what we just downloaded, gonna open it up, click "install now," and hopefullyit says "theme installed successfully." after that click "activate" and you'll see it activatednow. so if we go to our website we'll actually
see that the whole look of the website haschanged, but we're not quite done installing this theme. what we have to do first is geta few plugins that this theme comes with. so let's click "begin installing plugins"and under the "options framework" plugin click "install." and after it says "successfullyinstalled," "return," and then we have to activate that plugin. so click "activate."now we have to install this soliloquy plugin and this one's going to be a little bit differentbecause if you click "install" are you going to get an error. so let's do this the oldfashioned way and let's copy the soliloquy name, let's head over to google, and typein "soliloquy word press plugin, and it's going to be this top one right here. i'm alsogonna leave a link in the description to this.
and click "download" right here. once it'sdone downloading, throw it on your desktop and head back to your dashboard, go over to"plugins," and we're gonna install a plugin right now, so let's click "add new," "upload,"and let's click "choose files," and let's click the soliloquylite.zip file right here,click "open," "install now." once that's installed, make sure to activate it and you'll noticeyou'll have a new "soliloquy" tab over here. what soliloquy is is the image slider, whichis gonna be on the home page and maybe some other pages of our website. and speaking ofpages, let's jump right into adding some pages to our website. so our pages are gonna beabout, services, the home page, and a get an estimate page. and the menu is gonna beup here and if you click on any of those links
it's gonna bring you to that page. so let'sgo over to our dashboard and let's go to "pages" and let's click "add new." so for now i justwanna add a few blank pages to our website and show you how that works. so let's firstmake a home page. so this is the page that you're gonna get to when you first go to ecostarpainting.comor yourwebsite.com. so i'm just gonna type in "home," i'm just gonna leave this blankfor now and we'll add stuff later, and click "publish." next let's add an about me page.so i'm gonna add, and actually this is going to be "about us," so i'm gonna publish that.then i'm gonna add another page, which is going to be the services page, publish that,and then i'm going to add a page called "get an estimate." so i'm gonna type in "get anestimate" and i am going to publish that.
so let's check out our website and see ifany changes have been made and we'll notice that nothing shows up yet. so let's get thosepages. so right now we do have those pages on our website but we haven't created themenu which those pages are gonna show up on, which is going to be up here, our navigationmenu. so let's do that now and let's create a navigation menu. so let's go back to ourdashboard and let's go to "appearance," "menus," and this is where we can manage our navigationmenus. so we first have to create a new one by clicking right over here and just typingin "main menu." and it actually doesn't matter what you call it. click "create." and thenover here under "theme locations" we have to select "main menu" because we just createdthat. now we have to add all the pages that
we want in our menu to our menu. so let'sgo down here to "pages" and i'm just gonna check off every page that i just made, whichis "home," "about us," "services," and "get an estimate," and i'm gonna click "add tomenu." so you'll see that all of them get added to the menu and if we click "save" andrefresh our website, we'll notice a brand new menu up here. the only problem is i wantmy home page to be first and all of these menu items to be rearranged. so let's rearrangethose menu items by going over to the menu manager and clicking and dragging each menuitem where you want it. so that looks about right. i'm gonna save it and refresh my pageand you'll notice the order of our menu has been changed. there's only one problem though,and that is problem is this home page, if
you go to ecostarpainting.com, isn't thispage right here. it is not this home page. you'll notice that it looks a little bit different,so let's change that. let's make it so when you go to ecostarpainting.com it goes to thispage right here. so right now it's actually going to... by default, word press makes ita blog page. you'll notice this is a blog post right here. let's change it to a staticpage. so let's go over to "settings," "reading," and you'll notice it says "front page displays,""your latest posts," and let's just change that to a static page. so let's click thatand then we'll set the front page to the home page that we created. and eco star paintingis not going to have a blog, which is the post page, so i'm just gonna leave this as"select," which is nothing. so i'm gonna save
that. now, if we go to ecostarpainting.comit will now be the actual home page. so the first thing that i want to change on our newhome page is this right here. it says "welcome to blog of aj clarke" and that, i guess, isprobably the creator of this theme. i just wanna totally get rid of this whole box. soto do that, let's go over to "appearance," "theme options," and right down here under"homepage subtitle" just erase it and click "save." so let's refresh that and that lookspretty good. the next thing that i want to do is change this home page to a full widthtemplate and what that means is it's not gonna have this sidebar right here. i don't wantmy home page to have that. i want it to be nice and simple. so let's get rid of thatsidebar and change our home page to a full
page... full width template. so let's go overto "pages" and let's click the "home" page and under "template" select "full-width,"click "update," and refresh. so you'll notice it looks nice and blank and the first thingthat i want to do is add an image slider. and the image slider is gonna be up here onthe top and in this case it's gonna have some nice pictures of ted painting some housesand maybe some of his work. so let's go over to our dashboard and let's go over to "soliloquy"right here, this is the plugin that we installed, and let's click "add new." so the first thingthat you wanna do is give your new slider a name. i'm gonna call this one "homepageslider." the next thing you want to do before you start uploading your images is changethe size so it fits our website. so our website
width is going to be... or, our slider widthis going to be 960 pixels. so just type in "960" and over here type in "330." so nowwe can start uploading some pictures. so let's click here to upload images and then i'm gonnaselect my files and select this picture right here. so i'm gonna open that up and once that'sdone uploading, and it's taking a sec, i'm just gonna click "insert into slider." soyou'll notice that it shows up right here and let's click "publish." and no changeson our website will be made just yet. we have to set the homepage slider to this new sliderthat we just created. so let's do that by going to "appearance," "theme options," andright here where it says "homepage soliloquy slider" let's click "homepage slider," andthis is the slider that we just made, and
click "save." so now when we refresh thiswebsite hopefully we'll have a brand new slider up here at the top. so let's try it out. andit works. the only problem is is that it's way too long, it's way too big down here.what we have to do is crop this image. so to crop an image in word press just head overto the "media" tab right here. click "library" and click "edit" over the image you want tocrop. from there under the image you'll see a button that says "edit image." click thatand this is where we can crop our image. so what you have to do is just make a generalselection of kind of where you wanna crop, then under right here where it says "selection"we're gonna change it to 960 by 330. this is the size of our soliloquy slider. so theni'm just gonna change... just drag this little
box, this is our crop box, to where i wantto crop the image. so right there looks about right. then i'm gonna click the "crop" button,so that's right here. that'll crop it, but we're not done yet. what we have to do isclick "save" and then click "update." so now if we go over to our website we'll have anew slider and it looks pretty good. but this is not the slide that i wanna use. i was justusing that as an example to show you how to crop an image. i actually have some slidesthat i made earlier, so i'm just gonna add those in. so let's delete this one by goingto our "soliloquy" tab, hitting the "homepage slider" and clicking this minus button righthere. then i'm gonna upload my images. so i'm gonna click here, select files, go intomy folder, which is... first i have to unzip
it and i'm gonna open it right here. so i'mjust gonna upload this slide 1 slide right here, click "open," and i'm gonna actuallygive it a title of "eco star painting," and i'm gonna click "insert into slider." so i'mgonna do that for the rest of these images by doing the same exact thing. so i'm gonnaupload slide 2, gonna insert, and do that one more time. and, actually, i forgot toadd the "eco star painting" title to our... the second slide, so i'm gonna do that byclicking this pencil button right here and editing the image title. and i will show youwhat that title does when we check out our website. so now if we update our website andgo to it, it should have three nice slides and you can slide through each one. and allthe title is is when you hover over with your
mouse you'll see "eco star painting" rightnext to the cursor. so i also wanna show you how i made these... all of this text in thislittle box to show up on my slides. and all i did was i headed over to pixlr.com, that'sp-i-x-l-r.com, went to the pixlr editor, i clicked "open image from computer," and i'lljust use this as an example. so i'm gonna open that up and then all you have to do iscreate a new layer. so i just click this button right here, that'll make a new layer, andthen we have to click this "marquee tool" right here and make a little box. so i'm justgonna click and drag. and i am going to select a white color. you can select any color forthis, obviously, but i'm gonna select a color down here, set it to white, click "ok," clickthe "paint tool," and paint a nice little
white box, and then i'm gonna lower the opacity.so i want this box to be a little bit see through and i'm just gonna click this buttonright here, lower the opacity. then i'm gonna write some text on top of this box. to dothat, just hit this "a" button right here, the "type tool," and then click where youwant your text to show up. so i'm just gonna click right here and i'm going to write sometext. you can change the color by clicking "color" right here. i think i chose a darkgreen similar to this for this website. and you can also change the size and font. sothat's how i did it and you can do that too on your slides. so let's close this up. andthe next thing that i wanna do is start changing some colors on our website. so i don't wantthis box up here to be black and i don't want
this one to be black either and i also wannachange the color of these links. so to do that it's a little more complicated, but i'llwalk you through it and all you have to do is just copy exactly what i do. so we haveto edit some css and what css is is just the... the styling, coding of our website, and you'llsee what i mean. so let's go over to the dashboard, "appearance," "editor," and then you'll see"stylesheet" and it'll say "style.css." so you'll see all this code. you don't reallyneed to know anything about it, this is just the code that makes this website look theway it does. so first thing to do is change this big black box up here and all i'm gonnado is hit "command f" if you're on a mac, "control f" if you're on a pc. that'll bringup this search bar right here and then type
in a number sign and type in "header." soif you scroll down a little bit you'll see this header right here it'll say "/*header*/"and then what you wanna edit is this coder right here. so the background it says numbersign 11. i'm gonna change that number sign to a color i already have, which is that.this code is just codes for your colors. so if you head over to google and type in "hexcolor codes" you'll have all these different options of colors to choose from. you canalso get a custom color by going to a site like this and, you know, finding where youwant how dark, how light. and then what you wanna do is copy this color and then go intoyour stylesheet and paste it in right where this number is right here. it says "background:#" and just paste in your color right after
that number sign. so let's do the same for...well, let's first see if that works. so let's update and refresh. so now we have a nicegreen and that looks pretty good. next i want to do the same thing for this bottom part,which is called the footer. so let's go back to the theme editor and let's hit commandor control f again and let's type in footer space main and then you'll see this littlehashtag and the footer right here and what you wanna find is the background color. soit's gonna say background hashtag 111 and that hashtag 111 is the number we wanna change.so i'm just gonna paste in my color code, and you can paste in any color code you want,and then i'm going to hit "update file." so let's refresh our page and now our footeris a nice green. so now we have another problem,
which is that this menu up here our linksare grey and they aren't really showing up on the green. so let's change them to white.so let's go back to the theme editor and let's type in sf-menu a. and it's not gonna be thisfirst one, so you're gonna have to hit enter again and you'll see this one that says hashtagnavigation dot sf menu a and you'll see right here it says color hashtag aaa. and you canchange this to any color, but i want mine to be white and i already know the code forwhite so i'm just gonna type in "fff" and hit "update file." so let's refresh that andthat looks pretty good. so the next thing that i wanna change is this orange color,i want to change this to a dark green. so let's do that now and let's go to the themeeditor, let's hit command or control f, and
then we have to type in current dash menudash item and it's going to be this top one right here. so it says background hashtage73, so we're gonna change that to a dark green and i know the code so i'm just gonnapaste it in like so and update my file and refresh. alright, so that looks pretty good.it's not a dark green, that's a light green. and there's one more thing i wanna changeup here, which is when you hover over these links i want them to change color, i wantthem to darken a little bit just to give this website a little more action or make it alittle more alive. so let's do that by going to the theme editor and then hitting commandor control f and typing period sf dash menu space a greater than sign and then typingin li and a space, another greater than sign,
and then let's type in space a colon hover.so it's gonna be this one that says navigation sf menu li a hovers. so it says when you hoverthis it's gonna change to white. i want to change it to dark grey. so let's do that bygetting our code, so i'm just gonna copy it from over here and i am going to paste itin like that. so let's update that, refresh it, and see if when we hover over these linksthey change color. and they do, but that is not the right color. so actually i want tochange it to a dark grey, so it's gonna be dfdfdfdf, and that should do the trick. solet's update and refresh and that looks pretty good. alright, so next step is the logo. let'schange this logo into a custom logo. and i'm not gonna walk you through exactly how i madethis logo because i have a video on my channel
on how to make a logo, so i'm just gonna referyou to that video. but once you have your .png file, and you'll know what i mean ifyou don't right now when you watch that video. just head over to "appearance, 'theme options,"and here's where we can upload our custom logo. so i'm just gonna click "upload," "selectfiles," go to my folder, and upload my logo. so i'm gonna open that up and click "select."so once i've done that, hit "save options," and let's refresh. alright, that's lookingreally good now. so after that i want to, before we start adding content on our homepage, i don't want this to say "home" and i actually don't want it to say any of thepage names right here how it says "about us" in this little box. i actually want this littlebox to say ted's phone number and it's gonna
say "call us for a free estimate." so let'sdo that now by heading over to the editor again, let's go to "appearance," "editor,"then what we want to do is go to the full-width template and you'll see that right down here,at the bottom right here, click that. then we're gonna have to search for... let's searchfor page dash heading. and you'll see that right here, it'll say div id equals page heading.and between these h1 tags right there and right there, we're just gonna erase all ofthis where it says php the title and these less than and greater than signs. make surenot to erase the h1 greater than signs, make sure those are little tags that look likethis. so you want it to look just like that and then you can type in your message if youwant to change this. so i'm just gonna say,
"call us for a free estimate" and i'm goingto write ted's phone number. and then i am going to actually copy this because we haveto do it one more time. so i'm gonna update that and that should change the home pagebecause we selected the full-width template on the home page. so let's check it out. let'sgo to the home page and right here it says... i spelled "estimate" wrong, so... but it didwork, so let's change that. estimage. estimate. alrighty. so let's check that out and thatlooks great. but now if we go to one of these pages it still displays this little titleup here, so let's do the same thing. let's go to our appearance editor page and thenwe wanna go to the page template. so that says "page template" right here. let's clickthat, we're going to do the same thing or
just find it right here where it says pagedash heading. let's erase all of this and between the h1 tags i'm gonna type in my misspelledsentence. alright, and let's click "update," and let's refresh this page and see if itworks, and, indeed, it does. alright, so now we're done with most of the styling for thewebsite and we can start adding some content to the home page. and the home page is goingto have 3 columns of images that say some features about ted's company. so let's dothat and before we get started we have to get a plugin and the plugin is called visualcomposer. so if you head over to codecanyon.net and up here type in "visual composer," it'llcome up as this first one right here. and it does cost 25 dollars, but i really likethis plugin. i think it's definitely worth
it. and i'm gonna leave a link in the description,but i already purchased this so i'm going to download it and throw it on my desktop.if you haven't purchased this or are not a member of code canyon you can sign up andpay for this. so i'm going to download it and i am going to throw it on my desktop andclose this up. then you have to unzip it, so i'm gonna double click, and now i havethat folder on my desktop. then we have to install this plugin, so let's go to "plugins,""add new," click "upload," "choose files," head over to your desktop and hit the visualcomposer folder, then open up the "jscomposer.zip" file right here, click "open," and click "installnow," and then after it successfully installs click "activate," and now we have the visualcomposer editor. so to use it let's go over
to "pages" and let's go to the "home" pageand now we'll have a new button up here that says "visual composer," so let's press itand then let's add an element. or, actually, let's add a row. so we're gonna add a littlerow and then let's add 3 columns, 3 images, and some text. so let's do that by making3 columns with this button right here. just hove over it, then select this "1/3 1/3 1/3"button, then i'm going to click this plus right here, and add in a "text block," so"text block," then i am going to delete this text, and then i'm gonna add my title to thiscolumn. so it's gonna say, "hello, i'm ted." and i wanna make this a big font, so i'm gonnahighlight it, hit this button right here, that'll bring up some more options, and theni'm gonna hit this drop down menu and press
"heading 2" so that'll make it nice and big.then i'm gonna make another line right underneath it by hitting "enter" and i'm gonna pastein some text. so paste that in right there and then i wanna add an image. so i'm gonnahit "enter" right here and put my cursor right up here and then click "add media." i'm gonnaupload a picture of ted. so let's upload this. and i'm gonna change this title to "eco starpainting," set the alignment to "none," the link to to "none" because when you click iti don't want it to link to anything, and for the size we're going to use "full size -- 280x236."i already cropped these and i used the same method i showed you earlier to crop images.so you wanna use an image around 280 by 236. click "insert into page" and let's save thatand let's see if that works. so i'm gonna
click "update" and let's refresh this pageand that looks pretty good. so let's do that two more times for the two columns right hereand right here. so the next one is going to be another text block so just click the plus,click "text block," let's add your title, and this one is going to be "protect, renew& beautify," highlight it, make it a heading 2, hit enter, i'm gonna paste in this text,and then hit enter right here, make a new line, and add my picture. so it's gonna bethis one right here, let's change it to "eco star painting" and let's change the link toto "none," making sure to use a full size image around 280 by 236, and insert it intothe page. save it and update it. see if that works. that looks great. let's add one more.plus, "text block," let's add our title, let's
make that nice and big, hit "enter," pastein this little paragraph, and add the image to the top. i'm gonna change the title againand set the link to to "none." so insert that, save that, and let's update that. refreshit and that is looking really good. so the last finishing touch for the home page isgonna be a little call to action button which says "click here to learn about our services"and it's gonna be right below these images and this text. so let's do that. let's headover to the home page and then we're gonna add another row. so let's click "add row"and it'll add a little row right here. then let's click the plus and let's add a "callto action" button. that's gonna be right here. and let's give it some text. it's gonna say"learn more about our services" and i am going
to change the text on the button so it says"click here." and the url, this is where it's gonna be linked to, is gonna be to the servicespage. so i'm gonna click the services page, highlight it, and copy it, the url up here,and i'm just gonna paste it in right there. i'm gonna change the color... or, let's keepit on grey. i think grey will work. and the icon, you can choose an icon but i don't thinki'm gonna use any icons for this one, and the size is gonna be large. and i think that'sall we need to do so let's save that and let's see how it looks. let's go to the home pageand right down here we should have a nice "learn about... learn more about our services."i actually wanna change this button to black, so let's do that. let's go in here, let'sclick this "edit" button right here, and under
"color" let's choose "black." so let's savethat and refresh it. alright, that looks good. it's a little more visible now. so next stepis the about us page. now, the about us page is going to be really, really simple. allit's gonna be is an image of ted, a couple paragraphs, and there may be another callto action right below that. so let's do that. let's go over to pages and click "about us"and then i'm just gonna add in some of this text that i already have. this is dummy textand ted, if you're watching this, you're gonna have to change this into some informationabout you and your company. then i want to add an image on the left side of the page.so to do that, let's place your cursor at the very beginning of the sentence, rightbefore the first letter, click "add media,"
click "upload files," select your file, it'sgonna be this one for me, and open that up, and give it a title of "ted rinshed." setthe alignment, now, this is the important part, to "left." this will make it so it'sformatted so the image is on the left hand side of the screen and the text is on theright, and you'll see what i mean in just a second. let's hit the link to to "none"and then the size is gonna be "full-size 285 x 356." now, i already cropped this one aswell, so if you wanna do a page like this just crop it to 285 to 356 or something similar.insert that and you'll notice that the image will be on the left, the text will be on theright, and then the last thing we need to do is set the template to "full-width" andhit "update." so that looks really good. the
next thing i want to do is add a call to action,which brings you to the "get an estimate" page. so let's do that and let's head backover to the "about us" page. then we're gonna hit the "visual composer." so now our visualcomposer is turned on. let's add a call to action button by hitting "add row." that'lladd a row down here. hit the plus and hit the "call to action" button then it... underthe text let's type in "call ted's number or fill out the form for a free estimate."and then it's gonna say, for the button, it's gonna say "get an estimate." the link is goingto take us to the "get an estimate" page. i'm gonna just go to that page, copy the url,and paste it in, and we are going to set the color to "black" again. the icon is goingto be... let's see if they have a contact
icon or a mail icon. here it goes, mail icon.i'm gonna set the size to "large" and everything else is going to be default. so let's updatethat and let's go to our "about us" page and let's check it out. alright, that looks prettygood. so we have his number and we have "get an estimate." so the next page is the "services"page. now, the "services" page is gonna be pretty simple. it's gonna have a big pictureup here of a nice-looking, freshly painted home, which i found a picture of at istockphotoand i'll leave the link in the description for that. and then it's gonna have a bunchof rows and columns of different services and a small description of each service belowthe title. so let's do that now. the first thing to change is to change this into a full-widthtemplate. so that's done over here. let's
go to "pages" and let's go to the "services"page and let's, under "template," hit "full-width." and the first thing that i wanna do is click"update" and i'm gonna add a new slider. so let's go over to the "soliloquy" tab righthere, let's click "add new," and this one's going to be called "services slider." verycreative, i know. and i'm gonna upload my image, which is going to be this one righthere. i'm gonna change the title to "eco star painting" and i am going to click "insertinto slider" and make sure to change the slider size to 960 by 330, and after that i thinkthat completes it. so let's click "publish." then what you wanna do is go down here andyou'll see this little short code right here. it says soliloquy id equals 41 and it's goingto be different for everyone. what i want
you to do is copy everything including thebrackets, just copy that, and that's called short code. so if we go over to our "services"page, that's gonna be right here, and paste in this short code, it's gonna tell word pressto bring up the new soliloquy slider that we just made. so let's test that out. let'sclick "update" after we pasted that in and refresh our page. so now we have a nice sliderright here at the top. the next thing that i want to do is start adding a list of allof ted's services. so let's do that by adding a new visual composer, clicking that, andthen let's add a new row right below the slider. add a row and then let's start adding sometext blocks. so i'm gonna click this and, actually, it's not gonna be a text block,it's going to be wp text because with wp text
you can give it a nice-looking title. so let'sclick that. "widget title" is going to be called... i'm just gonna paste this in. "interiorand exterior residential." i'm gonna paste that in and paste in the text and click "save."what i want to do is actually add some more columns. so i'm gonna add 3 columns by hittingthis and do the same for the next 3, so... or, the next 2. so i'm gonna add another wptext, paste in my title, paste in my description, save it, do the same, wp text, and add myparagraph, and i'm gonna save that. so let's see if... how that's looking. let's updatethat and refresh our services page, and that looks pretty good. so i'm gonna add, actually,2 more rows of 3. so it's going to be one down here and run right below it of more servicesjust like this. so let's do that. and let's
click "add row," that'll add a row. let'smake it a 3 column, click plus, and click wp text, add our title, and paste in our paragraph.again. oops, i clicked text block, so i'm gonna cancel that and click this "x" to deleteit. click plus, "wp text," paste it in, and paste that. and again. alright, let's updatethat and see if that's working out fine. that looks excellent. let's do one more row of3. so "add row," make it into thirds and click this plus, wp text, and, actually, this oneneeds a period at the end of this sentence so i'm gonna click the pencil tool to editit and add a period. and one more. alright, so let's see how that looks and that looks fantastic. so that's our servicespage. and the next page that we're going to be working on is the get an estimate page.so this page is pretty cool, our goal here
is for someone to either call or fill outa form in order to get an estimate so ted can give people a quote and he can get a lotof business. so the first thing that we're gonna do is we're gonna go ahead and clickon "edit page." so just click on "edit page" and, again, we're going to be using this visualcomposer, so just click on the "visual composer," and we're gonna click "add element." so goahead and click "add element" and the element that we wanna add is a message box becausefirst we're gonna have all of ted's different information here. so we just click on "messagebox" and we actually already have some preformatted information. i mean, not preformatted. wealready have some of his content, so we're just gonna paste this in here. and what wecan do is actually just bold all of this information
here. so just highlight it, bold so it sticksout, so it's really easy for the eye to follow. alright. so we just bold it and then we'llpress "save." and, actually, what we did is we did the wrong message box, so we're gonnaclick "edit" again and instead of "informational" we're gonna do "success." then click "save"and you can see that it turned from blue to green and we'll click "update." and it's alwaysgood to see your progress, so now we're just gonna view our page and see what that did.alright, so it gave us a pretty cool informational box right here. the next thing that we wantto do is make it so that it says "get a quote" right here. so it's gonna have "get a quote"right here and then there's going to be a form to fill out. so i'm just gonna click"edit page" again and i'm gonna add another
element and this time it's going to be a textblock. no, i'm sorry. it's going to be wp text. no, actually, it's gonna be text block.sorry about that. all these text things are confusing me. alright, text block, sorry aboutthat, and we're actually going to write "get a quote within 6 hours." and i'm going thatbecause a lot of people, they want it instantly. so 6 hours is pretty, pretty quick and that'llbe really good. so next what we wanna do is we wanna highlight it and then choose "paragraph"and "heading 1." and then we wanna make it go to the left, so we're gonna click "alignleft" right here, so just click that. and what we want to do now in order for it tomatch the same sort of text that we have, let me show you. in order to have it thissort of text we need to do a little bit of
coding. and i'll give you more resources atthe end of this video on how to learn more coding, but for now you can just type in whatwe want. so we're gonna match this sort of font and in order to do that we need to doa little bit of code. so once you've clicked left and h1, just go to "text" and we needto add some things after the semi-colon right here. so the things we need to add are fontdash family and do a colon, then a single quote, and type in "open" o-p-e-n s-a-n-sand another quote and then a semi colon. so i know this is kinda weird, but that makesit the open sans font, which is the same font as this. if it wasn't the open sans font itwould look more like this. alright, so we do that and then the next thing that we wantto do is the color. so we're gonna do color
and then a colon and then a number or poundsign and then it's gonna be 8f878d. so that'll give us that green color that we're lookingfor. then we'll do a semi colon. the next thing we wanna do is font, f-o-n-t, dash weight,w-e-i-g-h-t, colon 100. what this does is it makes it so that it's not really bold,so it's very light. you see how this text is thin and light and not bold like this?the font weight 100 makes it thinner and lighter rather than 3, 4, 500 or 600, which makesit bolder. alright. so we do that, and don't forget the semi-colon, and after that we'regonna do font size. so that's pretty self explanatory, it's how big the font is. sof-o-n-t dash s-i-z-e and we can do a colon and then we can do 30 px. px stands for pixelsand that's how computers measure things. alright,
then we can do a semi colon and i believewe are done with that, so we can press "save." alright, and it says "get a quote within 6hours," let's update it and let's see what that looks like. alright, so it did it andi must've did the code wrong because it isn't that light green that we're looking for, it'sactually a gray color. so we can actually go ahead and change that to that light greencolor. let me just take my color picker here and get a light green. alright. so what wecan do is we can go ahead and edit this and highlight it and go back to "text" and seeif where we messed up. i think this one is supposed to be an "a," actually. so let'ssave that. oh, there we go. sorry. so it was 8fa78d instead of 8f8. so 8fa. press "save"and press "update" and now we'll have that
nice green color. no color picker needed.so there it is, much better. alright, so our next thing that we need to do is we need toput in a quote form right here, but before that let's actually get rid of this comment...submit a comment, because we don't want people submitting comments here. so we'll go aheadand press "edit page" and we'll go to "screen options" up here, we'll make sure "discussion"and "comments" are checked, then you can minimize this and scroll down and then uncheck "allowcomments," "allow trackbacks," and click "update." now if we go to "view page" we should seethat that comment area is gone, and it is. so there's nothing here now. now it just leavesa space for this contact form, so that's what we'll do next. so we can go ahead and press"edit page," close these pages if we want,
and what we're gonna do is we're going toget a new plugin and this plugin is going to allow us to make a contact form. so wejust go to plugins and click "add new" and type in "contact form 7." that's my favoritecontact form on word press and it's free, so the price is right. then click "searchplugins." now we see this "contact form 7" and we can click "install now" and press "okay."make sure it has good stars. and we can click "activate plugin." alright, now our pluginis activated. we can go back to our "pages." and, actually, before we do that we're goingto go to the contact plugin, so just click on "contact" and we'll see our contact form.so what we're gonna do is we're gonna edit our contact form a little bit. so we can goahead and click on it, and later ted is going
to have to change this to his email addressso it emails him from his email address. alright, so this is how the contact form works. here'sa little bit of html code and some short codes, and i'll explain that in just a second. whatwe want to do, actually, is we want to keep the "your name" field and keep the "your email"field. we don't want them to get a subject field, so we're just gonna take that away.so what we can do is just take this away right here. and we want it instead of saying "yourmessage," it's gonna say "what do you need painted?" or it could say, you know, "whatservices do you need?" that's probably even better. "what services do you need?" alright?because ted does more than painting, he also does pressure washing and different thingslike that. alright, and then we're gonna go
down here and instead of "message body," thisis the email that it sends to us. so instead of "message body" we're gonna say "what servicesthey need." and it's not gonna have a subject, so we can actually get rid of that if we wantto. and here instead of "your subject" we're gonna put "quote form." so it's gonna emailus, the subject is gonna be "quote form." alright, and we can actually get rid of thisand, yeah, that's it. then we click "save." so we've edited our form so that it is exactlyhow we want it, and let's see if it works. so the way we do that is we can just copythis short code right here, this is what contains our form. so just copy it right there andgo to "pages" and let's find our "get an estimate" page and click "edit" and below here we'regonna add another element, so "add element."
and this time it's gonna be the contact formand we only have one contact form here and just click "save." alright. so let's click"update" and let's see if it works. now i can go to "view page" and we see that we havea contact form. so it has your name, your email, and then what services do you need.so we edited it so that it doesn't have a subject in here and we can go ahead and putit in and it will email us, so... so it says "get a quote within 6 hours" and we can dothat. so we can press "send" and then we can go ahead and it says "your message was sentsuccessfully," and that will land in our email inbox. right here has too big of a space righthere for me though, so let's edit that. so let's go to "edit page" again and what i'mactually gonna do is i'm gonna try to drag
this contact form in here so that it doesn'thave such a big page. so just drag it right in and then we can exit this and we can update.and now hopefully if we go and look at it, it will have less of a gap, which it does.so that's much better. much, much better. alright, so now that we have that going onthe next thing that we need to do is put in a service area right here. so i want a bigmap right here instead of all this random stuff. so what i'm gonna do is i'm gonna goahead and edit this sidebar. that's what that's called, a sidebar. so what we can do is wecan go to... back to our dashboard and we can go to "appearance" then "widgets" and we can take out all these widgets. sowe're just gonna take out this one. just click, hold, and drag to the center. and now whenwe check our site, i'm gonna click "get an
estimate," all of those sidebar widgets aregone. so instead of it being gone and blank we actually wanna fill it with a map. so whatwe're gonna do is we're gonna drag in a text or an html so just drag that in, all the wayinto our sidebar, and this is going to be called "service area" because ted only doespainting, obviously, in certain areas. he's not gonna travel across the world to paintyour house. so it's called "service area" and now we need to put in a map here. theway we can do that is we can open up a new tab here and we can go to maps.google.com.so this is a pretty good service that allows you to embed some maps. so i'm just gonnatype in ted's service area, which is calgary, alberta in canada, and what i'm gonna do isi'm gonna click this link button up here and
i'm gonna say "customize and preview embeddedmap." so what i'm gonna do is instead of the width being 425, because that's too big forour sidebar area. hold on, let me resize to fit that area. so instead of it being "medium"here, because the width is too big, i'm gonna actually press "custom" and i'm gonna putit about... the width should be about 250 pixels by 625 pixels. so it's thin and long.so i will put that right here and that looks like it will probably fit right in there.so what i'm gonna do is just scroll down once i have it customized and i'm gonna copy andpaste this code here. so i'm just gonna click all of it, double click or triple click, andright click on it and press "copy" and i can exit this out now, go back to my widgets,right click and paste, and then click "save."
alright, once i do that i can go back to my"estimate" page, refresh, and hope that it works, which it does. so we have our servicesarea right there, which is pretty cool. and we can have this button here "view largermap," but, actually, i don't want that to appear here because i don't want it bringingvisitors off of ted's website. so i'm actually going to get rid of that by going back tomy widgets and finding the code that allows... that displays that. so from this small, soit's a less than sign and then small all the way down to the end to the other small. we'regonna press "delete" and we're gonna get rid of this br also. alright, so it ends in iframewith a greater than sign. then we're gonna click "save" and we're gonna refresh our websiteand we're gonna see that now that is looking
pretty darn good. alright, so we're done withthis page. we're gonna go back home and ted had actually mentioned that he wanted somesocial icons up here linking to his facebook, google+, pinterest, twitter, and youtube.so we're actually gonna go ahead and do that now. we can close these tabs and we can goto our dashboard and we can go to "appearance" and "theme options." now we can click on our"social" tab up here and what we can do is we can find all the different... all the differentsocial media places and we can add it. so here's facebook, so i'm going to go aheadand copy and paste facebook's link, and we can go ahead and find google, i'm gonna goahead and copy and paste his google, and we're gonna find pinterest, go ahead and copy andpaste his pinterest, and i think you're getting
the point of this. and we can find his twitter,go ahead and copy and paste his twitter, and my favorite, which is youtube, we can go aheadand copy and paste his youtube. once we do that we can press "save options" and we canvisit his website and we see that all of his social icons are up here. so we can clickon his page and we can see his social media accounts. alright, that's pretty cool andit opens up in a new tab so they're not navigating away from people, so that's pretty awesome.the next thing that we're gonna do is do a little something that will make it a littlemore seo friendly. if we go over here we can see that the title of this website is "ecostar painting." what we're gonna do is we're gonna add a dash in the eco star and we'regonna actually add his location so that it's
hyper located for people who are searchinglocally. so what we're gonna do is we're gonna go to the dashboard and what we're gonna dois we're gonna go to "settings" and to "general." and now what we're gonna do is we're gonnaput the site title, we're gonna add a dash here and another dash here and we're gonnaadd in his area. so it is calgary, alberta and then we're gonna click "save changes."so now if we go back to his website, and we could do this on any of the pages, we cansee if we hover over this it'll say "get an estimate" then i'll have a pipe symbol, theni'll say "eco star painting calgary, alberta," which is exactly what we want. that's reallygood for the search engines to know that... which area you service, so that's really awesome.now we can go back to the home page. alright,
so now we can check over our website to seeif there's anything that we need to fix about it, but i think we're pretty much done. let'slook. oh, actually, here it says "click here" when it should say "services" or "learn moreabout our services." we can go ahead and "edit page" and go down here, press the "edit" button,and instead of "click here" it can say "our services." services. alright, and then click"update" and visit our site and now i am sure that we are done and completed. just checkit out, it is looking really good. congratulations. you did an awesome job, i'm sure. send meyour website, i would love to see it. the next thing that i want to do is give ted 10tips that i really think will expand and help his business. now, maybe not all these tipswill work, but maybe one of them will be really,
really great and that's the one that i thinkyou should focus on, ted, obviously. alright, so tip number one is to actually partner...do partnerships with real estate agents, interior designers, and general contractors. and iknow that ted is doing this already. he has a list of about 350 real estate agents thathe is actively mailing because real estate agents don't just send you, you know, oneclient. if you get in good with a lot of real estate agents, they can send you 10 clientsa year. so you only need a few of those people to send you a whole bunch of clients, so that'sreally good that he's getting people like that. they can send him a lot of clients.my dad actually does this, he is a contractor, and he has a general contractor that sendshim about 60% of his work. so getting in what's
just, you know, one person that can send youa lot of work is a really good idea. so go meet with them, go be their friends, get toknow them. that is a really killer idea. and ted is already doing that, so good job ted.the second idea i have is to make your own affiliate type program. obviously you haveto check with your laws in your area, but what i'm saying is print out a program thatsays if you send us 10 customers every month you will get, you know, a thousand dollars.if you send us, you know, 10 a week you will get four thousand dollars per month. and peoplecan refer you that way. they can not only refer a really good person, but they can makesome good money, so that's another good idea. or give them a percent of what you earn onthe job. number three, and this one's really
easy, is go to somewhere like craigslist.i don't know how popular it is in canada, but here it's pretty popular. just go on craigslistand put in your website and put in a picture of the jobs you've done and, obviously, apicture of you, ted. people want to see you there. they don't wanna invite someone totheir house that they don't get a good feeling about, but you have a very trustworthy face,so that's really good. so that's tip three. tip four is to do google adwords. i believehost gator gives you about 75 dollars free in google adwords and what google adwordsis is if we go to google.com it's their paid listings. so we can type in "los angeles painters"and we see that there are different ads up here. so you have 75 dollars for free fromgoogle. check and see if that works. that's
a really good idea. and check what other peopleare saying and, you know, don't copy them, but see what is best and definitely take note.alright, so that's tip number four. tip number five is create a mailing list and i know thatted's already doing this. he already has a mailing list of those real estate agent peopleagain. so create a mailing list. you can do this with mail chimp or aweber. both good.mail chimp is free, so you can just go to mailchimp.com and sign up people to your emaillist. so start building a list and start sending people out good tips, you know, good things,and always keep them on top of their mind. so that's really good. also have a real mailinglist, you know, for your past clients, different people, you know, send them something, youknow, physical in the mail. people don't get
that a lot, you know, in these email daysso that really means a lot, especially if something is hand written. so that was tipnumber five. tip number six is create more pages on your website by going to "new," "page"and do it for each of your small areas. so maybe in huntington hills or pembrooke meadowshave a page about that. so maybe put in "painting huntington hills" or "painter huntington hills"and that way people in huntington hills will know that you service their area. so i wouldn'tput in on the main menu right here. i'd put it maybe a whole bunch of different areashere or maybe even here and have links to them, to your main pages. so that's a reallygood idea for the search engines. and i actually did this on my dad's website and he gets many,many calls. so do that. make individual pages
with some good information. not the same informationon every page, but different information on each page about each little area that youdo and maybe even a picture of each little area. go and drive out and take a pictureof west springs, you know, something good there and put it on that page and write alittle bit about your painting services. so that's a killer tip, i think. the next tip,and i don't know if i skipped this one, this was tip three, but anyways, is google analytics.and what google analytics, does, it helps you see how many people have come to yourwebsite. so that is really, really super helpful. so what you want to do is you want to go togoogle.com/analytics and go sign in. and you can google how to set this up or downloadmy book, i show you how to do it and it's
free. i'll just show you my website real quickabout the website data, and here we can see that, you know, 500 people have come to mywebsite. you can see how many people comet your website, you can see where people camefrom. so mine, if we go to sources, you can see a lot came from youtube. i love youtube.a lot came from google, some from facebook, some people directly typed in my url so theydirectly typed in my domain name. and this is really, really helpful to see what marketingis working and what isn't. maybe facebook is not sending you anything but youtube issending you a whole lot, so you want to focus more on youtube rather than facebook. so thatreally, really helps. you can also see what people are browsing. so we have our free websitegiveaway, people like that, and the book page.
so it's really, really cool to see what peopleare doing and it really helps your marketing efforts. i believe that was tip 7. if not,sorry about that. but tip eight is to, when you go out to a job, instead of... i knowa common marketing tactic is to go and put on all the neighbor's door "i'm painting inthe area," you know, "if you want... if you want me to paint your house, basically, giveme a call." i think that's a little corny and a little too pushy. what i would do insteadis go to the neighbor's house and say... and put down a little flier and say, "if any noiseis disturbing you, i use eco friendly paint, but if anything is," you know, "disturbingyou, if you have any smells, just let me know. i'm ted." be really friendly about it andi think that would really help your business.
it'll put a good feel out there for you andthey'll get... really get a sense that you're a real, genuinely nice person and you careabout not disturbing the neighbors. so i'd put some cards out around the city sayingthat you're doing a painting at a neighbor's house but let me know if i'm disturbing youin any way. even though you probably won't be, i think it's a really good marketing tactic.so i think that'll step... that was tip eight. for tip nine is... it's a combination of theaffiliate and the email list. what you wanna do is you wanna use someone else's list. somaybe a general contractor has a list of, you know, 500 clients that he's ever donework with. maybe what you can do is use that list and give the general contractor somemoney to use his list. so rent out his list
of clients and then you can send... you cansend them what you offer. so i think that'd be really cool to do. some bonus tips are,i think it was tip ten, is on this "get an estimate" right here, what you want to dois when someone bids, i think what you should do is you should give them a 30 day openingwhen that bid is available. so the bid expires. this is not only to encourage them to do it,you know, to get your job quicker, because a lot of people will drag their feet, butit also is so that... because prices generally increase over time. so gas is gonna increase,your painting supplies are gonna increase. everything's gonna increase and you don'twant them to come back a year later and say that... "well, you only quoted me 500 dollars,"but now everything's more expensive and it's
gonna cost you at least 500 to do the job.so you want to give them a deadline of when that bid is available so that they're encouragedto do it sooner. and once the deadline is coming to an end you can follow up with them.so give them 30 days and then follow up with them and say, you know, "your bid dead...the quote deadline's coming to an end. when do you want to get this started?" that mightbe a little too pushy, that verbiage exactly, but i think you get the point. another thing,the last tip, is to give them maybe three different prices because some people willbe budget, some people will be high-end, some people will be right in the middle. and whatyou wanna do is you wanna say, "well, for this," you know, "you could do the high-endpackage for this amount or the median package
for this amount or the low-end package forthis amount." and maybe the low-end package will be a lesser quality paint or they'llhave to do some prepping themselves or something like that. so i think it's a really good ideato give them multiple prices in your bid. and i don't know what step i'm on, but i hopethat that helps. and just one last tip is don't stop marketing, even if you're busy.so it's a much better problem to have too many customers than not enough customers.so even when you're busy, keep on marketing, keep on getting that word out there becauseit's way better to deny people than it is to not have enough people. so maybe only oneor two of those ideas will work. i think all of them will work if you believed in themenough, but just pick and choose which ones
you want and really focus on those and i thinkyou're gonna do really well. you're already off to a great start. being in 21 years ofbusiness, obviously, you're doing amazing anyways. so thank you so much, ted, for allowingme to make your website. it has been a great journey. i think we did a pretty good joband, yeah. for everyone else, please remember to comment, rate, and subscribe and i willsee you in the next video. thanks a lot.
Tidak ada komentar:
Posting Komentar