Summary: This guide provides essential guidelines for uploading images to Sites, detailing accepted file types (JPG, PNG), the 5MB size limit, crucial file name restrictions (no special characters), and suggested dimensions to ensure your responsive images display optimally across all devices.
Before You Begin
- All images are cropped to fill the space regardless of dimensions.
- Tithely Sites are mobile-friendly and responsive, meaning images will change shape on different devices.
- 📄 Learn more about Using the Crop Focus Feature on Sites
Step-by-Step Instructions
1. Check the Image File Type. [Only JPG, JPEG, or PNG file types are accepted.]
2. Verify the File Size. [Images must be less than 5MB in size. Resize or compress larger files.]
3. Review the File Name Restrictions.
Ensure the file name only includes standard alphanumeric characters (A-Z, 0-9), underscores (_), and hyphens (-).
- Bad Example: summer@2024@pic!.jpg
- Good Example: summer_2024_pic.jpg
4. Upload the image to the desired area on your Site.
5. Use Crop Focus (if needed) to adjust the centering point of the image.
When uploading an image to the site, regardless of if you have the right dimensions, the images will be cropped to fill the space.
Suggested dimensions can be found throughout the site in the same spot you see the option to upload an image. When in doubt, upload an image that is 1500px wide and use crop focusing to adjust how the image is displayed. Since Tithely Sites are mobile-friendly and responsive images will change shape when you view the website on iPhones, Androids and Tablets. We suggest using a generic image that will look good regardless of how it is resized.
Area on Site |
Dimensions in Pixels |
Full-Width Static Page Header (including home page) |
2000px wide Banner images will be centered vertically and horizontally by default. |
Ministries, News, Events, Blog, Sermons |
1500px wide x 784px high |
User/Staff Members |
240px wide x 360px high (portrait orientation) |
Gallery Block Layout 5 |
1115px wide x 372 px high
|
Legacy Scrolling Slideshow |
1140px wide x 350px high |