Who can use this feature:
  • Supported on the Team and Enterprise Plans
  • Users with admin or can edit permissions

Exporting as a JSON

In Ditto, you can export copy as a JSON directly in our web-app. In addition to being able to bring text from Ditto projects (and Figma files!) out in developer-friendly formats, the JSON exports in the web-app closely mirror the functionality of our API and can be used to preview what text in Ditto looks like via the API.

To learn more about exporting as a CSV, visit this guide.

Basics

To export text, click the Export icon in the top bar in either a project or your Component Library.

Formats

Our JSON exports support 4 primary formats:

  • Non-Developer Mode JSON
  • Full JSON
  • Flat JSON
  • Structured JSON

Note that in order to access the Full, Flat, and Structured formats, you'll need to turn on Developer Mode for either the project or the Component Library. Additionally, any hidden text in the project will not be included.

Both the flat and structured formats are JSON formats that can be brought directly into most Translation Management Systems, such as Lokalise and Phrase. (See also the variant-specific export, below)

With each of these formats, if you select the "Only include text in blocks" checkbox, it will exclude text from the project that is not included in a block.

Non-Developer Mode JSON

If Developer Mode is not turned on in a project, the JSON export of the project is formatted in the structure of the project itself (frames, blocks) without any IDs for strings.


 {
	"project_name": "[NAME OF PROJECT",
	"exported_at": "[UTC TIME OF EXPORT]",
	"frames": [ //array containing an object per frame
		{
			"frame_name": "[NAME OF FRAME]",
			"blocks": [ //array containing an object per block in this frame
				{
					"block_name": "[NAME OF BLOCK]",
					"block_text": [ //array containing an object per text item in this block
						{
							"text": "[TEXT OF TEXT ITEM]",
							"status": "[STATUS OF TEXT ITEM]", //optional
							"notes": "[NOTES OF TEXT ITEM]", //optional
							"tags": [ ... ], //optional, array of strings
							"variant": { ... } //optional, object mapping variant IDs to variant text
						},
						{ ... }
					]
				},
				{ ... }
			],
			"other_text": [ //array of text not in blocks
				{
					"text": "[TEXT OF TEXT ITEM]",
					"status": "[STATUS OF TEXT ITEM]", //optional
					"notes": "[NOTES OF TEXT ITEM]", //optional
					"tags": [ ... ], //optional, array of strings
					"variant": { ... } //optional, object mapping variant IDs to variant text
				},
				{ ... }
			]
		},
		{ ... }
	]
}

Full JSON


 {
	"project_id": "[ID OF PROJECT",
	"exported_at": "[UTC TIME OF EXPORT]",
	"frames": { //object mapping frame IDs to frames
		"[FRAME ID]": {
			"frame_name": "[NAME OF FRAME]",
			"blocks": { //object mapping block IDs to blocks
				{
					"[BLOCK ID]": { //object mapping text IDs to text items
						"[TEXT ID]": {
							"text": "[TEXT OF TEXT ITEM]",
							"status": "[STATUS OF TEXT ITEM]", //optional
							"notes": "[NOTES OF TEXT ITEM]", //optional
							"tags": [ ... ], //optional, array of strings
							"variant": { ... } //optional, object mapping variant IDs to variant text
						},
						"[TEXT ID]": { ... }
					}
				},
				"[BLOCK ID]": { ... }
			},
			"otherText": [ //text not in blocks
				"[TEXT ID]": {
					"text": "[TEXT OF TEXT ITEM]",
					"status": "[STATUS OF TEXT ITEM]", //optional
					"notes": "[NOTES OF TEXT ITEM]", //optional
					"tags": [ ... ], //optional
					"variant": { ... } //optional, object mapping variant IDs to variant text
				},
				"[TEXT ID]": { ... }
			]
		},
		"[FRAME ID]": { ... },
		...
	}
}

Flat JSON

The flat JSON format exports the strings from the project as a JSON object mapping text API IDs to the text itself.


{
	"[TEXT ID]": "[TEXT OF TEXT ITEM]",
	"[TEXT ID]": "[TEXT OF TEXT ITEM]",
	...
}

Structured JSON

The flat JSON format exports the strings from the project as a JSON object mapping text API IDs to objects containing the text item's metadata (text, status, notes, tags, and variants).


{
	"[TEXT ID]": {
		"text": "[TEXT OF TEXT ITEM]",
		"status": "[STATUS OF TEXT ITEM]", //optional
		"notes": "[NOTES OF TEXT ITEM]", //optional
		"tags": [ ... ], //optional, array of strings
		"variant": { ... } //optional, object mapping variant IDs to variant text
	},
	"[TEXT ID]": { ... },
	...
}

Variant-specific exports

To export text from a single variant in your project or Component Library, use the Variant dropdown to choose from variants currently being used.

Variant-specific JSONs are also useful for localizing your text by separating them into language-specific files.

Didn't find what you were looking for?
Contact Support