Inserting pictures

Wild Apricot allows you to add pictures to insert images into your webpages. You can also use these pictures throughout your website to put into page headers, page footers, on your events listing page and in emails.
(and in addition to Wild Apricot built-in functions you can also insert pictures from photo sharing sites such as Youtube, Bubbleshare, Smugmug, and more - see How to extend your website with picture albums, videos, polls and more).

1. To insert a picture on a webpage, go to the web pages section and start editing the page in question
2. Select the picture icon from the Editor tool at the top of the page.

3. This will open the Insert picture window. You now have two options - You can either browse through the pictures which are already available on your website or upload a new picture from your computer.

Note that by right clicking in the file pane you can bring up a sub menu that lets you

• Create a new folder to store your images in
• Set different views for the files
  • Large/medium/small preview icons (so you know what the image looks like)
  • A list of details including individual file type and size

More information on using this system can be found on the File Management help page.

4. If you would like to upload a new picture, click on the Browse button and look for the picture you want to upload. Once you have selected a photo, click Upload and it will be copied onto the web server. The progress of the upload can be monitored in the area below the file and folder panels.

Before you upload a picture, you should check its size. Your overall file storage limit should not be exceeded and the size must not exceed Single file upload limit of your plan (See under Single file upload limit). You can use Microsoft Image Viewer/Editor or any similar utility to resize and compress pictures.

5. You can browse through your pictures which have already been uploaded in the current folder (defaulted to "Pictures"), or by clicking on the plus signs next to the folders on the folder panes to go to any subfolders that you may have created. Once you find the image you want, click on it to select it.

6. You can also change the picture's options:

• Tooltip - provides alternative or substitute text when the picture is not shown
• Size - adjust the display size of the picture. You can choose from preset options or create a custom size.
  • Link to original - if you adjust the display size of your picture, clicking on the picture on your page will open up the original in a new window
• Border - place a black border around the outside of your image.
• Text Flow - change how the picture is positioned in relation to the surrounding text.

For more advanced options, you can go into HTML mode and edit the picture <img> tag parameters.

7. Click "Insert picture" to place the image on your web page and wait (usually it takes a few seconds). Once the picture has been uploaded, it will appear in the list.

Troubleshooting

Thumbnails of some images added to 'Insert image' dialog are not shown in File Management or in Wild Apricot

Each computer image uses a color model in which all colors are described as a mixture of four process colors. You can get more information on color spaces by clicking here

Some images have a special color space called CMYK meant for offeset printing (these can be .gifs, .jpgs, or .png images). This CMYK color space cannot be properly processed by Windows systems, which is why they won't show in Internet Explorer - the supported color space format is RGB.

To determine an image's color space format or to convert the image to RGB format see Determining and converting image color space

Images with Transparency

If you are using a image with a transparency (i.e., PNG or GIF ) you will lose the transparency if you use the Wild Apricot image size options. If you would like to keep the transparency you will need to upload it without modifying its size.

See also

File Management
Working with WebDAV