Split > Image size recommendations
The design of the Split theme is centered around the concept of splitting the screen. The content boxes are calculated based on the screen hight and width where the site is loading to display as 25% - 50% - 100% of the screen height and width (example). This creates a nice symmetry and it was from the beginning the theme main design point.
For this reason, a level of cropping for images in fullwidth sections will always be needed but to minimise this cropping the images sizes that we recommend are:
- for desktop slideshow when using the "split"/50% option: 1920 x 2160px;
- for desktop slideshow when using the full width option: 1920 x 1080px;
- for mobile slideshow: 750x320px;
- for homepage Rich text - background image: 1680 x 1890px;
- testimonials avatar: 150 x 150px.
- video section background: 1920 x 1080px .
- for product images: large images up to maximum 1920px width (Collection pages). Here you might also consider using square images.
- for "image with text" section:
- 1920 x 1080px for one single image in the section
- 1680 x 1890px for two images
- 1680 x 1890px and two images of 680x380px if you have 3 images in this section (deprecated in 3.0)
- 1680 x 1890px, 680x380px and two images of 340x380px if you have 4 images in this section (deprecated in 3.0).
- for Blog posts featured images: 1680 x 1890px.
If you have the available media, double all of these to make sure that you will see sharp images on any screen, no matter how large.
Note 1: For the collection page and also product page images you can have the images either "Natural" or "Cropped" (that will fill the allotted). This is why there isn't a recommend size here but the square images will work better.
Note 2: For the sections where the images are displaying full-width (as "image with text" section or the slideshow), please make sure that you don't have important elements of the image on the edges. A level of cropping is required here in order to have the images fill the boxes on any screen size.