ArtsAutosBooksBusinessEducationEntertainmentFamilyFashionFoodGamesGenderHealthHolidaysHomeHubPagesPersonal FinancePetsPoliticsReligionSportsTechnologyTravel

WordPress - Upload images to your WordPress site with Filezilla

Updated on December 2, 2012

In an earlier hub I explained how to Download and Configure FileZilla a very commonly used robust FTP client software on your local computer. If you've not had a look yet, it may help if your did a quick read up.

The textual content of your webpage is created within WordPress itself, using editing tools available when you login to WordPress as Admin. If you would like to know how to do this, do take a quick look at my hub entitled Your very first WordPress page. It's pretty simple really.

Web Page Images

Professional website builders normally create all the images they want to include in a webpage (perhaps using Photoshop, Corel Draw or Gimp i.e. great image creation and image retouching tools) and save these images, on their local computer's hard drive.

The images could be the Website logo, Menu item buttons, and other visual stuff that would add to the aesthetics of the webpage.

Hence, all the images required for use on a webpage are stored locally, but your WordPress CMS is hosted on a distant computer. Hence your first task would be to deliver the images on your local computer to the computer on which your WordPress CMS is hosted. Once these images are relocated there they can be included in your WordPress page. This ensures that the webpage aesthetics are more appealing than one that is purely textual in its content.

WordPress page content that is totally textual in nature could be visually boring to the visitor who may quickly lose interest in the page and move on. This can result in the visitor being flagged as a bounce in Google Analytics. Bounces do not help in getting your webpage to rank better in Google, Yahoo or Bing.

A nice blend of text and graphics (i.e. images) on your web page arrests the attention of visitor, which causes them to linger a while on your website reading your visually appealing and helpful page. Just perfect for getting noticed by search engines.

Here's how to achieve this:

Start up your FileZilla - FTP client.

Click File -> File Manager. From under the label MySites choose the website you want to connect to then double click the link. Take a look at diagram 1 and diagram 2.

Diagram 1. File -  Site Manager
Diagram 1. File - Site Manager
Diagram 2. Connecting to your website
Diagram 2. Connecting to your website

FileZilla immediately connects to your the website, and displays its root directory, folder structure in the right hand section of the FileZilla FTP client window as shown in diagram 3.

Diagram 3. Website root folder exposed in FileZilla
Diagram 3. Website root folder exposed in FileZilla

Scan though the the list of folders in the right hand window of FileZilla and locate the folder public_html. Take a look at diagram 4.

Diagram 4. The public_html folder
Diagram 4. The public_html folder

Double click the small yellow folder icon to enter that folder. FileZilla next displays all the folders and files that are within the public_html folder. Take a look at diagram 5.

Diagram 5. Some of Folders within public_html
Diagram 5. Some of Folders within public_html

Notice the vertical slider on the extreme right hand side. Use the vertical slider to navigate through all the folders and files in the public_html folder.

Right click anywhere in the section where the folders are displayed (use the empty white space), From the sticky menu that appears click the Create Directory link to create a new folder within the public_html folder as shown in diagram 6.

Give the new folder an name, let's say pageimages as shown in diagram 7. Its not the most imaginative name but it will suit our purposes nicely. The folder will be created.

Use the vertical scroll bar to locate the folder. Double click the little yellow folder icon to enter the folder. FileZilla will show you the contents of this folder which in this case is nothing, i.e. the pageimages folder is empty.

Please notice that the folder name is written completely in lowercase.

Diagram 7. Creating the pageimages folder
Diagram 7. Creating the pageimages folder

In the left hand section of FileZilla, the directory tree of your local hard disk is exposed. Navigate to where you have saved the images you've created that you want uploaded to your WordPress website.

When the images are exposed in the left hand section of FileZilla, simply select, drag and drop them from the left hand side to the right hand side. This informs FileZilla that you want to copy and upload all the images selected in the local hard disk to the distant WordPress website in its folder named pageimages. Take a look at Diagram 8.

Diagram 8.  Uploading files to the website using FileZilla
Diagram 8. Uploading files to the website using FileZilla

FileZilla will being to upload one image at a time into the folder pageimages on the WordPress website. The status of the image file transfers can be seen in the bottom most section of FileZilla. Once all the images have been copied from the left hand side of FileZilla FTP client to its right hand side, Congratulations !!!! - You've successfully copied and pasted the images from your local hard disk to your WordPress website.

In my next Hub I'm going to explain how these images which are now on the WordPress website, in a a folder named pageimages can be displayed in a WordPress page. Stay tuned to this Hub place.

I would be really obliged if you left me some comments on whether you like, dislike my hub content. Please feel free to ask me for any information you would like to see on a hub concerning WordPress or any other Open Source CMS based tool. If I have the knowledge I'd be happy to share.

