Setup Snappy in Webflow

Published on

Install Snappy in Webflow

Adding Snappy to your Webflow site is straightforward and empowers your marketing team to implement optimizations without constant developer involvement.

Overview

  1. Accessing Webflow settings
  2. Adding the Snappy script
  3. Verifying installation
  4. Troubleshooting

Accessing Webflow Settings

To get started with Snappy on your Webflow site:

  1. Log in to your Webflow account
  2. Open the project you want to add Snappy to
  3. In the Designer, click on the Settings panel in the left sidebar
  4. Select Custom Code from the settings options

This will bring you to the area where you can add custom code to your Webflow site.

Adding the Snappy Script

Webflow makes it easy to add custom scripts to your site:

  1. In the Custom Code settings, locate the Head Code section
  2. Paste your Snappy script into this section:
<script src="https://scripts.letsbesnappy.com/YOUR_DOMAIN/admin.js"></script>
  1. Make sure to replace YOUR_DOMAIN with the domain the script should be installed on
  2. Click Save to apply your changes
  3. Publish your site for the changes to take effect on your live website

Your Snappy installation is now live on your Webflow site!

Verifying Installation

To confirm Snappy is working correctly:

  1. Visit your published Webflow site in a web browser
  2. Right-click and select View Page Source
  3. Search (Ctrl+F or Cmd+F) for "letsbesnappy.com" - you should see your script in the head section
  4. Log in to your Snappy dashboard - your Webflow site should appear as a connected site

Troubleshooting

If you're experiencing issues with your Snappy installation on Webflow:

Script not appearing on all pages

Webflow's architecture should ensure the script loads across your entire site, but:

  • Check that you've published your site after adding the script
  • For sites with complex custom code, ensure there are no conflicts with other scripts
  • For password-protected pages, verify the script loads both before and after authentication

Issues with Webflow Editor Preview

The Webflow Editor preview may behave differently than your live site:

  1. Always check your published site to confirm proper installation
  2. Some Snappy features may not work in the Webflow Editor preview mode
  3. Use the "Open Published Site" button in Webflow to test Snappy on your live site

After Webflow updates

When making design changes in Webflow:

  • Your custom code should remain in place through most updates
  • Always check that your script is still present after major site redesigns
  • Re-verify after changing themes or templates

Webflow custom interactions

If you use Webflow's built-in interactions:

  1. Test how these interactions work with Snappy after installation
  2. If needed, adjust the timing of Snappy widgets to work harmoniously with your animations
  3. For complex interactions, consider creating a test page to ensure compatibility

With Snappy successfully installed on your Webflow site, you're ready to start creating widgets, conducting A/B tests, and optimizing your site without waiting for development cycles.

Ready to transform your Webflow site? Login to your Snappy dashboard and begin creating your first optimization today!