Skip to content
Integrations

Integration UI/UX Revamp

Learn how to use the revamped Integration Page in GHL Customer Care with improved UI, faster performance, and simplified integration management.

4 min read881 words6 explained imagesUpdated Wed, 6 May at 7:31 AM
View as markdownOpen in ClaudeOpen in ChatGPT
Each image has a one line explanation. Switch to full detail for the step it belongs to, the fields and buttons involved, examples and the whole procedure.
On this page
  1. What is the Revamped Integration Page?
  2. Key Benefits of the Revamped Integration Page
  3. Card Layout & Navigation
  4. Core Actions: Connect vs Manage
  5. Integration Options (3-Dot Menu)
  6. Search & Discovery
  7. Account Management (Unified Modal)
  8. Form Mapping & Integration Configuration
  9. Error Handling & Notifications
  10. Performance & Reliability Improvements
  11. Frequently Asked Questions

The revamped Integration Page in GHL Customer Care introduces a faster, cleaner, and more structured way to manage all your integrations. With a modern card-based layout, improved performance, and enhanced usability, users can now connect, manage, and troubleshoot integrations more efficiently. 

This update also brings better scalability and consistency across all integrations. Understanding these changes helps you streamline your workflows and improve overall system performance.

TABLE OF CONTENTS

What is the Revamped Integration Page?

The revamped Integration Page in GHL Customer Care is a redesigned interface that centralizes how users discover, connect, and manage integrations. It replaces the legacy layout with a structured, card-based system that improves usability, consistency, and performance while supporting future scalability.

This update ensures that all integrations follow a unified design and interaction model, making it easier to navigate, manage accounts, and resolve issues without confusion. It also introduces standardized actions, improved error handling, and faster load times to enhance the overall experience.

Key Benefits of the Revamped Integration Page

The redesigned experience focuses on usability, performance, and consistency, making integration management more efficient and reliable.

  • Improved User Experience: A clean, card-based layout makes it easier to scan, find, and manage integrations.
  • Faster Performance: Reduced load times and optimized APIs provide a smoother experience.
  • Simplified Management: Unified actions like Connect and Manage streamline workflows.
  • Better Visibility: Clear error indicators and notifications help identify and resolve issues quickly.
  • Enhanced Scalability: Standardized design supports future integrations without inconsistencies.
  • Stronger Security: Backend improvements reduce risks and improve system reliability.

Card Layout & Navigation

The new card-based layout organizes each integration into a consistent and easy-to-understand format, helping users quickly identify available actions and important details without navigating through complex menus.

Each integration appears as a card with:

  • Integration name and logo
  • Short description
  • Primary action button (Connect or Manage)
  • 3-dot menu for additional options
  • The layout is fully standardized across all integrations, ensuring a consistent experience
Card Layout & Navigation (image 1 of 6) What this shows The layout is fully standardized across all integrations, ensuring a consistent experience What this shows Illustrates the "Card Layout & Navigation" section of "Integration UI/UX Revamp". This screenshot appears in the "Card Layout & Navigation" section of "Integration UI/UX Revamp". The text alongside this image reads: The layout is fully standardized across all integrations, ensuring a consistent experience. This part of the guide covers 4 fields, listed below. Immediately after, the guide continues: Understanding the difference between Connect and Manage helps users take the correct action based on the current state of an integration, reducing confusion and improving workflow efficiency. Image 1 of 6 What this coversThe layout is fully standardized across all integrations, ensuring a consistent experience
Fields in this part of the guide Integration name and logoShort descriptionPrimary action button (Connect or Manage)3-dot menu for additional options
Next stepUnderstanding the difference between Connect and Manage helps users take the correct action based on the current state of an integration, reducing confusion and improving workflow efficiency.
All 4 steps in this procedure
  1. Integration name and logo
  2. Short description
  3. Primary action button (Connect or Manage)
  4. 3-dot menu for additional options

Core Actions: Connect vs Manage

Understanding the difference between Connect and Manage helps users take the correct action based on the current state of an integration, reducing confusion and improving workflow efficiency.

  • Connect:
    • Used when no account is linked
    • Starts the process of connecting a new integration
  • Manage:
    • Appears when an integration is already connected
    • Redirects to settings or allows management of linked accounts
