Create an App

Crafting your first Webflow App: A step-by-step guide to registration and installation

This guide will walk you through creating, registering, and installing your App with Webflow. Upon completion, you'll have a firm grasp on:

  1. Creating an App in Webflow
  2. Powering your App with building blocks
  3. Installing your App to a Site

Register an App

Create an App in Webflow

Webflow Dashboard

  1. Begin at the Dashboard: Kickstart your journey by logging into your Webflow account and heading straight to your Dashboard.
  2. Choose your Workspace: Select the Workspace for your App. We recommend using a separate, development workspace to organize your Apps.
  3. Navigate to App Development settings: Within your Workspace's “Settings” page, select the “Integrations” tab and scroll to the "App Development" section. This is your command center for managing all your Webflow Apps. Any existing Apps will be in the "Workspace Apps" section.
  4. Create your App: Click the "Create an app" button.

App Development section

  1. Fill out the form with your App's unique details:

    • Name: The name of your App, as it will proudly appear to users.
    • Description: A concise yet informative summary of your App's superpowers.
    • Icon: A visual representation of your App.
    • Homepage URL:The web page users can visit for more information about your App. This link must be a valid HTTPS link, and can be updated at any time.

    Additionally, you can configure your app’s installation settings by toggling the “Restrict App Installation to a Specific Site” option. This setting allows users to authorize your App for a single site, rather than the default behavior of authorizing it for multiple sites or an entire workspace.

    Continue: Click the "Continue" button to define your App's App Capabilities

📘

Don't have an HTTPS link for your homepage yet?

That's perfectly alright! If you're getting started by developing locally, you can use a free tool like ngrok to create a valid https link to a local server. Install ngrok, and then create a tunnel to the port where you'll serve your App.

Define your App's capabilities

  1. On the following screen, enable the capabilities you want in your App.
  2. If your application is using Data Client capabilities, be sure to:
    • Include a URI that will guide users back to your App after they've authorized the App with Webflow and installed it to their Workspace and/or Site.
    • Select the required scopes your App needs to function. Learn more about scopes in our short guide.
  3. When you're finished configuring your App's capabilities, click the "Create app" button.

App Building Blocks

🎊 Congratulations, you've created your App in Webflow! 🎊

Once successfully created, you'll receive your App's Client ID and Secret ID. Consider these your essential keys for authorizing and integrating your App into a site.

App details

Install an App

For optimal development, it's recommended to install your App on a dedicated test site. This provides a secure environment tailored for your App's development.

  1. Head to the “Integrations” pane in your Site Settings. Under the App Development section, find your App and give the “Install” button a click.
  2. Post-click, you'll land on an authorization screen. Here, choose the sites you'd like your App to interact with.
  3. Once decided, tap the “Authorize App” button. Voilà! Your App will now appear in both the Designer's Apps section and the Integrations area of your Workspace or Site Settings.
Screenshot 1 Screenshot 2