imagetype

---

The imagetype property allows a user to select from the list of predefined image types configured in Miva’s Image Management system. It is useful when the component needs to dynamically access a specific type of product or category image — such as “main”, “thumbnail”, or “zoom”.

imagetype Definition

{
  "code": "product_image_type",
  "prompt": "Select Product Image Type",
  "type": "imagetype",
  "required": true
}

Supported Fields

Field	Type	Required	Description
code	string	Yes	Unique key used in l.settings:instance.
prompt	string	Yes	Label shown in the admin interface.
type	string	Yes	Must be "imagetype".
required	boolean	No	If true, the user must select an image type.
preview_property_selector	string	No	Used to target preview DOM nodes.
visibility_conditions	object	No	Used for conditional UI logic.

l.settings:instance Structure

:product_image_type:value=main

The value will always be a string matching one of the store’s configured image types.

Template Usage

&mvt:instance:product_image_type:value;

Use the selected image type value to dynamically load the correct image via Miva’s product/category image logic.

Example:

<mvt:assign name="l.image" value="l.settings:product:image_types[ l.settings:product_image_type:value ]" />
<img src="&mvte:image;" alt="">

JavaScript Access

<script>
  var instance = <mvt:eval expr="miva_json_encode( l.settings:instance, '' )" />;
  var selectedType = instance.product_image_type.value;
</script>

defaults Definition

To set a default image type:

"defaults": {
  "product_image_type": {
    "value": "main"
  }
}

This ensures that the component will render with a known fallback type if the user doesn’t select one.

Best Practices

• Use with a product or category property to render specific images via image type.
• Always validate that the image type exists in the store’s Image Management configuration.
• Define a default (main, thumbnail, etc.) to prevent empty output.
• Combine with Miva’s image lookup logic to render dynamic <img> tags based on context.

Complete Example

{
  "code": "category_image_type",
  "prompt": "Category Image Type",
  "type": "imagetype",
  "required": true
}

Output

:category_image_type:value=thumbnail

Template

<mvt:assign name="l.img" value="l.settings:category:image_types[ l.settings:category_image_type:value ]" />
<img src="&mvte:img;" alt="">