6. Image & File Library

The Image Store is a section of the editor that allows you to upload images from your own computer into a space reserved on our servers for your use. Once they have been added to the library you can access them via the Web Page Editor to add onto your site.

6.1 Library Overview

When you click through to the Image and File Library, you will be presented with a panel which displays thumbnails representing all the images you have in your website image library. 

Figure 6.1.1 - The Image & File Store panel

From this panel, you are able manage your files and image, including uploading, resizing, renaming and deleting.

The images can be inserted into your web pages using the web page editor (see Section 3.10 - Inserting Images).

The files can be linked to for downloading from your webpages using a hyperlink (see Section 3.7 - Inserting Links).

6.2 Uploading Images & Files

To make an image or file available for you to use on your website, you need to upload it from your computer into your Sitewizard website image/file library. 

Figure 6.2.1 - The upload interface. 

To upload a file or image:

  1. Click the 'Upload' button at the top of the image library panel. 
  2. Click the 'Browse' button (it might say 'Choose file' or something similar depending on your internet browser).
  3. In the file window which pops up, navigate to the file or image that you want to upload from your computer, and click 'open'.
  4. Click the 'Upload Selected File' button
  5. The file will upload to the library. If it is a large file, you will be able to see its progress in a loading bar. When it is complete, you will see the file appear in the panel beneath.

6.3 Renaming Images & Files

Most functionality for managing your images and files can be accessed by RIGHT-CLICKING on your file to access the contextual menu.

  1. Move your mouse curser over the image or file, and click the button on the right-hand-side of your mouse (instead of the usual left button) to display the contextual menu.
  2. Select 'Rename' from the menu.
  3. Type your new file name into the pop-up box which appears, and click OK. Don't forget to keep the file type extension in place - for example, make sure it says 'mypicture.jpg' instead of just 'mypicture'. 

Figure 6.3.1 - Select 'Rename' from the right-click contextual menu.

6.4 Resizing Images

You can resize images in your image library by using the right-click contextual menu. Select 'Resize' from the menu, and it will bring up a pop-up window for resizing the image. 

Figure 6.4.1 - The image resize popup window. 
  1. Move your mouse curser over the image, and click the button on the right-hand-side of your mouse (instead of the usual left button) to display the contextual menu.
  2. Select 'Resize' from the menu.
  3. On the right of the window, you can enter the new size of the image in pixels. When you enter one dimension, the other dimension will be worked out automatically, according to the proportions of the image. Please note, you cannot enlarge your image, only make it smaller. 
  4. If you do not want the porportions to remain the same, click on the small padlock icon on the right, and and you will be able to enter different ratios lengths and widths. Please note this may make your image look squashed or stretched. 
  5. By default, a new image file is created when you resize the image, to preserve the original. To overwite your original, untick the box for 'Create new image'. Warning - we do not advise you overwrite images, as you will loose your larger image for future use. 
  6. You can specify the file name of the new image in the box beneath. by default it will be named the original file name followed by the new dimensions. 
  7. To the left, you can create small thumbnail images by selecting the tick boxes - these are handy if you want to insert a small image, which links to the larger version when you click on it. This is also handy if you have a lightbox image gallery on your site. 
  8. When you have finished making your amendments, click 'ok' to save your resized image.

6.5 Deleting Images & Files

Files can be deleted from your library by using the right-click contextual menu. . 

  1. Move your mouse curser over the image or file, and click the button on the right-hand-side of your mouse (instead of the usual left button) to display the contextual menu.
  2. Select 'Delete' from the menu.
  3. A popup will appear, which asks you do confirm that you wish to delete the file. If you are sure, click 'OK', and the file will be deleted from the library. 

6.6 Image & File Settings

If you click on the 'settings' button in the library panel, you can access a few options for viewing your files and images.

Figure 6.6.1 - Settings for the file/image library. 

 

^ Back To TopGo to next section >