Learn how to add a download button to your Framer website, allowing visitors to easily access and save files like PDFs, images, videos, or documents. This step-by-step guide covers everything from linking your file to styling the button for a seamless user experience.

1. Add a 'file' field to your CMS collection

2. Add your file extensions

Specify the types of files that you will be adding. This is a required step.

3. In your CMS entry, attach a file

4. Find the 'download' button from the insert menu and drag onto the page

5. Connect the source to the 'file' field from the CMS

6. Customize the design to match your brand

Utilize the font, icon, styles, and hover controls in the download component to match your site's style.

7. Lock download button until the visitor signs up or completes a purchase

Learn how to display a locked variant on your Framer site based on user conditions—perfect for gating content behind logins, purchases, or memberships. This guide walks you through setting it up step by step.

Thanks for following along!

By adding a download button to your Framer site, you’re giving visitors a simple and intuitive way to access valuable content.

If you have any questions or need assistance, feel free to reach out through our Support page—we’re happy to help!