MirandaPlace Docs
Images & Galleries
Images & Galleries controls how MirandaPlace prepares product images and presents them in detail-page galleries.
Use this page to configure image sizes and formats, select the default gallery, and customize the behaviour of each gallery type.
To access these settings, go to:
Components → MirandaPlace → Appearance → Product images
Upload and manage individual photos in the product or content editing form.
Managing Product Photos
Each product or content item has its own images.
Use the item’s editing form to upload photos, arrange their order, select the cover image, and remove images that are no longer needed.
The cover image represents the item in product listings. The gallery presents the images on its detail page.
Maximum Number of Images
The image limit determines how many photos can be associated with an individual product or content item.
Set this according to the amount of visual information your project requires.
Image Folder
The image folder setting defines where MirandaPlace stores product photos within the website.
The page displays the folder currently in use.
Once product images have been uploaded, this location cannot be changed through this setting. The field is not a tool for moving an existing image collection.
Product photos are separate from the private storage used for protected downloads and documents.
MirandaPlace creates display versions of uploaded photos while preserving the original files.
These versions allow the frontend to serve images suited to different display sizes.
Generated Image Sizes
Enter the required widths in pixels, separated by commas.
For example:
480,960,1440
This creates versions at the configured widths, allowing the browser to select an appropriate available image for the display.
The default values provide a starting point for most projects.
Generated Image Shape
Choose how generated images are proportioned:
Setting | Result |
|---|---|
Original | Preserves the original proportions without cropping. |
1:1 | Creates square images. |
4:3 | Creates rectangular images in a 4:3 ratio. |
16:9 | Creates wide rectangular images. |
Fixed proportions may crop the edges of generated copies. Original files remain unchanged.
Choose a ratio that suits your photography, especially when the subject needs to remain fully visible.
WebP
Enable WebP to make WebP versions available where supported by the server.
When enabled and available, the gallery uses these versions. JPG versions provide the alternative when WebP is disabled or unavailable.
WebP Image Quality
Higher quality values preserve more detail but generally produce larger files.
The default value is 82. Adjust it only when your images require a different balance between detail and download size.
This setting applies to generated WebP images, not to the original uploaded files.
Preparing Images
The Prepare images when saving setting controls when generated versions are prepared:
- Yes — prepare them during the product image-saving process. Saving may take longer.
- No — prepare them when first requested for display.
Saving the image configuration does not perform a bulk rebuild of every existing product image.
MirandaPlace provides four gallery types. Each displays a main photo with a fade transition between images.
Gallery type | Presentation |
|---|---|
Thumbnails on the right | Main photo with a vertical preview column on the right. |
Thumbnails below | Main photo with previews arranged underneath. |
Thumbnails on the left | Main photo with a vertical preview column on the left. |
Dots without thumbnails | Main photo with navigation dots instead of preview images. |
Select the gallery you want to use as the global default.
All four gallery types remain available to categories. Selecting a default does not disable the other types.
Independent Gallery Settings
Each gallery type has its own configuration.
Use Customize this gallery to adjust a type’s settings, including types that are not currently selected as the global default.
This allows different categories to use different gallery presentations while sharing centrally managed settings for each type.
The available controls depend on the gallery type.
Photo Transitions
Photo transition duration controls how long the fade between images takes.
Values are expressed in milliseconds:
- 400 ms equals 0.4 seconds.
- Lower values produce faster transitions.
- Higher values produce slower transitions.
Automatic Photo Changes
Enable Change photos automatically to cycle through the gallery.
Use Pause between photos to set the interval between automatic changes.
For example, 5000 ms equals five seconds.
When automatic changes are disabled, the displayed photo remains until the visitor uses the gallery navigation.
Main Photo Navigation
Enable Arrows on the main photo to display previous and next controls.
The Dots without thumbnails gallery also provides a setting for showing or hiding its navigation dots.
Keep a visible navigation method available when visitors need to browse several photos.
Thumbnail Appearance
For galleries with thumbnails, configure:
- preview width and height;
- space between previews;
- space between the main photo and thumbnails;
- arrows for scrolling the previews.
The left and right thumbnail galleries also provide a Preview column height setting.
A taller preview column can display more thumbnails at once.
Thumbnail dimensions control the small previews within the gallery. They are separate from the generated image widths configured in the general image settings.
Category Gallery Selection
A category can use an inherited gallery or select a specific gallery type through
Category gallery mode.
MirandaPlace resolves the gallery type in this order:
- The gallery explicitly selected for the current category.
- A gallery inherited from its parent categories.
- The global default configured in Product images.
Although the inherited option is labelled Inherit global setting, parent categories are checked before the global default is used.
Shared Settings for Each Type
A category selects the gallery type. The settings for that type remain managed centrally in Product images.
For example, two categories using Thumbnails below share that gallery type’s transition, navigation, and thumbnail settings.
Changing those settings affects both categories.
Product Layout Builder
The Product Layout Builder controls where the Gallery element appears within the detail page.
Images & Galleries controls how that gallery behaves.
When using a custom product layout, include the Gallery element wherever the product photos should appear.
Other Image Displays
Choosing a gallery type does not turn product listing cards or cart images into galleries.
Category images are managed separately in the category editing form. The category’s gallery selection applies to the product or content detail pages associated with it.
Checking the Result
After saving, open a product containing several photos and verify:
- the expected gallery type is displayed;
- image cropping suits the subject;
- arrows, thumbnails, or dots allow navigation;
- automatic changes behave as intended;
- the gallery fits the detail-page layout at desktop and mobile widths.
If a category continues to display another gallery type, check its own selection and the selections of its parent categories.