Media Library

Upload, organize, and manage all your store's media assets — images, videos, and audio files. All uploads go to Cloudflare R2 storage with presigned URLs for secure access.


Uploading Media

  1. Go to Admin → Media
  2. Click Upload or drag files onto the page
  3. Select files from your computer
  4. Files upload in parallel (up to 50 at once)
  5. Each upload generates a presigned URL from R2
  6. The uploaded file is registered with your store

After upload, media is immediately available in the product editor, category editor, and hero editor.


Supported Formats

Type Formats Max Size
Images JPEG, PNG, WebP, AVIF, GIF 10 MB
Videos MP4, WebM 10 MB
Audio MP3, WAV, OGG 10 MB

Presigned URLs

Media files are stored in Cloudflare R2. When you request a presigned URL:

GET /api/v1/{storePublicId}/uploads/presigned?filename=product.jpg&contentType=image/jpeg

The response includes:

  • uploadUrl — A temporary URL to upload the file directly to R2
  • fileId — A unique identifier for the uploaded file

After uploading to R2, register the file:

POST /api/v1/{storePublicId}/uploads/register
{ "fileId": "...", "filename": "product.jpg", "contentType": "image/jpeg" }

The admin panel handles the presigned URL flow automatically — you just drag and drop files.


Managing Media

The media library shows all uploads with:

  • Thumbnail preview
  • File name
  • File type and size
  • Upload date

You can:

  • Copy URL — Copy the public URL to use anywhere
  • Set Alt Text — Improve accessibility and SEO
  • Delete — Remove the file from R2 and the database

Media Limits

Limit Value
Max file size 10 MB
Max files per upload 50
Parallel upload workers 4
Max retries (failed uploads) 3
Rate limit (per minute) 60 requests
Global rate limit 600 requests/minute

Using Media in Components

Once uploaded, use media URLs in your storefront components:

<ProductImage src="https://media.entaprenua.com/store-xxx/product.jpg" />

<ProductMedia>
  <Grid cols={4} gap={2}>
    <CollectionView>
      <ProductMediaItem />
    </CollectionView>
  </Grid>
</ProductMedia>

The ProductMedia component iterates over a product's media array and renders each item based on its type (image, video, or audio).