Toggle Side Panel
Cyclr Community
  • Forums
  • Tutorials
  • Documentation
        • User Documentation >>
          • Introduction to Cyclr
          • API Guides
          • How to use Connectors
          • Navigating the Cyclr ConsoleLearn all about your Cyclr Console and configuration
          • Embedding Cyclr in your SaaS
          • Scripting
        • View More...
        • Connector Guides >>
          • Salesforce
          • Microsoft
          • GitHub
          • HubSpot
          • Oracle NetSuite
          • Stripe
        • View More...
  • Resources
    • New Features
    • Cypher
    • DevOps Services
    • Changelog
    • Support Portal
    • Referral Program
    • Blog
    • News Archive
More options
    Sign in
    Cyclr Logo
    Cyclr Logo
    • Forums
    • Tutorials
    • Documentation
          • User Documentation >>
            • Introduction to Cyclr
            • API Guides
            • How to use Connectors
            • Navigating the Cyclr ConsoleLearn all about your Cyclr Console and configuration
            • Embedding Cyclr in your SaaS
            • Scripting
          • View More...
          • Connector Guides >>
            • Salesforce
            • Microsoft
            • GitHub
            • HubSpot
            • Oracle NetSuite
            • Stripe
          • View More...
    • Resources
      • New Features
      • Cypher
      • DevOps Services
      • Changelog
      • Support Portal
      • Referral Program
      • Blog
      • News Archive
    Close search
    Home » User Documentation » Cyclr Console » Embedding Customization

    About Cyclr

    6
    • Introduction to Cyclr
    • Minimum requirements
    • Glossary
    • Errors
    • IP Allow List
    • Legal notices

    Cyclr Console

    14
    • Partner Console Dashboard
    • The Builder
    • Reports
    • Console Configuration
    • General Settings
    • Notifications
    • Embedding Customization
    • Security settings
    • Data retention settings
    • Custom Service Domains
    • Handle transaction errors
    • Payload Size Limitations
    • Performance tips
    • GitHub Integration

    Connectors

    36
    • Introduction to Connectors
    • Connector Installation Overview
    • Connector Settings
    • Handling Connector Releases
    • Connectivity Comparison
    • Connector Guides
    • Application Connectors
      • Introduction to Application Connectors
    • Utility Connectors
      • Introduction to Utility Connectors
      • Counter Storage
      • Cross Updating Preventer
      • Data Tools
      • Entity Cross Ref Storage
      • Generic File
      • Generic File Downloader
      • Generic Form
      • Generic Webhook
      • Data Storage
        • Introduction to Data Storage
        • Global Data Storage
        • Global Object Storage
        • Cycle Data Storage
        • Cycle Object Storage
    • Custom Connectors
      • Introduction to Custom Connectors
      • Methods
      • Triggers
      • Last Successful Run Date
      • Parameters
      • Scripting
      • Data Types
      • Paging
      • Custom Objects
      • Dynamic Custom Fields
      • Automatically Install Webhooks
      • Connector Standards
      • Settings
      • Custom Connector Authentication
      • Rate Limits

    Templates

    17
    • Introduction to Templates
    • Template Settings
    • Create a Template
    • Tools
    • Connectivity Tools
    • Map fields
    • Add Custom Fields
    • Custom Object Method Categories
    • Test Scripts
    • Collection splitting
    • Pass data between two steps
    • Test a template
    • Template versioning
    • Introduction to Cycles
    • Stop a cycle
    • Copy Cycles as Templates
    • Import or Export Templates

    Accounts

    5
    • Introduction to Accounts
    • Account Users
    • Sub Accounts
    • Connector Authentication Link
    • Export or Import Cycles

    Embedding

    17
    • Introduction to Embedding
    • ORBIT
    • Installing a Partner Connector
    • Embed Cyclr in an iFrame
    • Launch
      • Introduction to Launch
      • User Experience
      • Customize Appearance
      • Build Compatible Templates
      • Handle LAUNCH callbacks
      • Deploy LAUNCH
    • Marketplace
      • Introduction to Marketplace
      • Set up a Marketplace
      • Styling Marketplace
      • Deploying a Marketplace
      • Marketplace Callback
      • Marketplace Webhook Callback
      • Marketplace Settings

    API

    19
    • Introduction to the Cyclr API
    • Authentication
    • Authorize Account API calls
    • Install Connectors into an Account
    • Install a Cycle from a Template
    • Step Setup
    • Activate a Cycle
    • Install Connectors
    • Create an Account
    • API Example Walkthrough
    • Connector Authentication
      • Introduction to Connector Authentication
      • API Key Authentication
      • HTTP Basic Authentication
      • OAuth Authentication
    • Data on Demand
      • Introduction to Data on Demand
      • Get Account Connectors
      • Get Connector Methods
      • Call a Connector Method
      • IP Restriction

    Deep Data Ingestion

    3
    • Vector Databases Introduction
    • Preparing and Ingesting Data into Vector Databases
    • Querying & Retrieving Data from Vector Databases

    Real-Time Actions

    6
    • Generic Webhook
    • Introduction to Data on Demand
    • Get Account Connectors
    • Get Connector Methods
    • Call a Connector Method
    • IP Restriction

    Release Notes

    32
    • Introduction to Release Notes
    • 2025
      • 2025-10
      • 2025-09
      • 2025-08
      • 2025-07
      • 2025-06
      • 2025-05
      • 2025-04
      • 2025-03
      • 2025-02
      • 2025-01
    • 2024
      • 2024-12
      • 2024-11
      • 2024-10
      • 2024-09
      • 2024-08
      • 2024-07
      • 2024-06
      • 2024-05
      • 2024-04
      • 2024-03
      • 2024-02
      • 2024-01
    • 2023
      • 2023-12
      • 2023-11
      • 2023-10
      • 2023-06
      • 2023-05
      • 2023-04
    • Archive
      • Archive
      • 2022
      • 2021
    View Categories
    • Home
    • Documentation
    • Cyclr Console
    • Embedding Customization

    Embedding Customization

    1 min read

    These settings allow you to change the appearance of Cyclr when in Accounts, using LAUNCH or Marketplaces.

    Due to caching within Cyclr, allow 1 minute before the changes take effect.

    Application LESS Variables #

    The simplest way to alter the appearance of Cyclr is to change the values of LESS variables.

    For example if the body-background is set to #ccc then the background of Cyclr will change to grey.

    @body-background: #ccc;

    Application Custom CSS #

    If changing the LESS variables is insufficient to provide the customization that you require you can also include you own custom CSS block, this will be included alongside the Application LESS so you can use both as required.

    For example to change the rounded buttons to squares you could use

    .btn-rounded {
        border-radius: 0;
    }

    Header HTML #

    Header HTML allows HTML & JavaScript to be injected into the header of the page.

    <h1>This is a header</h1>

    Footer HTML #

    Footer HTML allows HTML & JavaScript to be injected into the footer of the page.

    <h1>This is a footer</h1>

    Launch Complete HTML #

    Launch Complete HTML allows for the changing of HTML & JavaScript that is displayed at the end of the install process for LAUNCH and Marketplace. For more information, see Handling Launch Callback.

    Connector Callback Error HTML #

    Connector Callback Error HTML allows for the changing of the HTML that is displayed when an error occurs when trying to authenticate a connector.

    The error and error description, returned by the 3rd party, can be used within the HTML by including the {{error}} and {{error_description}} merge fields. For example:

    <p>The following error has occurred: {{error}} - {{error_description}}</p>

    What are your Feelings

    • Happy
    • Normal
    • Sad

    Share This Article :

    • Facebook
    • X
    • LinkedIn
    • Pinterest
    NotificationsSecurity settings
    Page Contents
    • Application LESS Variables
    • Application Custom CSS
    • Header HTML
    • This is a header
      • Footer HTML
    • This is a footer
      • Launch Complete HTML
      • Connector Callback Error HTML

    Company

    • Company
    • About Us
    • Security and Compliance
    • Pricing
    • Blog
    • Branding
    • Embedded iPaaS
    • Release Notes

    Legal

    • Website Terms
    • Privacy Policy
    • Terms and Conditions
    • Data Protection Agreement
    • SLA
    • GDPR

    UK Office

    +44 (0) 3300 102 525

    US Office

    +1 (646) 585-2525

    Cyclr Logo

    White labelled API integration framework for creating & managing in-app SaaS integrations.

    © 2025 Cyclr. All rights reserved.