Import a Bulk Update

This article explains how to add, delete, and modify fields in your documents in bulk via Prismic's Import/Export.


Before Reading

If you haven't already gone through "How to Import Content," we recommend reading the section on updating existing documents.

With our Export/Import tool, you can add, delete, and modify fields in your documents. Here, we'll explain two use cases:

  1. Add an image in existing documents.
  2. Generating new responsive views for existing documents.

1. Add an Image to Existing Documents

This use-case explains how to add the same image to all documents of the same Custom Type.

Let's assume you have an e-commerce website where you need to update an image on every document.

We have a Custom Type of the type "Product" with fields such as Title, Rich text, and Image field. This is the initial JSON structure for this Custom Type:

Copy
{
  "Main": {
    "product_title" : {
      "type" : "StructuredText",
      "config" : {
        "single" : "heading1",
        "label" : "Product title"
      }
    },
    "product_desc" : {
      "type" : "StructuredText",
      "config" : {
        "multi" : "paragraph",
        "label" : "product desc"
      }
    },
    "promotional_image" : {
      "type" : "Image",
      "config" : {
        "constraint" : { },
        "thumbnails" : [ ],
        "label" : "promotional image"
      }
    }
  }

If you export documents of the type "Product" using the Export tool, you'll get all documents in JSON formats like in the following example where you can see that we don't have any image yet:

Copy
{
  "product_title": [
    { 
       "type": "heading1", 
       "content": { 
          "text": "T-shirt", 
           "spans": []
         } 
     }
  ],
  "product_desc": [
    {
      "type": "paragraph",
      "content": {
        "text": "Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed euismod posuere urna.",
        "spans": []
      }
    }
  ],
  "type": "project",
  "tags": [],
  "lang": "en-gb",
}

Modify your JSON file's

To perform the JSON files' bulk changes, open them in a code editor of your preference. We recommend you using Visual Studio Code. Add the new image URL in the JSON of the exported file. The API ID must match the API ID of the Image field in your Custom Type.

Here's how the modified JSON file will look like with the new image for the promotional offer:

Copy
{
  "product_title": [
    { "type": "heading1", "content": { "text": "New product", "spans": [] } }
  ],
  "product_desc": [
    {
      "type": "paragraph",
      "content": {
        "text": "Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse et mi ligula.",
        "spans": []
      }
    }
  ],
   "promotional_image": {
      "origin": {
        "url": "https://i2-prod.belfastlive.co.uk/incoming/article16885927.ece/ALTERNATES/s615/0_GettyImages-1093545710.jpg"
      }
    },
  "type": "product",
  "tags": [],
  "lang": "en-gb",
  "grouplang": "YC7qCRUAACUA4cNp"
}

After making your changes, select and compress all updated JSON files in a ZIP file and re-import them. Then, you should see your promotional_image in all "product" documents.

You just need to make sure that you don't change the file-name for any of the documents. This will ensure that your changes are imported.


2. Generating new responsive views for existing documents

This use-case explains how to add responsive views for an Image field in all documents of the same Custom Type.

When you add a responsive view to an Image field in a Custom Type, you will also need to update the existing documents with this new responsive view. This will not be updated automatically.

In the following example, we have the JSON of a Custom Type of the type "Page" with a Title field and an Image field with a "Mobile" responsive view:

Copy
{
  "Main" : {
    "page_name" : {
      "type" : "StructuredText",
      "config" : {
        "single" : "heading1",
        "label" : "Page name"
      }
    },
    "image" : {
      "type" : "Image",
      "config" : {
        "constraint" : { },
        "thumbnails" : [ {
          "name" : "Mobile",
          "width" : 300,
          "height" : 400
        } ],
        "label" : "Image"
      }
    }
  }
}

If we export the documents of the type "Page" using the Export tool, we'll get all documents in the following JSON formats:

Copy
{
    "page_name": [
        {
            "type": "heading1",
            "content": {
                "text": "Updating responsive views",
                "spans": []
            }
        }
    ],
    "image": {
        "origin": {
            "id": "XsKyWBAAANKx2yr7",
            "url": "https://prismic-io.s3.amazonaws.com/repository-name/image.png",
            "width": 810,
            "height": 680
        },
        "width": 810,
        "height": 680,
        "url": "https://images.prismic.io/repository-name/image.png?auto=compress,format",
        "edit": {
            "background": "transparent",
            "zoom": 1.0,
            "crop": {
                "x": 0,
                "y": 0
            }
        },
        "credits": null,
        "alt": null,
        "provider": "imgix",
        "thumbnails": {
            "Mobile": {
                "origin": {
                    "id": "XsKyWBAAANKx2yr7",
                    "url": "https://prismic-io.s3.amazonaws.com/repository-name/image.png",
                    "width": 810,
                    "height": 680
                },
                "width": 300,
                "height": 400,
                "url": "https://images.prismic.io/repository-name/image.png?auto=compress,format&rect=150,0,510,680&w=300&h=400",
                "edit": {
                    "background": "transparent",
                    "zoom": 0.5882352941176471,
                    "crop": {
                        "x": -88,
                        "y": 0
                    }
                },
                "credits": null,
                "alt": null,
                "provider": "imgix"
            }
        }
    },
    "type": "page",
    "tags": [],
    "lang": "en-us",
}

Modify your Custom Type

Now let's say you want to add a "Tablet" responsive view to the Image field of your documents, your Custom Type JSON will then look like this:

Copy
{
  "Main": {
    "image": {
      "type": "Image",
      "config": {
        "constraint": {},
        "thumbnails": [
          {
            "name": "Mobile",
            "width": 300,
            "height": 400
          },
          {
            "name": "Tablet",
            "width": 600,
            "height": 340
          }
        ],
        "label": "Image"
      }
    }
  }
}

After updating the Custom Type, you'll find the the "Tablet" view remains empty for existing documents using it.

Modify your JSON file's

To automatically populate it for many documents, modify the JSON file you've exported with the origin, id, and url data for the image field.

So your modified JSON files for updating a document will look like this:

Copy
{
    "page_name": [
        {
            "type": "heading1",
            "content": {
                "text": "Updating responsive views",
                "spans": []
            }
        }
    ],
    "image": {
        "origin": {
            "id": "XsKyWBAAANKx2yr7",
            "url": "https://prismic-io.s3.amazonaws.com/repository-name/image.png"
        }
    },
    "type": "page",
    "tags": [],
    "lang": "en-us",
}

Keeping the very basic origin, id, and URL data for the image field, will regenerate the thumbnails of existing responsive views using the default cropping behavior. So, if content editors have made custom adjustments to responsive view from the UI (zooming or cropping) in the past, it's better to keep the existing thumbnails data in the JSON file you'll import to update the documents:

Copy
"thumbnails": {
            "Mobile": {
                "origin": {
                    "id": "XsKyWBAAANKx2yr7",
                    "url": "https://prismic-io.s3.amazonaws.com/repository-name/432bdd1e-e91a-4732-b32f-14aeaa4da2d5_Screen+Shot+2020-05-07+at+11.14.34.png",
                    "width": 810,
                    "height": 680
                },
                "width": 300,
                "height": 400,
                "url": "https://images.prismic.io/repository-name/432bdd1e-e91a-4732-b32f-14aeaa4da2d5_Screen+Shot+2020-05-07+at+11.14.34.png?auto=compress,format&rect=150,0,510,680&w=300&h=400",
                "edit": {
                    "background": "transparent",
                    "zoom": 0.5882352941176471,
                    "crop": {
                        "x": -88,
                        "y": 0
                    }
                },
                "credits": null,
                "alt": null,
                "provider": "imgix"
            }
        }

After making your changes, you can re-import the documents that you have updated. You will need to select and compress all updated JSON files and re-import these. During the import job, Prismic will create the thumbnails associated with the image field in your updated Custom Types. So after the import is done, you should see your "Tablet" view in the documents.


Was this article helpful?
Not really
Yes, Thanks

Can't find what you're looking for? Get in touch with us on our Community Forum.