Adding Images to a Page in GT Editor (IMCE)

Category
Editors
Drupal Version
Drupal 7
Tags
images / photos
GT Editor

The following instructions are for adding an image or picture to a page when your site is using GT Editor or otherwise has the IMCE module installed.

Important!  Be sure to properly resize your image file before you upload it to your site.

  1. Place your text editing cursor where you want to be located within your content
    • If you want the image on it's own line, create that blank line and place the cursor on it
    • If you want the image to float left or right of existing text, place your cursor at the beginning of that line of text
  2. Select the Image button in the editor toolbar (it looks like a painting of an outdoor landscape with a mountain and a little sun in the upper-right corner).
  3. In the pop-up control panel, select the Browse Server button to the left of the URL field.
    • If you do not see a Browse Server button, then your site is not configured with the IMCE module, and the following instructions do not apply to your website.
  4. In the next pop-up control panel that appears, navigate to the folder where you want to save your uploaded image or a folder that already contains a file that you wish to use for your link.  To upload a new file to your chosen folder:
    1. Select the Upload toolbar button, and then use the resulting controls to find and select the correct file on your local computer.
    2. Once you have selected a file, select the Upload button that appears below the Create thumbnails option (not the Upload button above in the toolbar).
    3. Your newly uploaded file should appear in the folder file list.
  5. Select your chosen or uploaded file to highlight it, then select the Insert File button from the toolbar.
  6. You will now be returned to the first pop-up control panel, and you should see a filesystem path in the URL field.
  7. If your image is conveying something important to your website users (i.e. the image is not purely decorative, meaning you could remove it and users would still get the same message from the page), then you need to enter a short description of the message conveyed by the image in the Alternative Text field.
  8. If you want your image to float left or right of your existing text, then select the appropriate option for the Alignment field.  You may also need to add a little horizontal or vertical spacing by entering a small numeric value (usually 10 works) for the HSpace and / or VSpace fields.
  9. When you are finished, select the OK button to place your image into the page.