From Webflow to HubSpot: A High-Converting Landing Page Built for Growth

Two platform pivots. One high-fidelity HubSpot landing page. Complete visibility from campaign source to consultation request. 

Custom HubSpot website design. Governed modules. Zero developer dependency.

Why Saberton Moved Its Landing Page From Webflow to HubSpot 

Saberton needed a long-form landing page to generate free denture-consultation bookings across its eight Ontario locations. The page used Canadian Dental Care Plan eligibility as its primary conversion message. It needed to educate prospective patients, address common concerns, build trust, and encourage visitors to request a consultation.

The design had already progressed through two stages:

• An initial concept created in Lovable.
• A complete redesign produced and approved in Figma.
  

Development initially began in Webflow so the client could review the page in a live build environment. However, a Webflow workspace change removed OneMetric’s collaborator access during development. Restoring access would have delayed the project, but the disruption also raised a more important question:

Should the landing page remain in Webflow when Saberton’s forms, CRM records, campaign attribution, and reporting already operated in HubSpot?

Keeping the page in Webflow would mean connecting two separate platforms for one conversion journey. Moving the landing page to HubSpot would bring the page, form, contact data, and reporting into the same system.

The Webflow to HubSpot Migration Requirements 

The migration could not be treated as a simple page rebuild. The new HubSpot landing page needed to satisfy four requirements.

Preserve the Approved Figma Design

The page included a complex long-form structure with custom iconography, multi-column content, process steps, statistical sections, payment information, FAQs, and multiple conversion points.The migration needed to retain the approved design without reducing it to a standard HubSpot template.

Connect Forms Directly to HubSpot CRM

Every consultation request needed to create or update a contact record directly in HubSpot.The client could not afford missing form submissions, manual imports, or unreliable third-party synchronization.

Maintain Campaign Attribution

Saberton needed to understand which campaigns and traffic sources generated consultation requests. Source and campaign information therefore needed to remain connected from the landing-page visit through to the HubSpot contact record.

Keep the Page Editable

The internal team needed to update content without returning to a developer for routine changes. The page therefore had to be modular and editable while protecting the approved layout.

Evaluating the Migration Options

Before completing the Webflow to HubSpot migration, OneMetric evaluated the available platforms against the same business and technical requirements.

Option 1: Continue the Build in Webflow

Webflow could support the visual design, but it created an unnecessary separation between the landing page and Saberton’s existing HubSpot setup.Continuing in Webflow would require:

• Connecting Webflow forms with HubSpot.

• Synchronizing lead and attribution data.

• Monitoring the integration between both platforms.

• Maintaining an additional website tool.

• Reconciling reporting across separate systems.

   

Webflow could deliver the page experience, but HubSpot was better aligned with the client’s complete lead-management process.

Option 2: Rebuild the Page in Swipe Pages

The client proposed Swipe Pages as an alternative. OneMetric assessed the platform against the approved Figma and found that its component limitations could not support the required design accurately.

The landing page included:

• Multi-column mistake sections.

• Custom icon rows.

• A multi-step treatment process.

• Statistical content blocks.

• CDCP eligibility information.

• Payment-plan content.

• Objection-handling FAQs.

• Multiple long-form conversion sections.

   

Rebuilding the page in Swipe Pages would have required significant changes to the approved design. It was therefore ruled out.

Option 3: Migrate the Landing Page to HubSpot

HubSpot was the only platform that met all four requirements. It supported the custom page structure while also keeping forms, contacts, attribution, analytics, and reporting within Saberton’s existing marketing stack. OneMetric recommended moving the landing-page build from Webflow to HubSpot. The client approved the migration.

How OneMetric Managed the Webflow to HubSpot Migration 

The migration focused on rebuilding the approved experience as a native HubSpot landing page rather than copying Webflow code into another platform.

Step 1: Translating the Figma Design Into HubSpot Sections

The approved Figma was divided into modular HubSpot sections, including:

