Manage images

note

Document Builder can support quote and invoice templates. However, even if Document Builder is enabled and accessible through the user interface, additional one-time configuration might be required.
Go to Manage > Marketplace > Settings.
- If DOCUMENT BUILDER appears in the left menu, see Document Builder prerequisites to confirm whether it is configured for invoice templates, quote templates, both, or neither.
- If DOCUMENT BUILDER does not appear in the left menu, either Contact your AppDirect technical representative to request it, or see Invoice templates and Quote templates to create and manage templates instead.

Marketplace Managers can upload images that they want to include on invoices. For each image, the platform returns a unique URL that identifies the image storage location. Use the URLs to reference images when you create image components in JSON templates.For more information on image components, see Build image components.

In Visual editor, the image, when uploaded with the left navigation Image upload option, is visible for preview in the template immediately.

To upload images using JSON editor

1. Go to the Edit JSON page by clicking Manage > Marketplace > Settings > DOCUMENT BUILDER | Manage Templates. Select the type of template to get the listing page. Select documentName | gear icon | Edit JSON.
2. Click Upload Image. A file explorer dialog opens.
3. Navigate to and select the image.
4. Click Open. The dialog closes.
5. Next to the Upload image button, click the up arrow icon. The images list appears.
   • Image—Preview of the uploaded image.
   • Name—Image file name.
   • Generated URL—Unique URL that identifies the image storage location.
   • Upload date—Date the Marketplace Manager saved the file to the AppDirect platform .

To acquire and add an image source URL to an image component

1. Go to the Edit JSON page by clicking Manage > Marketplace > Settings > DOCUMENT BUILDER | Manage Templates. Select the type of template to get the listing page. Select documentName | gear icon | Edit JSON.
2. Next to the Upload image button, click the up arrow icon. The images list appears.
   • Image—Preview of the uploaded image.
   • Name—Image file name.
   • Generated URL—Unique URL that identifies the image storage location.
   • Upload date—Date the Marketplace Manager saved the file to theAppDirect platform .
3. Locate the image in the list.
4. In the image row, click Copy image source.
5. In the JSON editor section, click JSON. The code editor appears.
6. Navigate to the image component or the row where you are building the image component.
7. Paste the URL in the image Source property, in the following format:
   "src": "https://*"
8. (Optional) Click Validate. The error console message bar displays the validation results.
9. Click Preview PDF. The image appears in the invoice preview.
10. Click Save Changes.

To upload images using the Visual editor, see Edit templates with the visual editor .