Core Actions: Connect vs Manage (image 2 of 6) What this shows Understanding the difference between Connect and Manage helps users take the correct action based on the current state of an integration… What this shows Illustrates the "Core Actions: Connect vs Manage" section of "Integration UI/UX Revamp". This screenshot appears in the "Core Actions: Connect vs Manage" section of "Integration UI/UX Revamp". The text alongside this image reads: Understanding the difference between Connect and Manage helps users take the correct action based on the current state of an integration, reducing confusion and improving workflow efficiency. This part of the guide covers 5 fields, listed below. Immediately after, the guide continues: These actions dynamically update based on whether an integration is already configured. Image 2 of 6 What this coversUnderstanding the difference between Connect and Manage helps users take the correct action based on the current state of an integration, reducing confusion and improving workflow efficiency.
Fields in this part of the guide Connect:Used when no account is linkedStarts the process of connecting a new integrationManage:Appears when an integration is already connected
Next stepThese actions dynamically update based on whether an integration is already configured.
All 2 steps in this procedure
  1. Connect:
  2. Manage:

These actions dynamically update based on whether an integration is already configured.

Integration Options (3-Dot Menu)

The 3-dot menu provides quick access to integration-specific actions, allowing users to manage settings, troubleshoot issues, and perform advanced configurations without leaving the Integration Page.

Available options may include:

  • Support documentation
  • Form mapping
  • Troubleshooting tools
  • Disconnect options (per account or integration)
  • Integration settings
Integration Options (3-Dot Menu) (image 3 of 6) What this shows Support documentation Form mapping Troubleshooting tools Disconnect options (per account or integration) Integration settings What this shows Illustrates the "Integration Options (3-Dot Menu)" section of "Integration UI/UX Revamp". This screenshot appears in the "Integration Options (3-Dot Menu)" section of "Integration UI/UX Revamp". The text alongside this image reads: Support documentation Form mapping Troubleshooting tools Disconnect options (per account or integration) Integration settings. This part of the guide covers 5 fields, listed below. Immediately after, the guide continues: The built-in search functionality allows users to quickly locate integrations, especially useful for accounts with many connected services. Image 3 of 6 What this coversSupport documentation Form mapping Troubleshooting tools Disconnect options (per account or integration) Integration settings
Fields in this part of the guide Support documentationForm mappingTroubleshooting toolsDisconnect options (per account or integration)Integration settings
Next stepThe built-in search functionality allows users to quickly locate integrations, especially useful for accounts with many connected services.
All 5 steps in this procedure
  1. Support documentation
  2. Form mapping
  3. Troubleshooting tools
  4. Disconnect options (per account or integration)
  5. Integration settings

Search & Discovery

The built-in search functionality allows users to quickly locate integrations, especially useful for accounts with many connected services.

  • Search bar located at the top of the page
  • Filters integrations in real time as you type
  • Helps reduce time spent scrolling through integrations
Search & Discovery (image 4 of 6) What this shows Search bar located at the top of the page Filters integrations in real time as you type Helps reduce time spent scrolling through… What this shows Illustrates the "Search & Discovery" section of "Integration UI/UX Revamp". This screenshot appears in the "Search & Discovery" section of "Integration UI/UX Revamp". The text alongside this image reads: Search bar located at the top of the page Filters integrations in real time as you type Helps reduce time spent scrolling through integrations. This part of the guide covers 2 fields, listed below. Immediately after, the guide continues: The unified account management modal centralizes all connected accounts for an integration, making it easier to manage multiple accounts in one place. Image 4 of 6 What to fill inSearch bar located at the top of the page Filters integrations in real time as you type Helps reduce time spent scrolling through integrations
Fields in this part of the guide Filters integrations in real time as you typeHelps reduce time spent scrolling through integrations
Next stepThe unified account management modal centralizes all connected accounts for an integration, making it easier to manage multiple accounts in one place.
All 3 steps in this procedure
  1. Search bar located at the top of the page
  2. Filters integrations in real time as you type
  3. Helps reduce time spent scrolling through integrations

Account Management (Unified Modal)

The unified account management modal centralizes all connected accounts for an integration, making it easier to manage multiple accounts in one place.

  • View all connected accounts in a single modal
  • Mark a primary account
  • Add additional accounts
  • Perform account-specific actions (settings, reconnect, remove)
  • View error indicators for individual accounts
