Media Upload Handling

ContentBox allows users to embed images, videos, audio files, or add links to uploaded documents directly within the editor. You can enable this feature by providing your own upload logic through the upload parameter.

Enabling Media Upload

To enable media uploads, pass an upload function when initializing ContentBox:

const builder = new ContentBox({
  
		// options...
  
    upload: async (file) => {
        // Your custom file upload logic
        const formData = new FormData();
        formData.append('file', file);

        const response = await fetch('/upload', {
            method: 'POST',
            body: formData,
        });

        const data = await response.json();
        return data; // must return a JSON object containing at least { url }
    },
});

The upload function receives the selected file as a parameter. Your function should:

1. Upload the file to your server or storage service
2. Return a JSON object containing at least { url: 'uploaded-file-url' }

ContentBox will automatically use the returned URL to embed the media in the editor.

Note: Your upload function can save files to your local server, AWS S3, or any other storage service of your choice. The implementation is entirely up to you.

📢 Upgrade Note

For existing users: If you're currently using onImageUpload, onVideoUpload, onAudioUpload, or onFileUpload parameters, they will continue to work without any changes. The new upload parameter is a simplified alternative that handles all media types with a single function. You can upgrade to the new approach at your own pace.