Brand and design
Images and media
Upload, file and find images, set focal points, and generate starting points with AI.
- 4 minute read
- 4 interactive walkthroughs
- For everyone adding pictures to a site
Adding images#
Media is the workspace shelf, shared by every website you own. Upload files by dropping them in, or let an image field upload for you the first time you use one. JPEG, PNG, GIF, WebP and SVG are accepted, up to 10 MB each.
SVG is worth a note: it is a drawing rather than a photograph, so it stays sharp at any size. Logos and icons belong in SVG where the source is available.
- Home
- Websites
- Licences
- Templates
- Media
- Cube apps
- Settings
Media
Search by file nameUploadStep 1 of 3
Upload
Drop files in, up to 10 MB each: JPEG, PNG, GIF, WebP or SVG. One upload serves every website in the workspace.
Reduced motion is on, so the walkthrough waits for you. Use the arrows or pick a step.
- 1Open Media and create a folder or two before uploading.
- 2Drop the files in, or upload from an image field where you need them.
- 3Rename anything that arrives with an unhelpful file name.
Folders, search and reuse#
Folders are for people, not for the website: they organise the shelf without changing anything about how images are used. Folders can sit inside folders, three levels deep: open a folder, then New folder makes one inside it. Removing a folder removes the folders inside it too, and their images stay in the library, in no folder.
Pictures uploaded on a product file themselves under Products, in a folder named after the product, and pictures for a category under Categories. Rename the product or category and its folder follows, unless you have renamed the folder yourself. Choosing a picture that is already in the library never moves it.
Right-click a picture, or use its menu, to rename and describe it, download it, copy its link, move it to another folder or delete it. Search finds by file name, so tidy naming at upload pays off. Using the same image in several places is normal and costs nothing; it is one file on the shelf.
- Home
- Websites
- Licences
- Templates
- Media
- Cube apps
- Settings
Media
Search by file nameUploadStep 1 of 4
Folders for people
They organise the shelf without changing anything about how images are used.
Reduced motion is on, so the walkthrough waits for you. Use the arrows or pick a step.
Good to know: A photo used on the home page and in a blog post arrives from one upload. No duplicates, no drift.
Focal points#
Images appear in different shapes around a site: wide in a hero, square in a card, tall on a phone. The focal point tells CubeSites which part must not be cropped away. Drag the dot onto the face or the subject, and every shape crops around it.
A picture that keeps cutting someone's head off in one place is almost always a missing focal point rather than a wrong picture.
- Home
- Websites
- Licences
- Templates
- Media
- Cube apps
- Settings
Media
Search by file nameUploadStep 1 of 2
Drag the dot
The focal point tells CubeSites which part must not be cropped away, whatever shape the image is used in.
Reduced motion is on, so the walkthrough waits for you. Use the arrows or pick a step.
- The subject sits inside the dot
- Checked in a square card and a wide hero
- Descriptions written for every image used
Generating images with AI#
The Generate tab in the image dialog makes a picture from your description: "a van parked outside a terraced house, warm afternoon light". Results cover AI images on the allowance shown in the Media card.
Generated images arrive with an empty description field. Fill it in like any other image, and treat the result as a starting point: replace anything that claims to show a real place, product or person with a real photograph of it.
Choose an image
From the library, or generate one to use as a starting point.
Step 1 of 3
The Generate tab
Beside the library, one tab where images are made rather than found.
Reduced motion is on, so the walkthrough waits for you. Use the arrows or pick a step.
Before you continue: Never use a generated image to show a real customer's job, a real team member or a real product. If it should be a photograph, take one or buy one.
Common questions
Where are uploaded files kept?
In the workspace, hosted with your sites. Nothing is stored with a third party just because a site uses it.
Do big images slow the site down?
Every image is resized and served in modern formats automatically, so a large upload does not weigh on visitors. An absurdly large source file is still worth avoiding.
Related guides
- Change text and imagesType over text where it sits, change images from the library, and keep every image described.The editor
- Add productsProducts, categories, collections, attributes, options, bundles, files and pictures: everything a product can carry.Shop and products
- Logo and site iconPut the logo in the header and the icon in the browser tab, and know where each one appears.Brand and design
Something here out of date, or a step that did not match what you see? Tell us and we will correct the guide. Never send a password or an API token.