• Skip to main content
  • Skip to primary sidebar
  • Skip to footer

Matt Doyle | Elated Communications

Web and WordPress Development

  • About Me
  • Blog
    • Design & Multimedia
      • Photoshop
      • Paint Shop Pro
      • Video & Audio
    • Online Marketing
      • E-Commerce
      • Social Media
    • Running a Website
      • WordPress
      • Apache
      • UNIX and Linux
      • Using FTP
    • Web Development
      • HTML
      • CSS
      • JavaScript
      • PHP
      • Perl and CGI Scripting
  • Portfolio
  • Contact Me
  • Hire Me
Home / Blog / Running a Website / Using FTP / FileZilla Tutorial – How to Upload Your Site with FileZilla

FileZilla Tutorial – How to Upload Your Site with FileZilla

20 July 2009 / 1 Comment

FileZilla logo

In this tutorial you learn how to upload your website using FileZilla, the popular free FTP application. FileZilla is available for Windows, Mac and Linux. This tutorial features Mac screenshots, but the techniques also apply if you’re running FileZilla on Windows or Linux.

Connecting to your Web server

The first thing you need to do is connect to your Web server. The easiest way to do this is to use the Quickconnect bar at the top of the FileZilla window:

Quickconnect bar
Enter your server details in the Quickconnect bar, then click Quickconnect to connect to the server.
If you don’t see the Quickconnect bar choose View > Quickconnect bar.

Enter your Web server’s name in the Host box, your login name in the Username box, and your login password in the Password box. Then click Quickconnect to connect to your server.

You may be behind a proxy server, especially if you’re trying this from work. If so, you will need to get your proxy server details from your IT support people. To configure FileZilla to work through an FTP proxy server, choose Edit > Settings (FileZilla > Preferences on a Mac), then click the FTP > FTP Proxy option and select your FTP proxy type.

Your home directory

Once logged in, you will be taken to your home directory on your Web server, which you’ll see in the Remote site window in FileZilla. This directory contains (amongst other things) your website directory, which is where you need to upload all your files:

Home directory
Your home directory on the server contains your website directory (highlighted), which is where the website’s files go.

Double-click your website directory — mysite.com in the above screenshot — to browse its contents.

Your document root

The top level folder of your website is often called the document root. This is where you will place your first website files. The document root is often named htdocs or public_html, and is usually inside your website directory.

Document root directory
Your website directory contains htdocs, your document root directory — the top level of your website.

If you like, you can double-click your document root folder — htdocs in the above screenshot — to browse its contents.

Uploading a Web page

Once you’ve found your document root, you’re now ready to upload your website. Here, you’re going to upload your first page, index.html, which should be the name of the main page of your website.

Use the Local site window to browse to your website folder on your hard disk. You can then upload your index.html file to the server by dragging it from the Local site window to the document root folder in the Remote site window:

Uploading a file
Uploading the website’s index page file by dragging it from the Local site window to the Remote site window.

You’ll see the file briefly appear in the Transfer queue window (the window at the bottom of the FileZilla window) as FileZilla uploads the file to your Web server. When it is finished, double-click your document root folder in the Remote site window to view its contents. You should see a copy of your file. Congratulations — you’ve just uploaded your Web page!

Upload complete
Upload complete!
You can also upload files and folders by dragging them straight from Windows Explorer or the Mac Finder into the Remote site window.

Other stuff

Downloading

If you need to download a Web page from your site again (for example, you lost the original on your PC), simply drag and drop your page the other way, from the Remote site window to the Local site window (or to your Desktop).

Disconnecting

After you’ve finished uploading stuff, choose Server > Disconnect to disconnect from your Web server. Or simply close down FileZilla.

Deleting files

To delete a file that you have uploaded to your server, click on the file in the Remote site window to select it, and press the Delete key on your keyboard.

Doing other stuff to files

Right-click on a file in the Remote site window and you will see all sorts of things you can do to it, such as renaming it and editing it.

This basic FileZilla tutorial has shown you how to upload your website files with FileZilla. To learn more about about using FileZilla, take a look at the FileZilla documentation. Have fun!

Filed Under: Using FTP Tagged With: delete files, disconnect, document root, download, drag and drop, filezilla tutorial, ftp tutorial, home directory, host, linux, mac, password, quickconnect, upload, username, windows

Reader Interactions

Comments

  1. jeffrey schofield says

    10 November 2019 at 12:40 pm

    all i get is BLANK PAGE WITH NO IMAGES ETC

    Reply

Leave a Reply Cancel reply

Your email address will not be published. Required fields are marked *

To include a block of code in your comment, surround it with <pre> ... </pre> tags. You can include smaller code snippets inside some normal text by surrounding them with <code> ... </code> tags.

Allowed tags in comments: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <s> <strike> <strong> <pre> .

Primary Sidebar

Hire Matt!

Matt Doyle headshot

Need a little help with your website? I have over 20 years of web development experience under my belt. Let’s chat!

Matt Doyle - Codeable Expert Certificate

Hire Me Today

Call Me: +61 2 8006 0622

Stay in Touch!

Subscribe to get a quick email whenever I add new articles, free goodies, or special offers. I won’t spam you.

Subscribe

Recent Posts

  • Make a Rotatable 3D Product Boxshot with Three.js
  • Speed Up Your WordPress Website: 11 Simple Steps to a Faster Site
  • Reboot!
  • Wordfence Tutorial: How to Keep Your WordPress Site Safe from Hackers
  • How to Make Awesome-Looking Images for Your Website

Footer

Contact Matt

  • Email Me
  • Call Me: +61 2 8006 0622

Follow Matt

  • E-mail
  • Facebook
  • GitHub
  • LinkedIn
  • Twitter

Copyright © 1996-2023 Elated Communications. All rights reserved.
Affiliate Disclaimer | Privacy Policy | Terms of Use | Service T&C | Credits