Skip to main content

Asset Gallery

The Asset Gallery is your centralized hub for managing images, documents, and files used in document templates.

Overview​

Upload, organize, and reuse assets across all your document templates. The gallery supports images, PDFs, Excel files, and more with intelligent organization and powerful search.

Supported File Types​

Images​

  • Formats: PNG, JPG, JPEG, GIF, WEBP
  • Use for: Logos, product images, banners, icons
  • Auto-optimization: Images are automatically compressed and resized

Documents​

  • Formats: PDF
  • Use for: Brochures, catalogs, spec sheets
  • Preview: View PDFs directly in browser

Spreadsheets​

  • Formats: Excel (.xlsx, .xls), CSV
  • Use for: Data exports, price lists, reports
  • Download: Quick download from gallery

File Size Limit: 10MB per file

Uploading Assets​

Drag & Drop Upload​

  1. Navigate to Asset Gallery in the sidebar
  2. Click the Upload button in the header
  3. Drag files into the upload zone or click to browse
  4. (Optional) Add metadata:
    • Name: Custom name (defaults to filename)
    • Description: Notes about the asset
    • Tags: Searchable keywords (e.g., "logo", "2024", "campaign")
  5. Click Upload

Batch Upload: Select multiple files to upload at once. Progress is tracked individually for each file.

Upload Tips​

  • Compress images before uploading for faster loading
  • Use descriptive names to make assets easier to find
  • Add tags to organize assets by campaign, type, or date
  • Create folders before uploading to keep assets organized

Organizing with Folders​

Creating Folders​

  1. Click New Folder button
  2. Enter folder name (e.g., "Product Images", "2024 Campaign")
  3. Select parent folder (optional, for nested folders)
  4. Click Create

Folder Structure​

Create a hierarchy to match your organization:

Marketing/
├── Product Photos/
│   ├── Electronics/
│   └── Accessories/
├── Campaigns/
│   ├── Spring 2024/
│   └── Holiday 2024/
└── Brand Assets/
    ├── Logos/
    └── Icons/

Moving Assets​

Single Asset:

  1. Click the menu (â‹®) on asset card
  2. Select Move to Folder
  3. Choose destination folder
  4. Click Move

Bulk Move:

  1. Select multiple assets (checkboxes)
  2. Click Move in bulk actions bar
  3. Choose destination folder
  4. Click Move

Using Assets in Templates​

Template Designer - Image Component​

  1. Open a document template in the designer
  2. Drag an Image component onto the canvas
  3. Click the image component
  4. In the properties panel, click Select from Gallery
  5. Choose your asset from the gallery dialog
  6. Click Select
  7. The image is automatically inserted with the correct URL

Benefits:

  • ✅ No need to manually enter URLs
  • ✅ Image is automatically sized
  • ✅ Reusable across multiple templates
  • ✅ Update once, changes everywhere

Attachment Designer - PDF/Excel​

  1. Open an attachment template
  2. Add an Image component (for PDFs)
  3. Click Select from Gallery
  4. Choose your asset
  5. Image is embedded in the generated PDF/Excel

Dynamic Images with Variables​

Use assets dynamically based on data:

Product Image: {{product.imageAssetId}}

When generating a document, pass the asset ID:

{
  "product": {
    "imageAssetId": "asset-uuid-123"
  }
}

Preview & Download​

Image Preview​

  1. Click on an image asset card
  2. Preview opens in full-screen dialog
  3. Use zoom controls to zoom in/out (50% - 200%)
  4. Click Download to save locally
  5. Click Close to exit

PDF Preview​

  1. Click on a PDF asset
  2. PDF renders in full-height viewer
  3. Scroll to view all pages
  4. Use zoom controls
  5. Download or print from browser

Spreadsheet Files​

Excel and CSV files show a download prompt:

  1. Click asset card
  2. Click Download File button
  3. File saves to your downloads folder

Searching & Filtering​

Search Assets​

Use the search box to find assets by:

  • Name: Search by filename or custom name
  • Description: Search asset descriptions
  • Tags: Find assets with specific tags

Example: Search "logo" to find all logo images

Filter by Type​

Use the file type dropdown to filter:

  • All Types: Show everything
  • Images: Photos, logos, icons
  • Documents: PDFs
  • Spreadsheets: Excel and CSV files
  • Other: Any other file types

Filter by Folder​

Use the folder sidebar to:

  1. Navigate folder tree
  2. Click a folder to view its assets
  3. Click All Assets to view everything

Sort Options​

Sort assets by:

  • Newest First: Recently uploaded assets first
  • Oldest First: Original uploads first
  • Name (A-Z): Alphabetical ascending
  • Name (Z-A): Alphabetical descending
  • Largest First: Biggest files first
  • Smallest First: Smallest files first

Editing Asset Details​

Update asset information:

  1. Click menu (â‹®) on asset card
  2. Select Edit Details
  3. Update:
    • Name
    • Description
    • Tags (add or remove)
  4. Click Save

