Overview
When embedding the Unlayer editor, there are scenarios where you need strict control over the visual assets used in a design. If you need to prevent end-users from altering predefined template graphics, replacing logos, or uploading new unauthorized images, you can completely disable the "Upload Image" field.
This is achieved structurally by modifying the image tool's configuration to hide the source property editor from the user interface.
Configuration Snippet
To hide the upload field, you must pass the following configuration into your editor's unlayer.init() script:
JavaScript:
unlayer.init({
id: 'editor-container',
projectId: 1234, // Replace with your actual project ID
tools: {
image: {
properties: {
src: {
editor: {
enabled: false // Hides the image upload UI
}
}
}
}
}
});
By setting enabled: false under the src property's editor object, the option to upload, link, or change the image source will be completely hidden from the right-hand property panel when a user selects an image block.
Important Notes
Before implementing this restriction, keep the following technical constraints in mind:
Global Application: Applying this setting in unlayer.init() globally affects all standard image blocks within that editor instance.
Does Not Prevent Deletion: Hiding the upload field only stops the user from changing the image source (src). It does not prevent the user from deleting the image block entirely or duplicating it.
Applies to the UI Only: This disables the user interface for changing the image. If you have custom scripts or external functions that inject image URLs via API, those will still function.
Common Use Cases
Implementing this configuration is highly recommended when:
Brand Compliance: Locking down corporate headers, footers, or company logos so they cannot be accidentally replaced or modified by standard users.
Pre-Approved Templates: Enforcing strict layout compliance where marketing teams provide locked "fill-in-the-blank" templates for sales teams, ensuring core graphics remain untouched.
Restricted Tier Access: Disabling image uploads for free-tier users in your SaaS application, only enabling the feature when they upgrade to a paid plan.
For additional customization options and a full list of configurable properties for the image block, please refer to the official Image Tool Documentation.