Item images should follow these guidelines:

  • Must be PNG, JPG or GIF

  • Item images should be a minimum of 255 pixels wide

  • Size is flexible, BUT huge image files will slow down your site substantially - use 400 x 600 as a rough guideline

  • Recommendation: Save at 70 percent image quality - looks the same but loads up to 20 times faster

Thumbnails

Givecloud automatically manages your item image thumbnails for you. However, there is a setting for Image Thumbnail Size.

This setting allows you to modify the size of the item thumbnail image created for new images. However, it does not change the thumbnail size of existing images, as the thumbnail images are created when item images are uploaded.

You can specify either or both of the thumbnail image width and/or height. The default value (300x?) sets the image width to 300px and the '?' allows Givecloud to choose the image height based on the aspect ratio of the uploaded image. Please note that if you set both the width AND height, Givecloud is forced to crop images based on the implied aspect ratio. On the other hand, if you decide to set both the width AND height, images will be automatically cropped to meet the implied aspect ratio (based on the stated height to the stated width).

Examples:

300x? - fixes width at 300px, height variable
?x300 - fixes height at 300px, width variable
200x300 - fixes width at 200px and height at 300px and new images will be cropped if their aspect ratio does not match 200x300

Please Note: The typical default behaviour is to fix only the width and allow Givecloud to decide on the thumbnail image height based on the original image's aspect ratio. If you wish to have this changed, please contact Givecloud Support and we'll be happy to help you with this.

Images in Page Editor Templates

For any templates using images such as the 'cards' template where the image is at the top

A screenshot of the templates library in the Givecloud admin, with the '3 Cards' template highlighted.

The dimensions don't matter as much as just using images that are all the same size. This is because you can adjust the dimensions of the image in Givecloud to be 100% x auto, which means the image will adjust to being 100% width of the container/card that it is within. The height will scale automatically according to the aspect ratio of the image.

For example, I have used the '3 cards' template in this section and have inserted three different images. These images are 600 x 400, and I have set the dimensions on them to 100% x auto, which means they fit nicely within their container and are all the same height as seen below.

As opposed to if I upload one image that is a different size, for example, 1440 x 809, which I then set to 100% x auto

Banner & Background Images

For any templates where the image is set as a background, such as any of the 'Headline' templates or 'Content Feature,' we recommend a minimum of 1920px wide and variable height.

A screenshot of the templates library in the Givecloud admin with the first line of templates in the 'Sections' tab highlighted.

Did this answer your question?