In short: audit your current embeds, install the Smart Script, import and organize code in Slater with clear load order, validate on staging, then promote to production with a rollback plan.

Before you start

  • Inventory: List all scripts in Project Settings > Custom Code and per‑page embeds; note where each runs and dependencies.
  • Goals: Decide what to centralize (site‑wide utilities, shared components) vs. what can stay page‑local.
  • Baseline: Record current Core Web Vitals and key user flows for before/after comparison.

Step‑by‑step migration

  1. Connect Slater
  • Add the Smart Script to Webflow once. It auto‑detects staging vs. production.
  1. Create files and structure
  • Mirror your current logic into Slater files (e.g., vendors, utilities, components, page scripts).
  • Set explicit load order so dependencies initialize predictably.
  1. Move shared logic first
  • Start with site‑wide utilities and reusable modules. Keep risky or complex page scripts for a later phase.
  1. Test on staging
  • Publish to webflow.io and validate console logs, errors, and interactions.
  • Compare behavior with the original embed still present; then remove the duplicate embed for that scope to avoid double execution.
  1. Roll out incrementally
  • Migrate page groups or features in batches. After each batch, retest forms, animations, and integrations.
  1. Promote to production
  • When staging is stable, publish production. Monitor analytics, error tracking, and on‑page behavior.
  1. Rollback plan
  • Check the history to ensure that previous embed code snippets are available. Create new snapshots if not available.

Tips

  • Keep a migration checklist per feature with owner, test cases, and sign‑off.
  • Use page targeting in Slater to limit new code to specific templates during rollout.

FAQ
Q: How do I ensure scripts initialize in the right order?
A: Drag and drop the files in the left file nav to control the load order of your files.

Q: Do I need separate scripts for staging and production?
A: No. The Smart Script chooses the correct environment automatically.

Q: What about non‑Slater scripts (e.g., external vendors)?
A: You can continue loading vendors via Webflow or add them as external scripts in Slater; Some external scripts require global context and need to be added directly to Webflow.

Sources