How to upload your website to the internet hosting via Dreamweaver.

In this video we're going to sign up for our Host. In our case we're going to use Bluehost, because they're awesome, but you could sign up for any hosting, whichever you prefer, and then jump to the next video after this where we actually connect our FTP details to Dreamweaver, and upload our site. So, if you're looking to host, go to bluehost/track/byol. Couple of things happen, is that you get a discount, and I get a commission on the sale. Doesn't cost you anything, actually you save money but if you don't want to do that way, you can go straight to bluehost.com and go around my little link. Regardless of how you do it, you end up here. You click on 'Get Started'. And what you want is this first option. Have a read through, have a little look, but for the majority of small and medium businesses you only need a simple basic plan. And it said $3.95, but actually ends up being about $5.95 after you've put all the things you need. If you have a domain name already, type it in there. If you don't have one, I'm going to sign up for one now. bringyourownlaptopisawesome.com

So fill in the fields here, and this part here is really important. Your price for $3.95 is for 3 years, if you want to keep the cost down, and do 12 months, you pay more, but you only have to cough up one year. Things you don't need, Domain Privacy, doesn't really keep you private, only keeps you private from people that don't know what they're doing. Site Backup, if you're just looking to do your own site, you don't need this because you'll always have a copy on your laptop, but if you're working with multiple people, this can be really helpful, because, they wreck your site, you don't have a copy of that new site, you want to go to this backup. I don't need it, for this case, because it's just me working.

This Search Engine jump starts, never works. SiteLock, this doesn't work either, just allows you to put a badge on your site to say we've secured it from nowhere. We're not going to use it, so we're not going to add it. And SSLs, little bit complicated for what we're doing now but it's definitely something in your future. Make sure, your website, from http www.bringyourownlaptopisawesome to https, which is more secure, but there are some other hosts to jump around. So we're going to turn that off, and keep it simple. So, enter your payment details, and I'll see you in the next screen.

Congratulations! We've signed up. Do I want PaySphere, and something else, WebPress, no thanks. It will ask you to sign up for a password, I've done that. Log in. So this is where we end up. And what we're looking for, what we really need is the FTP details. They are little button here, or you can email, like I did. Welcome you to Bluehost, and they'll send you the FTP information. So have a look in your email. And this stuff here is quite important, so write it down somewhere where you keep all, that notebook, you keep all your files, or that Google Doc. Put them all in there, because these FTP details you'll use once, and forget, and then in a couple of years when you need to update stuff, you'll forget, especially your password. If you do forget, you can actually find this stuff here in Bluehost. Click on 'FTP', and right down the bottom will be that same information. I don't want to click on it now just because it has some personal details in there that I don't want you to see.

So let's jump into Dreamweaver now and put in this FTP details. It doesn't matter really what page you have open, it doesn't matter at all. Let's go to 'Site', and 'Manage Sites'. And this is the one we're working on this whole course, Dan's Awesome Portfolio. We're going to double click it. And this is the details we started off putting in, but now we need to insert something called the Server. That's what Bluehost is giving us. They're allowing us to use their servers. So, let's hit '+'. Give it a name at the top here, doesn't matter, 'Bluehost'. If you're using GoDaddy, or any other domain hosting company, you can just type in the FTP details here. It's pretty much exactly the same.

So, in that email, you saw I had the Host Name which is actually the FTP address. Let's actually pull this up, next to it. So, you… So that's that one, the User Name. That's there. What else have we got? We've got the Password, which I'll cut out. Password. Awesome! And the Root Directory needs to be put in. And in our case, it's 'public_html', that's a super common one. Nice! Now the moment of truth, we're going to hit 'Test'. Hit 'Test', and fingers crossed, it works. Awesome! If it doesn't work, sometimes when you are setting up a new hosting account it can take a little time to populate, so give it an hour, maybe two before you start yelling at Bluehost, or me. Sometimes it can just take a little while to get working.