• Hero and primary conversion area.
• Brand credibility bar.
• Patient empathy and story sections.
• Four Hidden Mistakes content grid.
• Multi-step denture process.
• CDCP eligibility explainer.
• Statistical credibility section.
• Payment-plan information.
• Objection-handling FAQ.
• Closing consultation sections.
  

This allowed the page to preserve its long-form storytelling while remaining manageable inside HubSpot.

Step 2: Building Reusable HubSpot Components

Repeating content patterns were structured as reusable modules rather than one continuous block of code.These included:

• Process-step cards.
• Mistake cards.
• Statistical blocks.
• FAQ items.
• Conversion sections.
  

The modular structure allowed Saberton’s team to update copy and content without rebuilding the layout.

Step 3: Migrating Brand Assets

The approved brand assets were uploaded and managed through HubSpot’s file manager.These included:

• Saberton’s primary logo.
• Custom section icons.
• Sun Life assets.
• Denturist Group of Ontario branding.
• Canadian Dental Care Plan branding.
• Denturist Association of Ontario assets.
• Client-provided photography.
  

HubSpot’s file-management system also supported image delivery and resizing.

Step 4: Rebuilding Responsive Behaviour

The approved design contained several multi-column sections that needed to work across desktop, tablet, and mobile devices. OneMetric implemented responsive behaviour so grids, statistics, and process sections converted into readable single-column layouts on smaller screens.

This was especially important for prospective patients accessing the page through mobile devices.

Step 5: Replacing Cross-Platform Forms With a Native HubSpot Form

A native HubSpot form became the page’s single conversion point. Every CTA on the landing page directed visitors to the same consultation form.Submissions entered Saberton’s HubSpot CRM directly without:

• Middleware.
• CSV exports.
• Manual imports.
• Webflow-to-HubSpot form synchronization.
• Third-party form connectors.
  

Step 6: Connecting Attribution and Reporting

Because the landing page and form were hosted inside HubSpot, the complete conversion journey could be measured within one platform:

Traffic source → Campaign → HubSpot landing page → Consultation form → Contact record

Saberton could use HubSpot’s page, form, contact, and campaign reporting without combining data from separate platforms.

Step 7: Configuring SEO and Tracking

The migrated landing page included:

• SEO title and meta description.
• Canonical URL.
• Open Graph metadata.
• Twitter card settings.
• HubSpot analytics.
• Google Tag Manager integration
  

This preserved HubSpot’s native reporting while supporting downstream advertising and tracking requirements.

Webflow vs. HubSpot: What Changed After the Migration

Challenges During the Webflow to HubSpot Migration 

Platform Requirements Changed Mid-Project

The target platform changed from Webflow to Swipe Pages before HubSpot was selected. OneMetric protected the approved design and business requirements by assessing each platform against the same criteria rather than restarting the project around each new tool.

Webflow Access Was Removed During Development

The Webflow workspace issue could have delayed the project. Instead of waiting for access to be restored, OneMetric used the disruption to review whether Webflow was the right long-term platform.

This led to the stronger HubSpot recommendation.

The Approved Design Exceeded Template-Based Platform Limits

Swipe Pages could not reproduce the complete Figma structure without compromising the design. HubSpot’s flexible module system allowed the page to be rebuilt accurately while remaining editable.

The Landing Page Had a Complex Mobile Layout

The long-form design contained multiple grids, cards, process sections, and conversion areas. Each section required deliberate responsive behaviour to remain readable and usable on mobile devices.

The Client Initially Preferred Other Platforms

The HubSpot recommendation needed to be explained through business value rather than technical preference.

The deciding benefits were:

• Direct CRM integration.

• Cleaner attribution.

• More reliable reporting.

• Fewer platforms.

• No form-data synchronization.

• Easier long-term maintenance.

Planning a Webflow to HubSpot Migration?

If your landing pages live in Webflow while your forms, contacts, campaigns, and reporting live in HubSpot, your conversion journey may be more fragmented than necessary.

OneMetric can help you migrate your Webflow pages to HubSpot while preserving the approved design, CRM connections, attribution, responsive experience, and reporting setup.

→ Book a HubSpot CMS Consultation