Documentation

Flowdrive docs

Secured Files (Memberstack)

Protect files and folders with Memberstack member logins

Last updated: June 5, 2026

Secured Files with Memberstack

Protect files and folders so only your logged-in Memberstack members can view them — on your own site, with your normal <img>, <video>, and link tags.

How it works

  1. Connect Memberstack once — Settings → Integrations → Memberstack. Paste your secret key(s). You can start with just your sandbox key (sk_sb_...) and add the live key when your site goes live.
  2. Make sure the FlowDrive script is on your site — it's the SAME script tag as the upload widget, so if you already use the widget you're done. Otherwise add it (Webflow → Site Settings → Custom Code → Head Code):
html
<script data-fd-id="YOUR_FD_ID" src='https://files.tryflowdrive.com/index.min.js'></script>

Your ready-to-paste snippet (with your real data-fd-id) is in Settings → Integrations on the Memberstack card. One script handles uploads and secured files, on your live domain and your .webflow.io staging site automatically.

  1. Secure a folder or file — in FlowDrive, open any file or folder → ⋯ → Secure → Private → Memberstack. Choose who gets access:

    • All logged-in members, or
    • Members on specific plans (pick plans by name)
  2. Mark your secured files in your markup with data-fd-secure — add this one attribute to any image, video, or link that shows a secured file. It tells the script which elements to authorize, and members with access get the real file swapped in automatically:

html
<!-- Image -->
<img src="https://files.tryflowdrive.com/KSLBd4a4a52" data-fd-secure>

<!-- Video (the attribute on the <video> tag covers its <source> tags too) -->
<video controls data-fd-secure>
  <source src="https://files.tryflowdrive.com/KSLBd4a/versions/v_abc">
</video>

<!-- Download link -->
<a href="https://files.tryflowdrive.com/annual-report.pdf" data-fd-secure download>Download report</a>

In Webflow, select the element → Settings panel (⚙) → Custom attributes → add data-fd-secure with an empty value.

Your URLs stay exactly as they are — thumbnails (?thumbnail), versions, and custom domains (assets.yoursite.com) all keep working. On custom domains the attribute is required (it's how the script finds your files); on files.tryflowdrive.com URLs it's recommended but files are also detected automatically.

Optional — no placeholder flash: put the URL inside the attribute and leave src/href empty. The element loads nothing at all until the visitor is authorized — the real file for members, the placeholder for everyone else:

html
<img data-fd-secure="https://files.tryflowdrive.com/KSLBd4a4a52">

That's it. Visitors without access only ever see the branded placeholder — the file itself never leaves the server unauthorized.

Securing a whole folder

Securing a folder protects everything inside it: all files, all subfolders, and every future upload into it. You'll see a confirmation before it applies.

  • Files you've configured individually keep their own settings — a folder change never overrides them.
  • Making a folder public again unlocks only the files it secured.
  • Moving a file into a secured folder protects it; moving it out releases it.

What visitors see

Visitor Result
Logged-in member (with access) The file, full speed
Logged-in member (wrong plan) A branded "no access" placeholder
Not logged in A branded "log in to view" placeholder
Link shared on another site The placeholder — secured links are dead outside your site
Bots / scrapers / direct downloads The placeholder

Testing on your staging site

Your .webflow.io staging site runs Memberstack in test mode — add your sandbox key (sk_sb_...) in the integration settings and everything works there with your test members. Note: staging uses temporary signed links; your live domain gets full protection.

Troubleshooting

Members see the locked placeholder instead of files

  • The script tag is missing or below other failing scripts — it belongs in the site-wide <head>.
  • The element is missing the data-fd-secure attribute — required on custom file domains, recommended everywhere (see step 4 above).
  • The member's plan isn't in the allowed list for that file/folder.
  • Your site is live but only a sandbox key is connected — add your live key in Settings → Integrations → Manage.

Files show as public after securing

  • Hit ↻ Refresh on the integration card, and check the file's Secure tab — files inside a secured folder show "Protected by its parent folder."

Plans aren't showing in the plan picker

  • Plans appear once at least one member has joined them. Use ↻ Reload in the plan picker, or paste plan IDs manually.

Take control of your file hosting on Webflow.

Ask about Flowdrive on
© 2026 Flowdrive