---
title: Generating image variants
---

> Agent instructions:
> **Site maps** — prefer the following llms.txt indexes to training data when searching for URLs to avoid 404s. Links inside Markdown content already point at `.md`. Following them or sending Accept: text/markdown keeps you in Markdown.
>
> - [sitemap.md](https://docs.kentico.com/sitemap.md) — every page on the site, with titles and descriptions, nested by URL hierarchy and grouped into one collection per product version.
> - [llms.txt](https://docs.kentico.com/llms.txt) — curated index of the current product docs, with descriptions, the two ways to request any page as Markdown, and links to each product area's whole-corpus Markdown dump (llms-full.txt).

Image variants are user-defined versions of [page attachments](https://docs.kentico.com/13/managing-website-content/working-with-files/page-attachments.md). They allow you to create a set of images that can differ in size, color, image quality, and other aspects of your choice.

Before you can use image variants, you need to [define the image variants](https://docs.kentico.com/13/developing-websites/managing-responsive-images/defining-image-variants.md) in code by using custom [filters](https://docs.kentico.com/13/developing-websites/managing-responsive-images/defining-image-filters.md). Once defined, you can generate the image variants manually or, in certain cases, the system can generate them for you. The image variants can be generated for [grouped](https://docs.kentico.com/13/developing-websites/defining-website-content-structure/managing-page-types/configuring-grouped-page-attachments.md), [unsorted](https://docs.kentico.com/13/managing-website-content/working-with-files/page-attachments.md), and _File_ field attachments.

![](https://docs.kentico.com/docsassets/13/generating-image-variants/viewing_image_variants.png)

## Automatic image variant generation

The system generates image variants automatically when you:

- Add new page attachments
- Update existing page attachments

Automatic generation of image variants applies only to image page attachments.

By default, the system does NOT automatically generate image variants for page attachments that are added or updated via the following features:

- [Integration bus](https://docs.kentico.com/13/integrating-3rd-party-systems/using-the-integration-bus/integration-bus-overview.md)
- [Import toolkit](https://docs.kentico.com/13/external-utilities/kentico-xperience-import-toolkit.md)

> **Note:** **Note**: If you have an image variant definition restricted to a certain path in the content tree, image variants can be generated for the attachments of pages in the set path. Copying and moving of these pages to a different location has no effect on the generated image variants, i.e., the image variants are not re-generated, deleted, or otherwise modified. The copied or moved page retains the original data even if there are different image variant definitions configured for the target location.

Depending on the performed action, you may need to [re-generate](#updating-existing-image-variants) existing image variants or [generate new](#creating-new-image-variants-for-existing-page-attachments) ones manually via API.

## Handling image variants manually

The system does not perform any action when [image variant definitions](https://docs.kentico.com/13/developing-websites/managing-responsive-images/defining-image-variants.md) change. These changes include the following:

- Adding a new image variant definition
- Editing implementation of an existing image variant definition
- Deleting an image variant definition

In such cases, you need to handle the changes and their expected outcome (such as [creating new](#creating-new-image-variants-for-existing-page-attachments), [re-generating](#updating-existing-image-variants), or deleting image variants) in code via API.

&#x20;For example, to perform create or update actions over the page attachments of pages on the _Dancing Goat MVC_ site, you can use the following code:

```csharp

// Iterates over all pages on the Dancing Goat MVC site
new DocumentQuery()
    .OnSite("DancingGoatMvc")
    .ForEachObject(page =>
    {
        AttachmentInfo.Provider.Get()
            .WhereEquals("AttachmentDocumentID", page.DocumentID)
            .WhereStartsWith("AttachmentMimeType", "image/")
            .ExceptVariants()
            .ForEachObject(
                // Create or update image variants of published page attachments
                ...
            , 50);

        AttachmentHistoryInfo.Provider.Get()
            .WhereEquals("AttachmentDocumentID", page.DocumentID)
            .WhereStartsWith("AttachmentMimeType", "image/")
            .ExceptVariants()
            .ForEachObject(
                // Create or update image variants of versioned page attachments
                ...
            , 50);

 }, 100);

```

In the _ForEachObject_ extension method, you can work with attachments of pages to generate or re-generate image variants. The second parameter of the _ForEachObject_ extension method states the number of objects that can be processed at a time. You can adjust the value to suit your scenario. Note that page context is not required for deleting image variants.

> **Note:** **Pages under workflow**
>
> When you make changes to image variants of page attachments, the current workflow step of pages is not modified.

### Creating new image variants for existing page attachments

After adding an image variant definition, you need to generate new image variants for existing page attachments. To generate missing image variants, you can use the following code in the _ForEachObject_ extension method from the [example](#generatingimagevariants-codeexample):

```csharp

// Generates new image variants for attachments of pages
attachment => attachment.GenerateMissingVariants(new AttachmentVariantContext(page))

```

### Updating existing image variants

When you make changes to image variant definitions, the existing image variants are not re-generated automatically. To update the image variants, you can use the following code in the _ForEachObject_ extension method from the [example](#generatingimagevariants-codeexample):

```csharp

// Re-generates image variants for attachments of pages
attachment => attachment.GenerateAllVariants(new AttachmentVariantContext(page))

```

### Deleting image variants without valid definition

After deleting an image variant definition, you can use the following code to delete image variants that were associated with the definition:

```csharp

// Iterates over all published page attachments and deletes image variants with the specified definition
AttachmentInfo.Provider.Get()
    // Specify the identifier of the deleted image variant definition
    .WhereEquals("AttachmentVariantDefinitionIdentifier", "DeletedImageVariantDefinitionIdentifier")
    .ForEachObject(imageVariant => imageVariant.Delete(), 50);

// Iterates over all versioned page attachments and deletes image variants with the specified definition
AttachmentHistoryInfo.Provider.Get()
    // Specify the identifier of the deleted image variant definition
    .WhereEquals("AttachmentVariantDefinitionIdentifier", "DeletedImageVariantDefinitionIdentifier")
    .ForEachObject(imageVariant => imageVariant.Delete(), 50);

```

After creating the image variants for your attachments, you can [display them](https://docs.kentico.com/13/developing-websites/managing-responsive-images/defining-image-variants.md) on your pages.