Ivan Bayross
Open Source Tutorials

Comments

    0 of 8192 characters used
    Post Comment

    • profile image

      SK 

      4 years ago

      So helpful - thank you!

    • profile image

      ZK 

      5 years ago

      Excellent article! Exactly what I was looking for. Please continue to make articles like this for other topics and software!

      (mt) ZK

    working

    This website uses cookies

    As a user in the EEA, your approval is needed on a few things. To provide a better website experience, hubpages.com uses cookies (and other similar technologies) and may collect, process, and share personal data. Please choose which areas of our service you consent to our doing so.

    For more information on managing or withdrawing consents and how we handle data, visit our Privacy Policy at: https://hubpages.com/privacy-policy#gdpr

    Show Details
    Necessary
    HubPages Device IDThis is used to identify particular browsers or devices when the access the service, and is used for security reasons.
    LoginThis is necessary to sign in to the HubPages Service.
    Google RecaptchaThis is used to prevent bots and spam. (Privacy Policy)
    AkismetThis is used to detect comment spam. (Privacy Policy)
    HubPages Google AnalyticsThis is used to provide data on traffic to our website, all personally identifyable data is anonymized. (Privacy Policy)
    HubPages Traffic PixelThis is used to collect data on traffic to articles and other pages on our site. Unless you are signed in to a HubPages account, all personally identifiable information is anonymized.
    Amazon Web ServicesThis is a cloud services platform that we used to host our service. (Privacy Policy)
    CloudflareThis is a cloud CDN service that we use to efficiently deliver files required for our service to operate such as javascript, cascading style sheets, images, and videos. (Privacy Policy)
    Google Hosted LibrariesJavascript software libraries such as jQuery are loaded at endpoints on the googleapis.com or gstatic.com domains, for performance and efficiency reasons. (Privacy Policy)
    Features
    Google Custom SearchThis is feature allows you to search the site. (Privacy Policy)
    Google MapsSome articles have Google Maps embedded in them. (Privacy Policy)
    Google ChartsThis is used to display charts and graphs on articles and the author center. (Privacy Policy)
    Google AdSense Host APIThis service allows you to sign up for or associate a Google AdSense account with HubPages, so that you can earn money from ads on your articles. No data is shared unless you engage with this feature. (Privacy Policy)
    Google YouTubeSome articles have YouTube videos embedded in them. (Privacy Policy)
    VimeoSome articles have Vimeo videos embedded in them. (Privacy Policy)
    PaypalThis is used for a registered author who enrolls in the HubPages Earnings program and requests to be paid via PayPal. No data is shared with Paypal unless you engage with this feature. (Privacy Policy)
    Facebook LoginYou can use this to streamline signing up for, or signing in to your Hubpages account. No data is shared with Facebook unless you engage with this feature. (Privacy Policy)
    MavenThis supports the Maven widget and search functionality. (Privacy Policy)
    Marketing
    Google AdSenseThis is an ad network. (Privacy Policy)
    Google DoubleClickGoogle provides ad serving technology and runs an ad network. (Privacy Policy)
    Index ExchangeThis is an ad network. (Privacy Policy)
    SovrnThis is an ad network. (Privacy Policy)
    Facebook AdsThis is an ad network. (Privacy Policy)
    Amazon Unified Ad MarketplaceThis is an ad network. (Privacy Policy)
    AppNexusThis is an ad network. (Privacy Policy)
    OpenxThis is an ad network. (Privacy Policy)
    Rubicon ProjectThis is an ad network. (Privacy Policy)
    TripleLiftThis is an ad network. (Privacy Policy)
    Say MediaWe partner with Say Media to deliver ad campaigns on our sites. (Privacy Policy)
    Remarketing PixelsWe may use remarketing pixels from advertising networks such as Google AdWords, Bing Ads, and Facebook in order to advertise the HubPages Service to people that have visited our sites.
    Conversion Tracking PixelsWe may use conversion tracking pixels from advertising networks such as Google AdWords, Bing Ads, and Facebook in order to identify when an advertisement has successfully resulted in the desired action, such as signing up for the HubPages Service or publishing an article on the HubPages Service.
    Statistics
    Author Google AnalyticsThis is used to provide traffic data and reports to the authors of articles on the HubPages Service. (Privacy Policy)
    ComscoreComScore is a media measurement and analytics company providing marketing data and analytics to enterprises, media and advertising agencies, and publishers. Non-consent will result in ComScore only processing obfuscated personal data. (Privacy Policy)
    Amazon Tracking PixelSome articles display amazon products as part of the Amazon Affiliate program, this pixel provides traffic statistics for those products (Privacy Policy)