Product Image
Updated 21 days agoThe Product Image section controls how product visuals are displayed on the product page. Since images play a major role in influencing purchase decisions, this section helps you present them clearly and attractively.
You can customize the layout, appearance, and supporting elements like icons to enhance the overall experience.
Image Attributes
This controls how product images appear.
-
Layout – Choose how images are arranged
-
Ratio – Set the shape of the image
-
Radius – Adjust how rounded the corners appear
-
Image Scale – Choose whether the image fills or fits the container
Transitions
Color – Set the color used in image transitions or indicators
Icon
You can enable or disable icons using the eye button.
Share Icon
-
Enable or Disable – Show or hide the share option
-
Choose or Upload Icon – Select an icon from the library or upload your own
-
Icon Color – Customize the icon color
Advanced Settings
Fine-tune the appearance of the icon container.
-
Background Color – Set the background behind the icon
-
Background Opacity – Adjust transparency
-
Radius – Control corner roundness
-
Padding – Adjust spacing inside the icon container
Border
-
Color – Choose border color
-
Width – Adjust thickness
Background and Spacing
This controls the layout of the entire product image section.
Background:
-
Color – Set the section background color
-
Radius – Adjust corner roundness
-
Padding – Control spacing inside the section
-
Margin – Manage spacing outside the section
Border:
-
Color – Choose border color
-
Width – Adjust thickness
-
Sides – Select which sides should display the border
Benefits:
-
Directly influences purchase decisions
-
Clear images help users understand exactly what they’re buying, which minimizes doubts and improves conversion rates.
-
Improves perceived product value
-
Optimized image layouts ensure users can easily swipe and view products without friction, which is crucial for mobile-first users.
Related Articles