The other thing you can do is that your domain name might not be registered, and working yet, so byolisawesome.com might not have populated yet, and what I've done is I've given you a temporary password. See this temporary URL, this is one that you might use in the interim until your actual domain name starts working. Let's click 'OK'. Now if you are having problems with the FTP, some of the things that can happen is, you can switch this off and on, 'Passive FTP'. That can sometimes fix things. The other thing that might happen if you're using a different host, it might not be called public_html, it might have a different URL. So reach out to your hosting company if you're having problems. Before you hassle them, check their FAQs, often they'll have like how to set up in Dreamweaver, and they'll tell you which bit goes where. If you're still having troubles, reach out to the hosting company, that's what you pay them for. Often their online chat is an easy way to do it, or drop a comment, here on this page, and I'll see what I can do to help.

Let's hit 'Save'. Let's hit 'Save'. Is it done? And you ready? So you upload pages individually generally. So I've got index.html open. And over here, we're in our 'Files' panel. So this is the site that's on my Local Drive, you can see, 'Local View'. So it's just my machine. Now what I want to do is put it, so 'Site', 'Put'. And this is going to connect it to your host. Takes a long time. Connecting to server. "Would you like to put dependent files?" This is important. For some reason there's a timer around this, not sure why, but I've got 22 seconds to explain it. Dependent files, at the moment we're just putting our HTML, but we've build a CSS sheet, and some JavaScript, and some other things, and some images. They're all not part of that. So, dependent files are all those extra bits. So if you just want to pull up the Index File you click on 'No'. If you're one like me, put the Index File plus the images plus all the JavaScript, and all the CSS, that's what we need to do. The reason they keep that separate is that, say it's a lots of images and they're big long images, see, the images take the longest, HTML takes seconds to update, whereas JPEGs can be quite big. So what you do is, say you're just making a text change here, you change the text and just upload the HTML. So you say, dependent files, no, because all the images haven't changed, they're all the same.

So that loaded it all. So now we're going to check bringyourownlaptopisawesome. Let's go have a look in the browser. All right, here we are, www.byolisawesome.com Hey ho, we have a website, and the rest of the planet can see it. No longer testing locally or testing on our remote. It all looks awesome, and it all works. If you've got to this point, you are probably super happy with yourself. I have done this a million times and I'm only doing this for a test, and I'm still pretty excited. I don't know why, feels different when the world can see it. Let's go and have a look at what else we need to do just to make sure it's all up.

So back into Dreamweaver. What we need to do now is make sure all the pages are updated. So, we could now-- because we've only got one of the page, the Portfolio page, we can just open it, and go to 'Site', and go to 'Put'. And that will upload it to the hosting. If you've got lots of pages, say you've updated, and you've got 20 pages you can have that closed, it doesn't matter. You can select on all the different pages in here, or select the whole site. Actually there's no need for those two to go up, the Template is just for you, locally. All the rest of these can go up.

So you could click this one, hold down 'Command' on a PC, sorry, 'Command' on a Mac, or 'Control' on a PC, and click two of them. Then up here, there's another way of putting. Can you see, 'Put', and that will ask you about the dependent files again. Do I want dependent files? I'm going to have to say 'Yes' because that Portfolio UI has some extra images. The trouble is, it's that it's going to go and upload the ones from Index again. So it can be a bit of a long process. Let's go check it now. Hey ho, and let's click on our button. And there it is, and there's our big Portfolio Image. And it says, can you see over here, it says "Hey, there's bits in here written in Latin, would you like to translate?" That's because I got this place holder text in here. So that will go away when I actually put proper text in there. Thank you, Google Chrome.

All right, my friends, that is the end of putting stuff online. Now, that I know for a fact gives a lot of my students a lot of hassles, so drop me a line, leave a message to say "I couldn't make it work, what's wrong?" Make sure you send me screenshots. I don't necessarily need your password but it's good to see what your FTP name is, your user name is, so that I can diagnose the problem. So, that is the end of this one. Let's get on to the next tutorial.