Tag Management:

  • Type tag name and press Enter to add
  • Click X on tag to remove
  • Tags are shared across your project

View Modes​

Grid View (Default)​

  • Layout: Card-based grid (3-4 columns)
  • Preview: Thumbnail images
  • Best for: Visual browsing, images
  • Toggle: Click grid icon in header

List View​

  • Layout: Table format
  • Details: Name, type, size, date
  • Best for: Detailed information, sorting
  • Toggle: Click list icon in header

Bulk Operations​

Bulk Delete​

  1. Select assets using checkboxes
  2. Click Delete in bulk actions bar
  3. Confirm deletion
  4. Assets are permanently removed

Warning: Deleted assets are removed from storage. If used in templates, they will show as broken images.

Bulk Export Metadata​

  1. Select assets
  2. Click Export dropdown
  3. Choose format:
    • CSV: Spreadsheet format
    • JSON: Structured data
  4. File downloads automatically

Export includes: Name, type, size, URL, tags, dates

Storage Quota​

View Usage​

The storage usage card shows:

  • Total used: GB used
  • Quota: GB available
  • Percentage: % of quota used
  • Breakdown: Usage by file type

Color coding:

  • 🟢 Green: Under 70%
  • 🟡 Yellow: 70-90%
  • 🔴 Red: Over 90%

Managing Quota​

If quota is full:

  1. Delete unused assets
  2. Compress images before uploading
  3. Upgrade to a higher plan
  4. Contact support for quota increase

Optimize storage:

  • Delete duplicate assets
  • Remove old campaign assets
  • Compress images (use tools like TinyPNG)
  • Use lower resolution for email images

Best Practices​

Organization​

✅ Use folders to organize by campaign, product, or date ✅ Name descriptively (e.g., "logo-primary-2024.png" not "img001.png") ✅ Add tags for easy searching (e.g., "logo", "product", "campaign-spring") ✅ Delete unused assets regularly to free up space

Image Optimization​

✅ Compress before upload - Smaller files improve document generation speed ✅ Use web formats - PNG for logos, JPG for photos, WebP for modern browsers ✅ Resize appropriately - Document images rarely need to be larger than 1200px wide ✅ Keep file sizes under 200KB for optimal performance

Reusability​

✅ Upload once, use everywhere - Same asset in multiple templates ✅ Update centrally - Replace asset to update all templates ✅ Use variables for dynamic images based on data ✅ Create asset library for brand consistency

Security​

✅ Don't upload sensitive data - Assets may be publicly accessible ✅ Use descriptive names without private info - Filenames may be visible in URLs ✅ Review permissions - Project members can see all project assets

Common Use Cases​

Document Campaigns​

  1. Upload campaign assets (hero images, product photos, logos)
  2. Organize in "Campaigns/2024-Spring" folder
  3. Tag with "spring-campaign"
  4. Use in document templates via Select from Gallery
  5. Reuse across multiple documents in campaign

Product Catalogs​

  1. Upload all product images
  2. Create folders by category (Electronics, Accessories, etc.)
  3. Name files with product SKU (e.g., "sku-12345-main.jpg")
  4. Tag by product line
  5. Insert dynamically using {{product.imageAssetId}}

Branding​

  1. Upload logo variations (color, white, black)
  2. Create "Brand Assets" folder
  3. Add subfolders: Logos, Icons, Signatures
  4. Use consistent logos across all templates
  5. Update logo once to update everywhere

Invoice PDFs​

  1. Upload company logo
  2. Upload signature image
  3. Create attachment template
  4. Insert logo from gallery
  5. Generate branded invoices automatically

Keyboard Shortcuts​

  • Ctrl/Cmd + Click - Multi-select assets
  • Shift + Click - Select range of assets
  • Delete - Delete selected assets (with confirmation)
  • Ctrl/Cmd + A - Select all visible assets
  • Escape - Close dialogs

Troubleshooting​

Upload Fails​

"File Too Large"

  • Compress image before uploading
  • File must be under 10MB

"Storage Quota Exceeded"

  • Delete unused assets
  • Upgrade plan for more storage
  • Contact support

"Invalid File Type"

  • Check file is PNG, JPG, GIF, WEBP, PDF, XLSX, XLS, or CSV
  • Convert to supported format

Image Not Showing​

In document template:

  • Check asset hasn't been deleted
  • Verify you have access to the project
  • Re-select asset from gallery

In preview:

  • Wait for image to load
  • Check browser console for errors
  • Try refreshing the page

Can't Find Asset​

  • Use search box with filename or tag
  • Check correct folder is selected
  • Verify asset wasn't deleted
  • Check file type filter isn't excluding it

Next Steps​

Pro Tip: Create a consistent naming convention for assets (e.g., [category]-[name]-[version].ext) to make searching and organization easier as your library grows!