Add Images
Images are an important way of decorating
your site and making it stand out.
Overview
- Image Requirements
- Inserting Images
- Formatting Images
Within Your Text - Easy Editor
- Formatting
Images Within Your Text - HTML Editor
- Resizing Images
Prior to Uploading
- Creating Image
Folders
- Linking an
Image to Another Page
- Deleting Images
- Reasons Images Do
Not Work
1. Image
Requirements
Images must be in .jpg, .jpeg
or .gif format. These are the most common internet image formats.
Images must be no larger
than 640 x 640 pixels. Images larger than this tend to be too large
for web use (i.e. it will take the end user too long to download). This will
also save on your bandwidth usage.
2.
Inserting Images
There are a few ways you can add
images to your pages. Your website comes with an Image Library filled with over
500 stock photos. You can use these, or you can upload your own images.
Using Stock
Photos from the Image Library
- Go to the page you want to add
photos to and click 'Edit Page' on the toolbar.
- Click the image box that says
'Click to put an image here' in the middle and 'Click
to Change' at the bottom of it.
Note: If there
is not already an image associated with the box, it will look like the image
above. If there is an image on the page associated with the box, a thumbnail
image will be in the box.
A window will pop up on top of
your current browser window that looks something like this:
On the left side of the window
you'll see a menu. These are the image categories. You can browse through
images by clicking on these categories, or you can use the keyword search
above the index. When you are viewing a specific category, the name of the
category is a different color in the menu and appears above the thumbnail
images. In the screenshot above, we're looking at the 'Business General'
image category.
- When you find an image you want
to put on your page, place the mouse cursor over it. The image will be highlighted.
Click on it to add it to your page.
You'll now see your chosen photo
in the image box on the editing page.
- Click the 'Save' button
at the bottom of the page. The image now appears on your web page.
Uploading Your
Own Images
- Click 'Edit Page'
on the toolbar.
- Click on 'Click to Change' box. The Image Popup Window will appear.
- Click 'Add Images' at
the top of the Image Popup Window.
The Add Images page will appear.
- Click the 'Browse...'
button next to the field that says 'Image 1' to select an
image from your computer. Note that images larger than 640 x 640 pixels will
not upload. The 'Open Window Dialog Box' will appear. Choose
an image on your computer using the dialog box then click the 'Open'
button in the dialog box.
You can upload up to five images
at one time. Just repeat the last step for each Image field.
- When you're finished choosing
image(s) to upload, click the 'Add Images to Library' button
at the bottom of the Image Popup Window. The image(s) will now appear within
the window and are stored in the 'Main Folder' section of
the Image Library.
You can now post your image to the
image box you clicked to upload your photos. Keep reading the next section to
learn how. You can also close the window and use your photos later by clicking
'Close Window' at the top of the Image Library window.
Posting to
Designated Image Boxes ('Click to Change')
The first step is to upload your
photo. To learn now, read the Uploading Your Own Images
section immediately above this section.
If You Have Just Finished
Uploading Your Photo:
- If you've just uploaded the photo
you want to use and are are still in the image library, click on the thumbnail
image . It will now appear on the editing page as a thumbnail in the 'Click to Change' box.
- Click the 'Save' button
at the bottom of the page. Your web page will now appear with the image.
If You Already Uploaded Your
Photo:
- Click 'Edit Page'
on the toolbar.
- Click on the 'Click to Change' box. The Image Popup Window will
appear
- By default, uploaded images are
placed in the 'Main Folder'. If the window does not open
to the Main folder, click it, or the folder your image is saved to, from the
'Your Images' index at the top left of the window.
- Click on the thumbnail of your
image.
- Your image window closes and you'll
see your image as a thumbnail in the image box on your editing page.
- Click 'Save' on
the editing page.
Posting
Images Within Your Text - Easy Editor
You can easily insert images within
your text with the Easy Editor. If you are are using the Easy Editor,
it will tell you on the editing page, directly above the text editor box. To
switch to the Easy Editor, click 'Edit Site', then on the right, select the Easy Editor.
- Upload your images as per the
instructions in the Uploading Your Own Images section
above. Close the Image Library window.
- Go to the page where you want
to post the image and click 'Edit Page' on the toolbar.
- Click on the 'Insert/Edit
Image' button
on the Easy Editor toolbar.
- The Image Properties window pops
up. Click the 'Browse Server' button.
The Image Library window now opens.
By default, uploaded images are placed in the 'Main Folder'.
If the window does not open to the Main folder, click it, or the folder your
image is saved to, in the 'Your Images' index at the top
left of the window.
- Click on the thumbnail of your
image. You'll be redirected to the original Image Properties window, where
you'll see that the image URL or location, as well as a preview of your image,
have has been inserted.
You can now format your image or
click 'ok' to place your image on the page. Read Formatting
Images Within Your Text to learn how to format your images.
Posting Images
Within Your Text - HTML Editor
Follow the directions for Uploading
Your Own Images to add your images to the Image Library.
Change your text editor to HTML by clicking the 'Edit Site' tab, then on the right, select the HTML Editor.Then, on your editing pages, use this html code:
<img src="WEB ADDRESS">
You'll need to replace "WEB
ADDRESS" with the address or URL of your image. To find the address of
the image:
- Click on the 'Click to Change' box.
- Find the image within the library
and right-click on it, then click 'Properties'. You'll see
the URL beside 'Address (URL)'.
3. Formatting
Images Within Your Text - Easy Editor
You can easily format your image
within the Image Properties window. If you've already placed an image within
your text, click 'Edit Page' on the toolbar. Right-click on
the image and select 'Image Properties' to open the Image Properties
window. You can also open this window by clicking on the image within the text
editor, then clicking the 'Insert/Edit Image' button on the
Easy Editor toolbar. When you're finished making changes, click 'OK'
at the bottom of the Image Properties window. Make sure to also click
'Save' on the editing page.
Alternative Text
Alternative Text is the text that
pops up when you hover your mouse cursor over an image. It also shows when your
image is broken or doesn't work. To add alternative text to your image, enter
the text you'd like in the 'Alternative Text' field.
Resizing Uploaded Images
To resize your images, enter the
width and height in the appropriate fields in the Image Properties window.
By default, the aspect ratio is locked
so your image won't be skewed. You can unlock it by clicking the 'Lock'
button beside the 'Width' and 'Height' fields.
You can also rotate the image by
clicking on the 'Rotate' button.
Adding a Border
To add a black border to your image,
enter a number into the 'Border' field. The larger the number,
the larger the border.
You'll see a preview of the border
in the preview pane.
Vertical and Horizontal Space Around
Your Image
By default, when you place an image
within your text, it's positioned like text, flush against the word beside it
and on the same line. You can add extra space around the image with the horizontal,
'HSpace', and vertical, 'VSpace', fields.
The larger the number you input, the larger the space.
A preview of the horizontal and vertical
space you enter is shown in the preview pane.
Alignment
You can pick where you want your
text placed around your image by clicking the down arrow beside the 'Align'
field and selecting an option from the dropdown menu.
You'll notice that some of the alignment
options look similar. However, they behave differently in different browsers,
which is why we offer similar ones.
If
your image is already placed within your text, you can also use the alignment
buttons on the Easy Editor tool bar.
4. Formatting
Images Within Your Text - HTML Editor
To format your images with the HTML
Editor, you need to know HTML code. If you are familiar with HTML code, you
can switch to HTML by clicking the 'Edit Site' tab, then on the right, select the HTML Editor.
5. Resizing
Images Prior to Uploading
Photos must be no larger than 640 x 640 pixels to upload successfully. If you don't have a photo editor, there are several free programs that you can use to resize your images prior to uploading.
If you're just resizing a few images, we like www.picresize.com .
If you have a lot of images to do at the same time, you'll want a program that does batch resizing. You might want to try the following:
PC - http://www.faststone.org/FSResizerDetail.htm
Mac - http://www.aramk.net/photodrop/
6. Creating
Image Folders
- Go to one of your pages and click
on the 'Edit Page' button in the toolbar.
- Click on the 'Click to Change' box. If you do not see this, go
to a different page as not all pages have these boxes.
- Click on the 'Add Folder'
button.
- Enter a name for your folder.
Keep in mind that your folder name should only include letters, numbers, and
spaces. Do not use any other characters or your images may not work properly.
Click on the 'Add Folder' button when you are done.
7. Link
an Image to Another Page
Post an image within your text with
the Easy Editor as directed in Posting Images Within Your
Text - Easy Editor.
- Within the Image Properties window,
click the 'Link' tab.
- Enter the address or URL of the
page you want to link to in the 'URL' field, then select
the way you'd like your page to open from the 'Target' drop
down menu (ie. in another window). Make sure that when you entered the URL
that you remembered the 'http://' at the beginning of the
address.
- Click 'OK' and
save your page.
8.
Deleting Images
If you posted images within your
text, you can delete them by using [Backspace] or [Delete]
on your keyboard.
If your image is in the 'Click to Change' box:
- Click the 'Edit Page'
button on the toolbar.
- Click on the image you wish to
remove.
- In the window that opens, click
on 'Blank Image'. The window closes.
- Save your page.
NOTE: this only
removes the image from your page. The image is still saved in your image library
and can be posted elsewhere. If you want to remove the image from the image
library too, see below.
Permanent Image Deletion
- Click on the 'Edit Page'
button.
- Click on any 'Click to Change' box.
- Checkmark the square under the
image thumbnail and the click on 'Delete Selected' at the
bottom.
9. Reasons
Images Do Not Work
There are a number of reasons why
an image you tried to add didn't upload properly:
- Your image was too large.
Images larger than 640 x 640 pixels are restricted because they tend to be
too large for web use and will take the end user too long to download. This
will also save on your bandwidth usage.
- Your image is not in a
web compatible format. Make sure the file format is .jpg, .jpeg or
.gif
- Your image filename contains
characters which are not accepted by our software. Try uploading
again after renaming your files with alphanumeric characters.
- Your image has an error
or is in a non-standard format. Some image editing programs will
insert improper code into an image that can prevent it from showing within
your page.
- The folder you're uploading
your image(s) to has a character in it that is not read like a normal character.
For example, a period '.' is used to indicate that
the letters after it are the file format (image.gif or word.doc). Try deleting
your folder and creating a new one using letters, numbers, and spaces.
- Image uploading limitations
in trial mode. If you're still in trial mode, you're limited to 20
uploaded images, but once your site is converted to paid you can upload much
more.
- You deleted the image
from your image folder. Re-upload the image and re-post it.
If you're still experiencing difficulties,
please contact us by clicking 'Help'.
