Getting started

Dropl hosts your clients' videos and photos and gives you a snippet to paste into their website. After launch, clients can update that media themselves, without you editing the site.

By the end of this guide you'll have:

• An account with your first client site
• A video playing on a web page
• A showcase of photos and videos on a web page
• Your team and a client invited

How Dropl is organized

Three words come up everywhere. Learn them once.

You switch between client sites from the dashboard.

1. Create your account

1. Go to Sign up and create your login.
2. Enter your Business or brand name. This is your account name. Teammates see it when you invite them.
3. Enter Your first website. Use your own site or your first client's, like acmebakery.com.
4. Choose what to add first: Showcases or Videos. You can do both later.

Your free trial starts right away and lasts 14 days. No card needed yet.

Add more client sites

Owners and admins can add a site any time:

1. Open Settings → Sites.
2. Under Add a client site, type the site name and click Add site.

How many sites you can add depends on your plan. See Pricing.

2. Upload a video and embed it

1. Open the Library for your client site.
2. Click Upload, or drag files anywhere onto the page.
3. Wait for processing. The video plays as soon as it's ready.

Common formats like MP4, MOV, and WebM work. Each file can be up to 20 GB.

Copy the embed code

Click the code icon on the video, or open its ⋮ menu → Copy embed code. You get a snippet like this:

<div data-dropl-video="Xk3pQ9vLm2"></div>
<script src="https://www.dropl.io/embed/player.js" async></script>

Paste it into the page where the video should play.

Choose who can watch

Open the video and set Visibility under Details:

• Public: anyone can watch, and search engines may list it.
• Unlisted: anyone with the link can watch. Never listed or indexed.
• Private: only people with access to this client site can watch.

You can also add a password, or turn off the video's watch page so it only plays in embeds.

Tip: Need to swap a video later? Replace it from the video's page. The link and every embed stay the same.

3. Create a showcase and embed it

A showcase is a gallery of photos, videos, or both. Changes you make in Dropl show up on the website automatically.

1. In the Library, click New showcase.
2. Give it a title, like "Project gallery", and click Create showcase.
3. Add media:
   • Photos: click Choose photos or drag them in. JPEG, PNG, WebP, AVIF or HEIC, up to 20 MB each and 100 at a time.
   • Videos: click Add videos to pick from this site's library.

Make it look right

All of these are in the showcase's settings:

• Layout: Grid or Collage.
• Grid tiles: Crop to fill for even tiles, or Fit whole item to show each photo uncropped.
• Show category filters: create categories, select items, and use Add to category. Visitors get filter tabs above the showcase.
• "Load more" button: show a few items first, then load the rest on click.

Copy the embed code

Find Embed on a website and click Copy embed code:

<div data-dropl-showcase="k3p9vlm2"></div>
<script src="https://www.dropl.io/embed/showcase.js" async></script>

Only want one category on a page? Pick it under Show before copying. The embed shows just that category, without filter tabs:

<div data-dropl-showcase="k3p9vlm2" data-category="kitchens"></div>
<script src="https://www.dropl.io/embed/showcase.js" async></script>

Note: Private and password-protected videos never appear in a showcase. Make them public or unlisted first.

Where you can paste embeds

Every embed is plain HTML plus a script that runs in the visitor's browser. That means it works almost anywhere:

• Site builders like WordPress, Webflow, and Framer: use their custom HTML or embed block.
• Static sites, including Next.js static exports and sites on Cloudflare Pages: paste it into your page markup.
• Hand-coded sites: paste it into the HTML.

No server code, API keys, or rebuilds needed. Older snippets that use data-dropl-gallery keep working.

4. Invite your team and clients

Dropl has two kinds of people: your team and your clients.

Invite a teammate

1. Open Settings → Members.
2. Under Invite a teammate, enter their email and pick a role.
3. Click Send invite. They get an email with a link to join.

Roles:

• Owner: everything, including billing and the team. Only owners can add other owners.
• Admin: everything, including billing, the team, and client sites.
• Team member: works on every client site. No billing, team, or site settings.

Invite a client

1. Open the client site's Library and click Clients. (Or use Settings → Sites → Clients.)
2. Under Invite a client, enter their email and send.

Clients only see their own site. They can build showcases, upload videos, and copy embed codes, so they can keep their website fresh without you.

Next steps

You're set up. Here's where to go from here:

• Make the player yours: open Settings → Player to set colors and controls for each client site.
• Keep an eye on usage: Usage shows storage and bandwidth for your account.
• Pick a plan: compare Solo, Freelancer, Studio, and Agency on Pricing, then choose one under Billing.
• Questions? Contact us.

More guides are on the way. Browse everything in the docs home.