Edit an Image
4.2 Edit an Image on a page
Resize an Image
1. Locate your desired page and be sure you are on the Edit tab. Click on the image you wish to edit.
2. When you do this, notice that the Insert/Edit Image button darkens. (This is the button with the tree on it.) Click this button.
3. The Insert/Edit Image dialog box will appear, with the current image showing in the Image URL field. Click the Browse button to bring up the File Browser dialog box.
4. The image you are wishing to resize should be highlighted in the list. Click the Resize button at the top of your screen.
5. A small Width x Height area will appear directly beneath the Resize button. Type in the proportions you wish to resize the image to. Keep in mind that these measurements are in pixels (pixels is indicated by the abbreviation px).
If you are unsure of the dimensions you are after, try to find another image that is about the size that you want. Right-click on that image and click 'Properties' to view the image dimensions.
Here are some sample image sizes in pixel dimensions for your reference. (Note: This image suffers some quality loss as it is enlarged.)
100 x 96 pixels
250 x 192 pixels
350 x 267 pixels
6. By default, the Create New Image box is checked. This allows you to keep the original file, in the event you do not have it saved elsewhere. If you do have the original file, you may un-check this box. This will save file space on your website's file system.
7. After resizing the image, it will automatically be highlighted for use. Click the re-sized image in the bottom, right corner of the File Browser window. You will be returned to the Insert/Edit Image screen and the image URL field will contain the URL of the re-sized image.
8. Click the Update button to finish the image resizing process.
Note: Do not use the Appearance tab in the Insert/Edit Image dialog box to resize a large image. This only changes the way the image appears, and does not change the actual file size/dimensions. Visitors will still have to download the full file, large or small. On slower internet connections, this can be very cumbersome. It may even turn visitors away from your site due to download time.
Align an Image on the Page
1. Locate your desired page and be sure you are on the Edit tab. Click on the image you wish to edit.
2. Notice that the Insert/Edit Image button darkens. Click this button.
3. The Insert/Edit Image dialog box will appear with the current image showing in the Image URL field. Click the Appearance tab at the top.
4. Use the Alignment drop-down menu to select the alignment to apply to that image. This will justify your image to position it on whichever side of the screen or text you designate. The box with the tree and Latin words to your right provides a preview of what effect the selected alignment option will have on your page and the text next to it.
5. When you have defined an alignment you are pleased with, click Update to finish the process.
Put Extra Space around an Image
1. Locate your desired page and be sure you are on the Edit tab. Click on the image you wish to edit.
2. When you do this, notice the Insert/Edit Image button darkens. Click this button.
3. The Insert/Edit Image dialog box will appear, with the current image showing in the Image URL field. Click the Appearance tab at the top.
4. Using the vertical and horizontal space options, you can move the image away from the text or closer to it. These dimensions are defined in pixels. Most people are happy with 2px or 3px of space around their image. Play around with it to figure out what you like best.
5. When you have defined image spacing you are pleased with, click Update to finish the process.
Place a Border around an Image
1.Locate your desired page and be sure you are on the Edit tab. Click on the image you wish to edit.
2.When you do this, notice that the Insert/Edit Image button darkens. Click this button.
3. The Insert/Edit Image dialog box opens, with the current image showing in the Image URL field. Click the Appearance tab at the top.
4. Here you will find a field for adding a border. The border thickness is defined in pixels. leaving this field blank results in no border, 1 px produces a very thin border; 2px a bit thicker, and so on.
5. When you have defined an image border you are pleased with, click Update to finish the process.
Return to Quick Reference Guide Index