Direct Sale AI

Media Library

Official guide · English · Version 9c253d0cf11816df

The Media Library is a centralized file management system for all images, videos, documents, and other files used across your store. It supports folder organization, tagging, bulk operations, drag-and-drop uploads, and an integrated image editor.

Accessing the Media Library

Navigate to Dashboard > Media from the sidebar to open the media gallery.

Interface Overview

The Media Library consists of several key areas:

  • Toolbar -- Contains upload, search, filter, view mode, and sort controls.
  • Sidebar -- Shows folders and tags for navigation and organization.
  • File Grid / List View -- Displays your files in either a grid of thumbnails or a detailed list.
  • Detail Panel -- Shows metadata and actions for a selected file.

Uploading Files

Drag and Drop

  1. Drag one or more files from your computer directly onto the media gallery area.
  2. A drop zone will appear. Release the files to begin uploading.
  3. Upload progress is shown for each file.

Upload Button

  1. Click the Upload button in the toolbar.
  2. Select one or more files from your computer using the file picker dialog.
  3. Files are uploaded immediately after selection.

Info: Uploaded files are stored within your account's storage quota. Check your current usage in Dashboard > Billing under the Usage & Limits section.

Browsing and Searching

Use the search field in the toolbar to find files by name. Results update as you type.

File Type Filter

Filter files by type:

  • All -- Show all file types.
  • Images -- JPG, PNG, GIF, WebP, SVG, etc.
  • Videos -- MP4, MOV, AVI, etc.
  • Documents -- PDF, DOCX, XLSX, etc.

Sort Options

Sort files by:

  • Newest first (default)
  • Oldest first
  • Name (A-Z)
  • Name (Z-A)
  • Largest first
  • Smallest first

View Modes

Toggle between two display modes:

  • Grid View -- Displays files as a grid of thumbnails. Ideal for visual browsing.
  • List View -- Displays files in a detailed table with columns for name, type, size, dimensions, and date.

Pagination

Files are displayed 24 per page. Use the pagination controls at the bottom to navigate between pages.

Folders

Organize your files into folders for better structure.

Creating a Folder

  1. Click the New Folder button in the sidebar or toolbar.
  2. Enter a folder name in the dialog.
  3. Click Create to add the folder.
  • Click a folder name in the sidebar to view files within that folder.
  • Click the root/home option to return to all files.

Managing Folders

  • Rename -- Right-click or use the context menu on a folder to rename it.
  • Delete -- Delete a folder from the folder management dialog. Files inside will be moved to the root level.

Tags

Tags provide a flexible way to categorize files across folders.

Creating Tags

  1. Click the Manage Tags option in the sidebar or toolbar.
  2. Enter a tag name and optional color.
  3. Click Create to add the tag.

Applying Tags

  1. Select a file by clicking on it.
  2. In the detail panel, add tags from the tag selector.
  3. Tags can also be applied in bulk (see Bulk Operations below).

Filtering by Tag

Click a tag in the sidebar to filter the gallery to show only files with that tag.

File Details

Click on any file to select it and open the detail panel on the right side of the screen.

The detail panel displays:

Field Description
File Name Editable name of the file.
File Type MIME type (e.g., image/jpeg).
File Size Size in KB or MB.
Dimensions Width x Height in pixels (for images).
Upload Date When the file was uploaded.
URL The direct URL to the file. Click to copy.
Tags Tags assigned to the file.
Folder The folder the file is in.
Alt Text Alternative text for accessibility (editable).

Image Editor

The Media Library includes a built-in image editor for quick edits without leaving the dashboard.

Opening the Editor

  1. Select an image file.
  2. Click the Edit button in the detail panel or file card.

Available Editing Tools

  • Crop -- Crop the image to a custom size or predefined aspect ratios.
  • Resize -- Adjust width and height with aspect ratio lock.
  • Rotate -- Rotate the image in 90-degree increments.
  • Flip -- Flip the image horizontally or vertically.

Saving Edits

After editing, click Save to overwrite the original file or Save as Copy to keep the original intact.

Click on an image thumbnail to open it in a full-screen lightbox view. Use the navigation arrows to browse through images sequentially.

Bulk Operations

Select multiple files to perform bulk actions:

Selecting Files

  • Click individual files while holding Ctrl (Windows) or Cmd (Mac) to select multiple files.
  • Use Select All to select all files on the current page.

Available Bulk Actions

Action Description
Move to Folder Move all selected files to a specific folder.
Add Tags Apply one or more tags to all selected files.
Delete Delete all selected files permanently.

Warning: Bulk delete is permanent. Deleted files cannot be recovered. Make sure you have confirmed the selection before proceeding.

Bulk Delete Flow

  1. Select the files you want to delete.
  2. Click the Delete button in the bulk actions bar.
  3. A confirmation dialog appears showing the number of files to be deleted.
  4. Confirm to proceed with deletion.

Storage Quota

Your media storage is limited by your subscription plan. To check your current usage:

  1. Go to Dashboard > Billing.
  2. In the Usage & Limits section, look at the Storage progress bar.
  3. It shows your used storage versus your plan's limit.

If you are approaching your storage limit, consider:

  • Deleting unused files.
  • Compressing large images before uploading.
  • Upgrading your subscription plan for more storage.

Best Practices

  • Use folders to organize files by purpose (e.g., "Product Images," "Blog," "Banners").
  • Use tags for cross-cutting categorization (e.g., "Sale," "New Arrival," "Hero").
  • Optimize images before upload -- compress and resize to appropriate dimensions to save storage and improve page load times.
  • Add alt text to all product images for better accessibility and SEO.
  • Regularly clean up unused files to stay within your storage quota.