Images can be added to your website in four basic ways. Review the options listed here and decide which best fits your purpose:

1. Use the Image asset in the New Content menu of the Admin Bar. This allows a single image to be uploaded and displayed on your site. This is useful when you want to display a single image at its full size. This asset will allow you to edit the image and resize it within WebGUI. The image asset is disabled by default. You can use File Pile instead, or ask your site administrator to enable this asset.

2. Add an image to an article using the Rich Text Editor. This allows you to manage a single image and add text around it, much like you would in a word processing program. This is the most common way to add an image to your site for illustration purposes in an article. However, you must resize the image file before uploading, as the drag mechanism used will only resize the display size, not the file size.

3. Upload many images to your site using File Pile. This allows many files to be uploaded at once, and is also useful if you are placing many files on your site for users to download. By default, images uploaded in this manner are displayed on the page at their full size.

4. The Gallery asset. See the chapter on Gallery for instructions.

Use the Image Asset

Upload a single image to your web page.

1. Choose the “Image” asset from the New Content menu of the Admin Bar.

2. A new screen will appear titled “Edit Image.”
   
   

3. In the box labeled “Title,” enter a title for your image.

4. Next, go down three boxes to “New file to upload,” and click on “Browse” to locate your image file on your computer. A new screen will appear titled “File Upload.”

5. Locate your image file on your computer, open it, and upload it.

6. You will be returned to the “Edit Image” screen, and will now see your image file name in the “New file to upload” box.
   
   

7. Click “save” and your image will be uploaded to the site.

Click Edit on the image's asset toolbar to edit its settings or resize the image.

Resize Images

1. Click “Edit” on the image's asset toolbar. This will open the “Edit Image” screen.

2. Click on the “Resize image” link located at the far right hand side of the screen.

3. Enter a new width and height for your image.

4. Click “save”; your image will be displayed at its new size.

5. Click on the “edit image” link on the far right hand side of the screen to return to the “Edit Image” screen.

6. Click “save” again. Your image is now resized on the web page.

Use the Rich Text Editor

While a bit more complicated, this is probably the best option to use if you wish to add an image to an article containing text. You may add a new article to the page, or you can add an image to an existing article by using the Edit function on the asset toolbar. Adding images to assets in this manner uses the WebGUI Collateral Image Manager, which allows many images to be uploaded, organized, and stored on the server.

1. To create a new article containing an image, go to the New Content menu in the Admin Bar, and click on “Article” (this example uses Article, but this can be done in any asset in which the icon is available in the rich editor). This will open the “Add Article” page.

2. In the box labeled “Title,” enter a title for your article.

3. Next, place your cursor in the “Description” field.

4. To enter an image using Rich Editor, locate the many different icons in the light gray shaded area at the bottom of the “Description” area. This is the Rich Editor. When you move your mouse over these icons a brief description of each icon's function appears. These icons contain many of the same features found in most word processing programs.

5. To insert your image, click on the “Insert WebGUI image” icon located in the second row. This icon resembles a picture with a frame around it.

6. A new screen will appear titled “WebGUI Collateral Image Manager.”

7. You will see a link highlighted in blue at the top named “[Media]”. Click on this link. From here, you have two new links highlighted in blue: Create new folder, and Upload new image.

8. To upload an image to place in your article, click on the “Upload new image” link. The Upload new image” window will appear.

9. Click on the “Browse” button to locate and select an image file from your computer.

10. When you have located your image, highlight the file name.

11. Click “Open,” and you will see the image file name appear in the file box of the upload new image window.

12. Click on “Upload,” and your image will be uploaded to the “WebGUI Collateral Image Manager.”

13. You will see the image file name appear in the “WebGUI Collateral Image” window with “[Select]” next to it. Click on the [Select] link of the image you wish to place in your article.

14. An image URL will automatically appear in the “Image URL” box, and your image will appear in the image manager located in the lower right hand corner.

15. In the layout area of the window you can select where you would like your image to appear in relation to the text in the article.

16. Click “OK” and your image will be inserted into the “Description” field of the “Add Article” window.

17. Resize your image by clicking on the image, placing your mouse in a corner and dragging it to the desired size, just as you would in a word processing program. This will resize the image for display purposes only; it does not permanently resize the image.

18. Add additional text if you wish.

19. Click “save” at the top of the screen when you are done. Your image and text will now appear on your web page.

Use File Pile

File Pile allows you to upload up to 100 files to your website at one time. Various file types can be uploaded at the same time, so you are not just limited to images. For images, this allows you to simultaneously post many full size images.

You might want to consider using Folders to organize your files. By default, File Pile is used to upload files to the Folder after creation.

To upload an image(s) using File Pile:

1. Click on File Pile in the New Content menu of the Admin Bar.

2. A screen titled “Add a Pile of Files” will appear.
   
   

3. On the screen you will see a box labeled “Upload Files.” Click on “Browse” next to this box to locate the image or file you would like to upload.

4. Locate the file/image on your computer.

5. Highlight the file name.

6. Click “Open.”

7. You will see the file name appear in the “Upload File” box. You will also see a new box appear from which to upload another file.
   
   

8. Click on “Browse” again, and continue until you have uploaded as many files/images as you would like to post on your website.

9. When you have uploaded all the files you need, click on “save” at the top of the screen.

10. All of the images you uploaded will now appear on your web page. By default, images uploaded in this way are displayed at their full size on the page.

Each of the files uploaded has its own toolbar from which to edit the image or content if necessary. You may change the image file's title, alter the menu title, or alter the URL if you wish. You may also control viewing and editing privileges for each individual file uploaded.