Adding Images onto a Web Page

Adding Images onto a Web Page

This article describes how to add image to your web page using the WYSIWYG editor.

Step-by-step guide

  1. Place your cursor in the editor where you want your image.



  2. Click the Image button in the toolbar.



  3. Click on the Browse Server button.



    You will now see the tool that allows you to browse the images and files located on your website. While you will be able to browse and select most of the images throughout the site for inclusion in your web page, there is only one folder where you will be able to upload images. This folder is called editor-uploads.

  4. In the folder tree on the left, click on <root> then editor-uploads.


    If you had any other folder selected before clicking editor-uploads, you should notice the toolbar change to include some additional options including Upload, Thumbnails, Delete, and Resize.



  5. Click on Upload.



  6. Click on Choose File (for Google Chrome) or Browse (Microsoft Internet Explorer)|

      

  7. Use the window that appears to browse your computer's local file system to select the image you want to upload to the website. Select the image and click on Open.



  8. Click on the Upload button.



  9. When the image is finished uploading it will appear in the list of files on the right hand side of the window.





  10. Select the image in the file list and click on the Insert File button.



  11. (Optional) In the HSpace field type in 10.
    This adds some white space between any adjacent text and the image so it looks better.



  12. In the Alignment drop-down menu, select your desired alignment.
    This causes the image to be aligned to the left or right of the text area and will automatically wrap any adjacent text around it.



  13. Click OK.



    The new image should now appear in the editor area.



  14. Scroll to the bottom of the page and click the Save button.

    • Related Articles

    • Adding Images from Your Computer into a Web Page

      This article describes how to add an image to your web page using the WYSIWYG editor. Step-by-step guide Place your cursor in the editor where you want your image. Click the Image button in the toolbar. The Insert Image dialog box will appear. This ...

    • How to Add a Page

      How to Add a Page Adding a page is useful if you have additional information to offer your website visitors. Below are steps to take to add a page.   Step 1: Click on the Pages link in the Dashboard. Step 2: Click on the + Add Basic Page button. This ...

    • Adding Files as a Link

      This article describes how to add files as links to your web page using the WYSIWYG editor. Step-by-step guide Select the text or image you want to link. Click the Link button in the toolbar. The Link dialog box will appear. Under Link Type select ...

    • Adding Links

      This article describes how to add links to your web page using the WYSIWYG editor. Step-by-step guide Select the text or image you want to link. Click the Link button in the toolbar. The Edit Link dialog box will appear.       4. Press Save. Please ...

    • Editing a Page

      There are two options for editing a page. Through Manage Content or Editing from the page. See below for steps on each. Option 1: Through Manage Content Step 1: Go to Manage Content in the upper-left-hand corner. If you can't find the Manage ...