Images - ClubHouse Online Support

In order to insert an image onto the page it first has to be uploaded. Photos should be uploaded into the Media Libraries section of the website.

There are two ways to upload a photo into the Media Libraries.

Upload images from a particular page in the website into the Media Libraries section.
Directly into the Media Libraries section

Regardless which method is used to upload the photos, once they are uploaded in the Media Libraries section they can be used on different pages on the website.

A few things to consider even before the image is uploaded.

Edit photos from camera - using some sort of photo editor program, it could be something as simple as Paint or complex as Photoshop.
After editing the image, save the image with a new name that is meaningful, this will make it easier to identify the image in the future.
Do not use special characters like" #, $, &, %" in the new image file name
Image files accepted, .jpg, .gif, .png, .bmp.
Recommended maximum file size 500KB, the Media Library will accept files as big as 10 MB (Keep in mind that the resolution size for the photo doesn't have to be very high, if it is over 1 MB in file size the photo will take a long time to upload and it will also take a long time to load up on the website each time.)

Uploading an Image from a Page

1. Login to website and SWITCH TO CLUB CENTRAL
2. Click on PAGES from the DASHBOARD
3. In Edit Mode - Select Page in Content Tree to upload image to
4. Place cursor where the image should be added to the page, in one of the editable (dotted line) boxes
5. Click on INSERT/EDIT IMAGE OR MEDIA icon (looks like a film strip). This will take you to the INSERT IMAGE OR MEDIA window

6. Choose MEDIA LIBRARIES
7. Select the folder that you would like to upload your image to
8. Click UPLOAD to upload an image to the folder

A window will open that allows you to browse your computer/network for the image that you want to use
9. Select Folder that image is saved in
10. Select image
11. Click on OPEN button

The image is now uploaded into the Folder (Contact Us) that was selected in the SiteMedia and can be inserted on to the page or ready to be inserted on to other pages on the website in the future.

Insert an Image into the Content Area

The following are steps to insert an image into the content area if the image is already uploaded into the Media Libraries section.

1. In EDIT Mode, place cursor where the image should be added to the page
2. Click on INSERT/EDIT IMAGE OR MEDIA icon (looks like a film strip). This will take you to the INSERT IMAGE OR MEDIA window

3. Choose MEDIA LIBRARIES
4. Select the folder where the image is located

5. Select image on the right

If the images that are already uploaded are not visible, click on the small triangle pointing down to expand the top half of the screen
After selecting the file, click the small triangle pointing up to minimize the top half of the screen

In the bottom half of the screen, there are a few properties for the selected image that can be modified before inserting the image on to the page. These properties will be discussed in the IMAGE PROPERTIES section below.

Image Properties

Use the following settings to adjust the image specifically for the page in which you are going to insert it.

URL:	the path of the image
Alternate text:	the text that will be displayed when the image is not loaded correctly
Width, Height:	here you can specify the width and height of your image
Unlock ratio	when unlock ratio button displays - currently the ratio is locked = a change to the width will automatically change the height, proportionately. Clicking on this button will Unlock the ratio
Lock ratio	when lock ratio button displays - the width and height are not locked to each other, the width and height can both be manually set, but your image may appear skewed and out of proportion. Clicking on this button will Lock the ratio
Reset size	the reset size button returns the image to its original dimensions
Border width:	the width of the border in pixels around the displayed image; the higher the number of pixels the thicker the line.
Border color:	color of the border around the image; this has no effect when border width is not set. Use the palette icon to select your border color or type in hex color code (i.e. red = #FF0000)
Horizontal space:	the horizontal distance in pixels between the image and the surrounding text; the greater the number of pixels the more space there will be.
Vertical space:	the vertical distance between the image and the surrounding text; the greater the number of pixels the more space there will be.
Align:	align your text to the left or right. By aligning your text to the left or the right your text will automatically wrap around the image.

Editing Inserted Images

After an image is inserted, the properties can still be edited. Here are the steps to edit an image.

1. Click on the Image that needs to be edited.

There will be 8 square nodes surrounding the image that has been selected.

2. Click on the INSERT/EDIT IMAGE or MEDIA icon while the image is selected or right click on the image and choose PROPERTIES

This will take you back to the INSERT IMAGE OR MEDIA page with the image selected and image properties that can be modified.

3. Make necessary changes to Image Properties (In this example a border was added around the image)
4. Click SAVE & CLOSE

Delete Images

After an image has been added to a page and it is no longer needed or the wrong image was selected, the image can easily be deleted from the page.

To remove an inserted image from the page,
1. Click on the Image that needs to be edited. There will be 8 square nodes surrounding the image that has been selected
2, Click on the DELETE button on your keyboard

To remove an image from the Media Library, the image cannot be removed from the Pages section, it has to be accessed directly from the Media Libraries section found on the Dashboard. For more details go to Media Libraries

Was this documentation helpful?

Current rating: 0 (0 ratings)

Looking for Help?

e3 Help>>

cbC Help >>