Image storage is essential for managing and serving images in various applications and services, ensuring that images are accessible and load quickly when needed. The choice of image storage solution depends on the specific requirements, preferences, and existing infrastructure of the user or organization.
What can image formats be uploaded into the editor?
Stripo platform supports images in PNG, JPG, or GIF formats with a maximum size of 3MB. The maximum image resolution is 4000x4000 pixels.
How to configure image storage?
You have several options to connect your own image storage for your pics.
Choose and configure the most convenient way in the "Settings" → "Workspace" → "Image Storage" menu.
Stripo storage:
Stripo storage is connected by default. It has no capacity or time limits.
You can use this storage absolutely for free.
Custom AWS S3 bucket:
The Custom AWS S3 feature allows you to easily connect your Amazon Web Services S3 bucket to store images.
When choosing this option, you have to fill out the form to set up a connection with your storage. Here is a description of the form fields with specifications regarding what information you need to add to each of them.
Please be sure that the provided account has reading and editing access to your bucket. Look at the Helpers section for more details on configuring your AWS S3 storage and More about AWS credentials.
Azure Blob storage:
Azure Blob storage is a feature that allows you to connect your Azure storage account to store images easily.
To do this, first of all, you need to create a storage account after that, open the settings tab and generate the connection string in your Azure portal account.
Please be advised that you need to copy all the data from the connection string field, including the BlobEndpoint=
Important note: It is crucial to first create the BlobEndpoint= within your Azure account, after which you should add it to the "Azure token" field.
Furthermore, the "Base download URL" field shall remain unpopulated.
Also, please be kindly informed that you should check the "Settings" → "Configuration" tab where the "Allow Blob anonymous access" control should be enabled.
Cloudinary:
We are now also integrated with Cloudinary so you can connect it with Stripo and store your images here.
Let's now check how to find the credentials needed to connect it.
The first step is to go to "Programmable media", move to the "Dashboard" tab in your Cloudinary account, and click on the "Go to API Keys" button.
On top of the page next to the "API Keys" you can find the cloud name, copy it, and paste it to the required field in Stripo while connecting Cloudinary.
Now let's generate a new API key.
After it's generated, you will find it in the list of all the API keys. Copy the API key and API Secret and pass them to our field in your Stripo account.
Google Cloud:
We are now also integrated with Google Cloud so you can connect it with Stripo and store your images here.
Let's now check how to set it up and find the credentials needed to connect it.
Step 1: Create a Project in Google Cloud.
Please open the link and press on the Console;
In the top of the screen, open the "Project Selector" and choose "New Project";
Create the project by filling in the required details:
📝 "Project Name" (needed later in Stripo settings);
🏢 "Organization" (if applicable).
Click Create.
After the project is created, open it through "Notifications" → "Select Project";
or choose it from the list;
Step 2: Create a Storage Bucket.
Inside your Google Cloud project, navigate to "Cloud Storage";
Click on "Buckets" → "Create";
Enter a "Bucket Name" (remember it for later use in Stripo settings).
You can skip the other settings and press "Continue";
Select a "Region" for data storage and click "Continue";
Important Note: The cost of Google Cloud services varies based on your selection here.
Choose "Storage Class" (recommended: Standard) and click "Continue";
Under "Access Control", uncheck "Enforce public access prevention on this bucket" and select "Uniform";
On the next step, leave the default settings "Soft delete policy (For data recovery)" and press on "Create" button;
Important Note: Stripo does not actually delete data from your bucket, instead, we soft delete it.
🌐 Make the Bucket Public:
Go to your newly created "Bucket" → "Permissions" → "Grant Access";
Add "allUsers" as a principal and assign the role "Storage Object Viewer";
Click "Save" and allow public access;
Refresh the page and verify that the bucket’s public access is set to "Public to Internet".
Step 3: Create a Service Account.
Go to the "IAM & Admin" section on the main page;
Click on "Service Accounts" and then "Create Service Account";
Provide a suitable name for the service account and click "Create and Continue";
In the next step, add the "Storage Object User" role and click "Continue";
You can skip the next step Grant users access to this service account (optional) and press "Continue".
Step 4: Generate the Key for the Service Account.
Press on your service account;
Please press on "Keys" → "Add Key" → "Create new key" and choose "JSON" type and click "Create";
Save the downloaded key file to your desktop (this is the third piece of information needed for Stripo);
Step 5: Add the Credentials in Stripo.
Open your Stripo Image Storage settings;
Enter the "Bucket Name", "Project ID", and upload the "Service Account Key";
You’re all set!
Other storages:
We created a way to connect to a custom file system provider (via HTTP protocol) that allows you to use Stripo editor with your file storage, regardless of your technology.
A custom file system provider is an API that allows the Stripo editor to connect your file system to Stripo’s file manager.
If you want to choose Other storage, your server should support 4 types of requests as follows below, and your storage must support chunked-encoding mode.
GET LIST OF FILES
GET: /?guid=GUID_VALUE
Host: YOUR_BASE_URL
Content-Type: application/json
Accept: application/json
Response: [
{
"url":DOC_URL",
"originalName":"DOC_NAME",
"uploadTime":"DOC_UPLOAD_TIME",
"size":DOC_SIZE_IN_BYTES,
"height":DOC_HEIGHT,
"width":DOC_WIDTH,
"thumbnailUrl":"DOC_PREVIEW_URL"
}
]
Where:
- guid - tab identifier with images in the email template.
- url (string) - Mandatory. Absolute URL to the document.
- originalName (string) - Mandatory. Document name.
- uploadTime (long) - Mandatory. Document upload time in milliseconds (unixepoch).
- size (long) - Mandatory. Document size in bytes.
- width (integer) - Optional. Document width in pixels (px).
- height (integer) - Optional. Document height in pixels (px).
- thumbnailUrl (string) - Optional. The absolute url of document preview thumbnail.
UPLOAD FILE TO STORAGE
POST: /
Host: YOUR_BASE_URL
Content-Type: multipart/form-data
Accept: application/json
Body:
"guid":"GUID_VALUE",
"file": MULTIPART_FILE
Response: {
"url":"DOC_URL",
"originalName":"DOC_NAME",
"uploadTime":"DOC_UPLOAD_TIME",
"size":DOC_SIZE_IN_BYTES,
"height":DOC_HEIGHT,
"width":DOC_WIDTH,
"thumbnailUrl:DOC_PREVIEW_URL
}
Where:
with multipart/form-data request body containing fields:
- guid - tab identifier with images in the email template.
- file - the content of the file.
- url (string) - Mandatory. Absolute URL to the document.
- originalName (string) - Mandatory. Document name.
- uploadTime (long) - Mandatory. Document upload time in milliseconds (unixepoch).
- size (long) - Mandatory. Document size in bytes.
- width (integer) - Optional. Document width in pixels (px).
- height (integer) - Optional. Document height in pixels (px).
- thumbnailUrl (string) - Optional. The absolute url of document preview thumbnail.
GET FILE INFO
GET: /info?src=DOC_URL
Host: YOUR_BASE_URL
Content-Type: application/json
Accept: application/json
Response:{
"originalName":"DOC_ORIGINAL_NAME",
"size":DOC_SIZE_IN_BYTES
}
Where:
- src - image URL.
- originalName (string) - Mandatory. Document name.
- size (long) - Mandatory. Document size in bytes.
CLONE DOCUMENTS when copying email templates with images
POST: /clone
Host: YOUR_BASE_URL
Content-Type: application/json
Accept: application/json
Body:
{
"guidFrom":"GUID_VALUE_FROM",
"guidTo":"GUID_VALUE_TO",
"urls": ["DOC_URL1, DOC_URL2] // array of doc urls that should be copied
}
Response:
[
{
"sourceKey":"DOC_URL",
"targetKey":"DOC_URL"
}
]
Where:
- guidFrom - identifier of the tab in the email template, whose images will be cloned.
- guidTo - identifier of the tab in the email template where the images will be cloned.
- urls - array of addresses of images to be cloned.
- sourceKey (string) - URL of the original document that should be copied.
- targetKey (string) - URL of the resulted document that was copied
Basic Authentication is used to send these requests, so please be sure that you specified the correct Login, Password, and API URL in the Stripo Integration menu of your Stripo account.
If you encounter an error when connecting a custom storage:
Sometimes, an error may occur if transfer encoding is not supported. Use our utility to check your storage settings.
You need to download the utility from Github and specify the following parameters:
Set values to bin/application.properties
Specify false in the skipTransferEncoding parameter
3. Run sh bin/run.sh
This makes it easier to understand what requests are being sent from us, and you can see the logs with it
Thank you for taking the time to read our articles. We hope you will find this information helpful.
If you have any additional questions, please email us at support@stripo.email.
We would be glad to talk with you.