File Manager

# Overview

The file manager lets you view, organize, and manage your files easily. You can upload, rename, delete, download and create folder as needed all in one place.

It supports both Local Storage and Cloud Storage (Cloudflare R2 & AWS S3).

#Required File

To use the file manager, you must include one of the following files:

• sitspro/LocalFileManager.php — For managing files stored on your server.
• sitspro/RemoteFileManager.php — For managing files stored on Cloudflare R2 or AWS S3.

Store the selected folder sitspro/ inside your project directory. Once you purchase the license, you can download it from: here.

# Demo

The file manager provides an intuitive way to browse, organize, and manage your files, with features like drag-and-drop uploads, folder navigation, and file actions all in one place.

#Required Configuration

When using the File Manager tool, you must define the directory and configUrl values.

Specify the folder path in the directory key, and the path to either:

• sitspro/LocalFileManager.php (for local storage)
• sitspro/RemoteFileManager.php (for Cloudflare R2 / AWS S3)

inside the sitsFileManager configuration as shown below:

# Local Storage Configuration

    <script>
        window.sitsEditorConfig = {
            appUrl : 'https://yourdomain.com/your-folder/',
            addOns : ['sitsFileManager'],
            sitsFileManager : {
                directory : '{path of the uploaded directory}',
                configUrl : 'https://yourdomain.com/your-folder/sitspro/LocalFileManager.php',
            }
        };
    </script>
    

# Cloud Storage Configuration (R2 / S3)

To use Cloudflare R2 or AWS S3, configure the file manager using RemoteFileManager.php and provide your cloud credentials inside sitspro/DiskStorage-s3-r2.php file.

    <script>
        window.sitsEditorConfig = {
            appUrl : 'https://yourdomain.com/your-folder/',
            addOns : ['sitsFileManager'],
            sitsFileManager : {
                directory : 'bucket-name-or-folder',
                configUrl : 'https://yourdomain.com/your-folder/sitspro/RemoteFileManager.php',
            }
        };
    </script>
    

# Disk Storage

Inside DiskStorage-s3-r2.php (used by RemoteFileManager.php), configure your default driver and storage credentials.

1. Set Default Driver

Choose which storage driver should be used by default:

    private static string $defaultDriver = 'r2'; 
    // Change to 's3' if you want AWS S3 as default

2. Configure Storage Credentials

Update the $config array with your Cloudflare R2 or AWS S3 credentials:

    private static array $config = [

        'r2' => [
            'bucket'     => 'your-r2-bucket-name',
            'endpoint'   => 'https://your-account-id.r2.cloudflarestorage.com',
            'access_key' => 'your-r2-access-key',
            'secret_key' => 'your-r2-secret-key',
            'public_url' => 'https://your-cdn-domain.com/', 
            'region'     => 'auto',
        ],

        's3' => [
            'access_key' => 'your-s3-access-key',
            'secret_key' => 'your-s3-secret-key',
            'region'     => 'your-region (e.g., ap-south-1)',
            'bucket'     => 'your-s3-bucket-name',
            'endpoint'   => null, // Optional (leave null unless using custom endpoint)
            'public_url' => null, // Optional (set if using CDN or custom domain)
        ],
    ];

• bucket – Your storage bucket name.
• endpoint – Required for Cloudflare R2. Not required for standard AWS S3.
• access_key – Storage access key.
• secret_key – Storage secret key.
• region – AWS region (for S3) or auto (for R2).
• public_url – Optional CDN or public access URL.

After configuration, the File Manager will automatically upload, list, delete, and manage files directly from your selected cloud storage (Cloudflare R2 or AWS S3).