[intro]If you’re creating new Design Images for your EKM online shop, this Guide lists the ideal dimensions for all of the Images used within the Aerial Theme. [/intro]
- Image Banner
- Promo 2UP
- Promo 3UP
- Category Promo Grid
- Text with Image
- Our Brands
- Category Promo Icon
- Category Images
- Dos and Don'ts
Design Images are pictures on your EKM online shop which are neither your logo, Product or Category images. Design Images are used to:
- Depict the ethos and branding of your EKM online shop;
- Promote specific Products and Categories;
- Highlight any current offers and promotions;
- Aid navigation (by being hyperlinked to another page on your EKM online shop).
It’s essential that when you create Design Images for your EKM online shop that they are of the highest possible quality as ultimately, the look of these graphics will determine whether any new customers to your shop click deeper within it.
[remember]When replacing the Design Images, you can use royalty-free images from the likes of Pixabay and Unsplash, but do not be tempted to use pictures from Google without express permission from the copyright holder, or pictures that are watermarked as this will make your EKM online shop look unprofessional and can put customers off.
Banner Product Image - 500px x 400px .png image with a transparent background works best (but this depends on the effect that you're trying to achieve);
Main Banner Background - 1920px x 600px either .jpeg/.png for background:
USP Icons - 40px x 40px .png icon with a transparent background works best:
You’ll need two images measuring 650px x 350px. Images with minimal detail work well here as text can be added on top:
Promo 3UP - 250px x 250px minimum .png product image with a transparent background will shrink to fit the area. Background image is 452px x 320px and should ideally be a plain image with no text or excessive detail:
Category Promo Grid
Large Promo Block - 700px x 300px either .jpeg/.png image type;
Small Promo block - 350px x 250px either .jpeg/.png image type:
These images will 'flex' and change shape, according to the device being used to view your EKM online shop. With this in mind, it's important that you do not include any text within the images themselves, but instead use the separate text fields to ensure that text can be read, regardless of the size of the browser being used to view your EKM online shop.
Text with Image
This section differs slightly from the rest as it offers four different designs and three different heights:
You can select which design and height you’d like to display on your EKM online shop by using the drop-down menus visible when you edit this section:
If you scroll further down, you can also select the Alignment of this section, and whether you’d like to use the Parallax effect on the image:
With all of this in mind, the dimensions of images within the Text With Image section are:
- Design 1: 400px x 400px square, .jpeg/.png image type:
- Design 2: 900px x 400px, either .jpeg/.png image type;
- Design 3: 900px x 400px, either .jpeg/.png image type;
- Design 4: 900px x 400px, either .jpeg/.png image type;
- Section Height Small: 1920px x 300px, either .jpeg/.png image type;
- Section Height Medium: 1920px x 400px, either .jpeg/.png image type;
- Section Height Large: 1920px x 500px, either .jpeg/.png image type.
[tips]If you have ticked the box to use the Parallax effect on the image within this section, you must remember to double the height of the image you use in this area.[/tips]
Brand Image - 150px x 150px .png with a transparent background works best but this depends on the background colour of your image;
Category Pages Only
Category Promo Icon
Category Promo Icon - 80px x 80px .png icon with a transparent background works best here:
Category Image - 500px x 500px either .jpeg/.png image type:
[remember]Before you upload any Design Images to your EKM online shop, you need to upload them to Tinypng or Tinyjpg first to optimise them. Optimising your images means removing superfluous data from the image without affecting the quality of the image itself. This ensures that your Design Images do not negatively impact the page loading speed of your EKM online shop.[/remember]
Dos & Don'ts
- Keep text minimal and to the point;
- Check for spelling mistakes;
- Ensure images a cropped to the right shape and are the minimum size;
- Look at other websites for inspiration.
- Use text within your images where possible - use the separate text field;
- Use watermarked images;
- Don’t forget that your Design Images are as important as your Product Images - these must be high quality to encourage potential customers to click deeper into your EKM online shop.
- How to edit your EKM online shop Homepage
- How to add Categories & Subcategories to your EKM online shop
- How to edit your EKM online shop Category Pages
[contact] If you need our help with your EKM online shop, contact your Ecommerce Expert or the Customer Support Team, who will be able to point you in the right direction. We're open from 8am-6pm weekdays and 9am-5.30pm weekends. If you'd like to suggest a feature or an upgrade on any of the EKM platforms, please let us know on the EKM Suggestions Board. If you have a non-account specific question to ask the EKM Team, join us in EKM Community. If you need some inspiration for your EKM online shop, listen to our podcast on iTunes and Spotify.[/contact]