Account Management (Unified Modal) (image 5 of 6) What this shows View all connected accounts in a single modal Mark a primary account Add additional accounts Perform account-specific actions (settings… What this shows Illustrates the "Account Management (Unified Modal)" section of "Integration UI/UX Revamp". This screenshot appears in the "Account Management (Unified Modal)" section of "Integration UI/UX Revamp". The text alongside this image reads: View all connected accounts in a single modal Mark a primary account Add additional accounts Perform account-specific actions (settings, reconnect, remove) View error indicators for individual accounts. This part of the guide covers 3 fields, listed below. Immediately after, the guide continues: Form mapping enables seamless data transfer between external platforms and GHL Customer Care by aligning form fields with CRM fields, ensuring accurate data synchronization. Image 5 of 6 What this coversView all connected accounts in a single modal Mark a primary account Add additional accounts Perform account-specific actions (settings, reconnect, remove) View error indicators for individual accounts
Fields in this part of the guide View all connected accounts in a single modalMark a primary accountView error indicators for individual accounts
Next stepForm mapping enables seamless data transfer between external platforms and GHL Customer Care by aligning form fields with CRM fields, ensuring accurate data synchronization.
All 5 steps in this procedure
  1. View all connected accounts in a single modal
  2. Mark a primary account
  3. Add additional accounts
  4. Perform account-specific actions (settings, reconnect, remove)
  5. View error indicators for individual accounts

Form Mapping & Integration Configuration

Form mapping enables seamless data transfer between external platforms and GHL Customer Care by aligning form fields with CRM fields, ensuring accurate data synchronization.

  • View available forms in a structured list
  • Enable or disable forms using toggles
  • Map form fields to CRM fields using the “Edit Fields” option
  • Save configurations directly within the modal
Form Mapping & Integration Configuration (image 6 of 6) What this shows View available forms in a structured list Enable or disable forms using toggles Map form fields to CRM fields using the “Edit Fields”… What this shows Illustrates the "Form Mapping & Integration Configuration" section of "Integration UI/UX Revamp". This screenshot appears in the "Form Mapping & Integration Configuration" section of "Integration UI/UX Revamp". The text alongside this image reads: View available forms in a structured list Enable or disable forms using toggles Map form fields to CRM fields using the “Edit Fields” option Save configurations directly within the modal. This part of the guide covers 3 fields, listed below. Immediately after, the guide continues: Improved error handling ensures that users can quickly identify and resolve issues without needing complex troubleshooting steps. Image 6 of 6 How to confirmView available forms in a structured list Enable or disable forms using toggles Map form fields to CRM fields using the “Edit Fields” option Save configurations directly within the modal
Fields in this part of the guide View available forms in a structured listEnable or disable forms using togglesMap form fields to CRM fields using the “Edit Fields” option
Next stepImproved error handling ensures that users can quickly identify and resolve issues without needing complex troubleshooting steps.
All 4 steps in this procedure
  1. View available forms in a structured list
  2. Enable or disable forms using toggles
  3. Map form fields to CRM fields using the “Edit Fields” option
  4. Save configurations directly within the modal

Error Handling & Notifications

Improved error handling ensures that users can quickly identify and resolve issues without needing complex troubleshooting steps.

  • Visual indicators highlight connection issues
  • Supports both:
    • Connection-level errors (specific account issues)
    • Integration-level errors (broader issues)
  • Allows faster diagnosis and resolution directly from the UI

Performance & Reliability Improvements

Behind-the-scenes enhancements significantly improve the speed, reliability, and scalability of the Integration Page, ensuring a smoother experience even as more integrations are added.

  • Faster page load times
  • Reduced system resource usage
  • Improved accessibility and usability
  • More reliable API performance
  • Consistent experience across all integrations

Frequently Asked Questions

Q: Will my existing integrations be affected by this update?
No, all existing integrations will continue to work as expected. The update only improves the interface and management experience.

Q: What happens if an integration shows an error?
Error indicators will appear on the integration or account level, allowing you to take corrective actions such as reconnecting the account.

Q: How do I disconnect an integration?
You can disconnect integrations or individual accounts using the 3-dot menu or account management modal, with confirmation prompts for safety.

Q: Why do I see “Manage” instead of “Connect”?
“Manage” appears when an integration is already connected, allowing you to configure or update existing settings.

Q: Can I connect multiple accounts for one integration?
Yes, the unified account modal allows you to add and manage multiple accounts for supported integrations.

Frequently asked questions

What is the Revamped Integration Page?
The revamped Integration Page in GHL Customer Care is a redesigned interface that centralizes how users discover, connect, and manage integrations. It replaces the legacy layout with a structured, card-based system that improves usability, consistency, and performance while supporting future scalability. This update ensures that all integrations follow a unified design and interaction model, making it easier to navigate, manage accounts, and resolve issues without confusion. It also introduces standardized actions, improved error handling, and faster load times to enhance the overall experience.

Was this guide helpful?

Related guides

Setting Up ActiveProspect Consent Tracking On A GHL Customer Care Form & Survey1 min readZoom Integration for Users' Calendar Bookings12 min read · 9 imagesHow to use WebinarKit's GHL Customer Care Integration (Guest Tutorial)2 min read · 1 imagesTwo Way Email Sync for Outlook5 min read · 9 images