READ: How to Upload a Website using Filezilla 

Follow along with this tutorial.  I am using my Mac computer in this tutorial, so if you are having trouble following along with the layout of my Filezilla then you can watch the Windows video tutorial in the next link.

1. Open Filezilla on your laptop.  If you are not using a school laptop, then you can download that HERE.

2. Click on "Open the site manager" in the top left-hand corner.

3. Click on "New site".

4. Name it by typing in your first and last name.

5. FIll in the following, then press "connect":
Post: 21
Protocol: FTP-File Transfer Protocol
Encryption: Use plain FTP
Logon Type: Normal
Password: student

6.  There will be 2 folders once you get connected- Web Design and Web Essentials.  Double click on Web Essentials.

7.  Right click in the blank space and click on "Create directory".

8. Type in your first and last name, then press "Ok".

9. Now double click on your folder that you just created.

10.  It will say that your ftp directory is empty.  Now you can drag over any files or folders you want from the left-hand side and then drop them into your ftp directory.  

In this example, I am dragging over my "Fullest Bloom" web site folder which is on my desktop. Then I am dropping it into my ftp directory. Be sure that all of your hyperlinks and CSS work before you upload it using ftp!

11.  Double click on your website folder that you dragged into your ftp directory.  This will show all of the files and folders within your directory.

12. RIght-click on the home.html file (in your case, it may be index.html).  Then click on "Copy URL(s) to clipboard".  This gives you the ftp URL string that you want to know for the next step.

13.  Open Notepad or TextEdit and paste that ftp URL on a blank document.  Notice the part of the string highlighted below - find yours and copy it.

14. Now type in the following right below it:

15. Paste in the piece that you copied in step 13 right after "".  We now have the actual URL that will get us to that file on the Web.

16. Copy the whole URL. (For your information, you don't have to save your Notepad file when you are done.)

17. Paste your URL into a Web browser, such as Google Chrome.

18.  And you have your website!  Try clicking on all of the links to make sure they all work.

All of my links, images, and CSS work - awesome!

***Note:  Your your assignmentS you will need to copy and paste your URL that you pasted into your Web browser for your submission.  Also, you can now show off your amazing Web development skills to you friends and family with out sending them your whole folders - yesss!

The video tutorial below is one that Mrs. Sarah Weston made using a Windows Operating System (aka your school laptops).  This is optional to watch, but could help you understand how to use Filezilla better.  Just be sure to follow all of my steps in the previous link, since that is how you will be turning in your next assignment.

Last modified: Thursday, 14 June 2012, 4:20 PM