LogoLogo
Go to websiteContact Sales
  • Getting Started
  • Routing
    • Overview
    • Form Router
      • Distribution Method
      • Install Router on Framer
    • Click Router
  • routing forms
    • Overview
    • Custom HTML Form
    • HubSpot Form
    • Marketo
  • Routing Rules
    • Overview
    • Ownership Rules
    • Distribution Rules
      • Distribution History
  • Event Types
    • Overview
    • Create an Event Type
  • teams
    • Create a Team
  • Bookings
    • Overview
  • Booking links
    • Create a Booking Link
    • Manage Booking Links
  • CRM
    • HubSpot
    • Salesforce
  • Integrations
    • Calendars
    • Conference tools
    • Chrome Extension
  • Settings
    • Personal Settings
      • Profile
      • My Availability
      • Security
    • Workspace Settings
      • General
      • Members
        • Managing Member Availability
      • Default availability
      • Scheduler Settings
      • Vacation
        • Mark Calendar
      • Email Configuration
      • Calibration
    • Calendar Troubleshooter
Powered by GitBook
On this page
  • Installation Steps
  • Important Notes
Export as PDF
  1. Routing
  2. Form Router

Install Router on Framer

PreviousDistribution MethodNextClick Router

Last updated 3 months ago

Installing a Distro Router on your Framer website enables you to efficiently qualify and route bookings that come from form submissions. This integration connects your Framer forms with Distro, allowing for automated meeting scheduling based on your configured routing rules.

When you integrate Distro with your Framer website:

  • Your form continues to function exactly as before

  • Distro only activates the scheduling widget when a form is submitted

  • There is no interference with your current form setup or data collection processes

Installation Steps

1

Log into your Framer account

2

Navigate to the page where you want to add the Distro router in the sidebar

3

Locate and select the "Settings" option

4

In the Settings panel, scroll down to the "Custom Code" section

5

Look for the textarea labeled "End of <body> tag"

6

Add the following code snippet into this textarea:

<script type="text/javascript" src="https://app.distro.so/inbound.js"></script>
<script type="text/javascript">
window.distro = new Distro({ routerId: 'replaceWithRouterId' })
distro.schedule('#replaceWithFormId')
</script>

Verifying Installation

After adding the code:

  1. Save your changes in Framer

  2. Preview your page to ensure it loads correctly

  3. Test the form submission to confirm that the Distro scheduling process activates

Important Notes

  • The code must be placed in the "End of <body> tag" section to ensure proper loading

  • The form selector (e.g., #contact_sales) must match exactly with your form's ID

  • If you have multiple forms on your page, you'll need to specify the correct form selector

By following these steps, your Framer website will be successfully connected to Distro, enabling automated meeting scheduling for your qualified leads.