# Getting Started
Once you login to the account, on the Welcome page, provide the mandatory information, such as your name, organization name, and website URL, and then proceed by clicking **Next**.
In the '**Code Snippet**' section, simply copy and paste the provided code snippet between the tags of your webpage. Afterward, click on '**Next**' to proceed.
In the '**Extension**' section, install the extension by clicking on 'Install Extension' button. Once the extension is installed successfully then you can see the 'Extension Installed' button. Click on '**Next**' to proceed.
Click on **Finish** to complete your account setup.
# Installing CustomFit Code Snippet
To provide a personalized experience to your website visitors, your initial step is to install the [CustomFit.ai](http://customfit.ai/) code snippet on your website. This installation is a one-time setup and doesn't require modification every time you run a new experience. To successfully complete this installation, you'll need access to your website's source HTML code.
{% hint style="warning" %}
[CustomFit.ai](http://customfit.ai/) does not recommend installing the code snippet through tag managers (such as Google Tag Manager) because that will cause the flicker (visitor can see the default content being replaced by the personalized content).
{% endhint %}
### To add the code snippet
* From the dashboard sidebar, click on '**Settings**' and then click on the '**CustomFit Setup**' option.
* Click '**Copy**' to copy the code snippet.
* Paste the copied code snippet into the **\** tag of your website to personalize and track visitors.
* In the URL field, type the web page's URL where you placed the code snippet, then click Verify to confirm the installation. You will see the success message if the installation was successful.
# Installing the code snippet on Webflow
If you're using Webflow, integrating the CustomFit code snippet into your Webflow sites is a swift and user-friendly process. No coding expertise is needed, making it an effortless installation.
* Log in to your Webflow account.
* Click on the site's **Project Settings**.
* Login to your [CustomFit.ai](http://customfit.ai/) account and copy the code snippet. Paste the copied code snippet into the '**Head Code**' section of your Webflow account.
* Click on **Save Changes**.
* You can check if the code snippet is successfully installed on your website by entering the website URL in the verification section of the [CustomFit.ai](http://customfit.ai/) setup page and then click on the **Verify** button.
# Installing the code snippet on Wordpress
If you're using Wordpress, integrating the CustomFit code snippet into your Wordpress sites is a swift and user-friendly process. No coding expertise is needed, making it an effortless installation.
The easiest way to add a code snippet to WordPress is with a plugin. This method is more flexible and easier to manage than adding the code directly to your theme. For example, [Head & Footer Code](https://wordpress.org/plugins/insert-headers-and-footers/) is a good plugin.
Once the plugin is installed, navigate to Settings by going to tools->Head & Footer Code. On this screen, there are three boxes for the header, footer, and body sections.
Login to your [CustomFit.ai](http://customfit.ai/) account and copy the code snippet. Paste the copied code snippet in 'Scripts in Header' section and click on the 'Save Changes' button at the bottom of the screen. The code will then load to every page of your site.
You can check if the code snippet is successfully installed on your website by entering the website URL in the verification section of the [CustomFit.ai](http://customfit.ai/) setup page and then click on the **Verify** button.
# Installing the code snippet on Wix
If you're using Wix, integrating the CustomFit code snippet into your Wix sites is a swift and user-friendly process. No coding expertise is needed, making it an effortless installation.
* Login to your Wix account.
* Click on **Settings** in the Wix dashboard.
* Click on the **Custom Code** option.
* Click on + Add Custom Code button.
* Login to your [CustomFit.ai](http://customfit.ai/) account and copy the code snippet. Paste the copied code snippet in the '**Paste the code snippet here**' field.
* Enter [CustomFit.ai](http://customfit.ai/) in the 'Name' field to identify the custom code that refers to CustomFit.ai
* You may choose whether to apply the [CustomFit.ai](http://customfit.ai/) code snippet to all pages or just a few pages by selecting the respective option from the 'Add Code to Pages' field.
* Click on 'Apply' button to save the code snippet.
You can check if the code snippet is successfully installed on your website by entering the website URL in the verify section of the CustomFit.ai setup page and then click on the **Verify** button.
# Installing the code snippet on Shopify
If you're using Shopify, integrating the CustomFit code snippet into your Shopify stores is a swift and user-friendly process. No coding expertise is needed, making it an effortless installation. You can add [CustomFit.ai](http://customfit.ai/) code snippet to shopify store in two ways
1. Installing through App
2. Manual Installation
### Installing through CustomFit App
* Login to your Shopify account and click on '**Apps**' from the sidebar.
* Search for the CustomFit app by typing Customfit in the search field, or you can find the CustomFit shopify app [here](https://apps.shopify.com/customfit?st_source=autocomplete).
* Click on the '**Install**' button.
* If you choose to install the CustomFit app, you will be taken to an access screen where you can check exactly what information the app will have access to. Click on the '**Install App**' button.
* After the successful installation of the app, you will be redirected to CustomFit app screen. Login to your CustomFit account and the [CustomFit.ai](http://customfit.ai/) code snippet will be automatically added onto your shopify store.
### Manual installation
* [Login](https://accounts.shopify.com/store-login) to your Shopify account and click on '**Online Store**' from the sidebar. Then click on '**Themes**'.
* Then click on '**Edit Code**' option from your Theme menu.
* Select '**theme.liquid**' file under '**Layout**' section and search for **\** tag on the page.
* Login to your [CustomFit.ai](http://customfit.ai/) account and copy the code snippet. Paste the code snippet just after the \ tag and click on the '**Save**' button.
When you install CustomFit code snippet on to your Shopify store, it is added on all the pages of your store except for 'Check Out' pages.
### Install code snippet on checkout pages
* Click on '**Settings**' which is present at the bottom left of your screen.
* Click on the '**Checkout**' option.
* Under the '**Order status page**' section you will find the '**Additional Scripts**' field. Paste the CustomFit code snippet here and click on '**Save**' button.
# Installing the code snippet on Unbounce
If you're using Unbounce, integrating the CustomFit code snippet into your Unbounce sites is a swift and user-friendly process. No coding expertise is needed, making it an effortless installation.
* Log in to your Unbounce account.
* Click on **Settings** from the sidebar, and then click on the **Script Manager** option.
* Then, click on the "**Add a Script**" button.
* Next, in "Add a Script" popup select the **Custom Script** option.
* Give the **script name** and click on the **Add Script Details** button.
* Login to your [CustomFit.ai](http://customfit.ai/) account and copy the code snippet. Paste the copied code snippet in the '**Paste the code snippet here**' field.
* Select the "**placement"** option as **Head**.
* Select the "**included on"** option as **All**.
* You may choose whether to apply the [CustomFit.ai](http://customfit.ai/) code snippet to all pages or just a few pages by selecting the respective option from the '**Script Usage**' field.
* Finally, click on the **Save and Publish Script** button.
You can check if the code snippet is successfully installed on your website by entering the website URL in the verify section of the CustomFit.ai setup page and then click on the **Verify** button.
{% embed url="" %}
# Installing the code snippet on Salesforce Commerce Cloud
This doc explains how to deploy the CustomFit.ai code snippet inside a Salesforce Commerce Cloud storefront so you can run A/B tests, personalization campaigns, and behavior-based targeting.
**Prerequisites**
Make sure you have:
* Admin access to **Salesforce Commerce Cloud Business Manager**
* Permission to edit ISML templates
* Your CustomFit.ai project script (available in your CustomFit dashboard)
### Step 1: Identify the Global Head Template
CustomFit’s script must load on every page of your storefront.
In most Salesforce Commerce Cloud implementations, the shared `` section is controlled by a template such as:
```
header.isml
```
This template ensures your tracking script runs consistently across homepage, category, product, and checkout pages.
If your project uses a custom structure, locate the ISML file responsible for rendering the `` tag globally.
### Step 2: Insert the CustomFit.ai Tracking Script
Locate the ISML file responsible for rendering the global `` section of your storefront. In most Salesforce Commerce Cloud implementations, this is the `header.isml` template.
You can access it either through your local development environment or directly from Business Manager by navigating to:
**Administration → Sites → Manage Sites → \[Your Site] → Development → Templates**
Once there, open the template file that controls the shared head markup across your site pages.
Insert the CustomFit.ai code snippet inside the `` section of the template. Placing it here ensures the script loads consistently across all storefront pages.
# Account Setup
### Update Domain
One of the essential inputs required to set up the CustomFit account is domain configuration. If the domain is not provided or configured properly, then the traffic will not be consumed. Therefore, it is essential to keep your domain up to date. Follow these steps to update your domain:
* From the dashboard sidebar, click on '**Settings**' and then click on the '**CustomFit Setup**' option.
* In the '**What is the URL of the website you'd like to personalize?'** field, give your domain.
* Once the domain is provided, click on the 'U**pdate'** button.
### Code Snippet
To provide a personalized experience to your website visitors, your initial step is to install the [CustomFit.ai](http://customfit.ai/) code snippet on your website. This installation is a one-time setup and doesn't require modification every time you run a new experience. To successfully complete this installation, you'll need access to your website's source HTML code.
* From the dashboard sidebar click on '**Settings**' and then click on the '**CustomFit Setup**' option.
* Click '**Copy**' to copy the code snippet.
* Paste the copied code snippet into the **\** tag of your website to personalize and track visitors.
### Verify code snippet installation
To verify if the code snippet is installed properly, follow these steps:
* From the dashboard sidebar, click on '**Settings**' and then click on the '**CustomFit Setup**' option.
* In the '**Verify Installation'** field enter the website URL or a particular webpage URL where you have installed the code snippet.
* Once the URL has been entered then click on the '**Verify'** button.
### Install the Chrome extension
The CustomFit.ai extension will empower you to personalize your website without the need for any coding knowledge. With its user-friendly interface and intuitive tools, you can effortlessly edit various elements of a webpage to suit your requirements. Whether it's adjusting layout, colors, fonts, or other design elements, CustomFit.ai provides a seamless editing experience right within your browser.
To install the CustomFit.ai extension in Google Chrome, follow these steps:
* From the dashboard sidebar, click on '**Settings**' and then click on the '**CustomFit Setup**' option.
* Next, click on the '**Install Extension**' button, and you will be redirected to the CustomFit.ai Chrome extension page.
* Once you find the extension, click on the "**Add to Chrome**" button.
The button labelled "**Extension Installed**" will appear if the extension was installed successfully.
# Configuring Account Users
To configure an account's user information, follow these steps:
* Navigate to '**My Account**' settings.
* Provide the first name, last name and then click on the '**Update Profile**' button.
* To change the password, Click on the '[**Change password**](https://dashboard.customfit.ai/settings/changePassword)' link.
* Enter your '**Current password'** and '**New password'**. Then click on the **Change password** button.
# Add Users and Assign Roles
In CustomFit, you have the flexibility to invite new team members to collaborate with you and designate their roles, whether it's as an admin, writer, or reader. This role-based customization becomes particularly valuable in situations where multiple individuals are contributing, allowing you to grant distinct permission levels to each member.
To add a new user
* Click the profile picture icon in the top-right corner, and then select the '**Account Users**' option.
* In the Account Users page, click on the '**Create User**' button.
* Provide the required information such as email id, First name and then select the user role. Click on '**Create**' button to create the new user successfully.
**Admin** has full access to account and billing information.
**Writer** can create, update, delete and view results of experiences.
**Reader** can only view experiences and its results.
# Configuring Subdomains
You can track visitors and goals across multiple domains and subdomains in a CustomFit account. With this setup, you can effectively monitor visitor activity and goal completions across various domains and subdomains, providing valuable insights into visitor behavior.
For instance, if you have a primary domain (e.g., example.com) and several subdomains (e.g., blog.example.com, shop.example.com), you can configure them all in your CustomFit account.
{% hint style="warning" %}
CustomFit.ai code snippet should be installed on all the configured domains and subdomains.
{% endhint %}
### To configure domains or subdomains
* From the dashboard sidebar, click on '**Settings**' and then click on the '**CustomFit Setup**' option.
* Click on the '**Manage Subdomains**' option.
* Click on the '**Add Subdomain**' button.
* In the popup, give your subdomain or domain and click on the '**Add**' button.
* Click on the delete icon to remove the subdomains or domains.
* To edit the configured subdomains or domains, click on the edit icon.
# Configuring Traffic Blocking
The CustomFit dashboard provides a way to configure traffic blocking based on specific criteria, such as IP addresses, referrers, and page paths. Below are the different methods you can use for traffic blocking:
* **Blocking Traffic from Specific IP Addresses.** For example, Adding 192.168.123.34, 192.168.135.32 will block out traffic coming from the given IP addresses. If you want to block multiple addresses, then use commas to separate different IP addresses.
* **Blocking Traffic Based on Referrer.** For example, adding facebook.com will block out referral traffic from any facebook.com URL. Use commas to separate different referrer domains. This will reduce the spam or unwanted traffic originating from certain referrers.
* **Blocking Traffic Based on Specific Page Paths.** For example: adding \* will block out all traffic coming from URL. Use commas to separate different page paths.
### To configure traffic
* From the dashboard sidebar, click on '**Settings**' and then click on the '**CustomFit Setup**' option.
* Click on the '**Advanced Settings**' option.
* If you want to block IP addresses, then enter the IP address in **'IP Addresses to Exclude**' and click on the '**Update**' button.
* If you want to block referrers then enter the referrers in **'From these referrers**' and click on the '**Update**' button.
* If you want to block specific page paths then enter the page paths in **'From these page paths**' and click on the '**Update**' button.
# How to create an A/B test
A/B testing is a method used to compare two versions of a website to determine which one performs better in terms of achieving a specific goal, such as increasing conversions. The variations can involve changes in design, layout, content, calls-to-action, or any other element of the webpage that may impact user behavior.
### Steps to create an A/B test
Start with a hypothesis about what changes might improve the performance of your webpage. For example, you might hypothesise that changing the color of a call-to-action button will increase click-through rates.
#### Create an A/B test
* Log in to the dashboard and navigate to the Experience page from the sidebar.
* Click on the '**Create Experience**' button.
* After giving your A/B test a name and a description, click the "**Create Experience**" button.
#### Add page paths
Add the page path(s) on which you want to run the A/B test. **For example**, if you want to run an A/B test on the pricing page, then enter the pricing page path.
* Click on the '**Add pages**' button.
* From the drop-down, select the required option.
* **Simple page path match**: It checks if the given page path matches exactly.
* **Page path contains**: It checks if the page path contains the given text.
* **Page path regex** matches with: It checks if the page path matches the given regex.
* Enter the page path and click on the '**Add**' button.
#### Create behaviors
You can create multiple behaviors (variations) on your website or webpage. When you create an A/B test, then by default, a default behavior will be created. This will be your default (control) website, and you will not be allowed to delete default behavior. To add the new behavior
* Click on the '**Add Behavior'** button.
* Then give a proper **Name** and **Description** for your behavior.
* Click on the '**Add'** button.
To edit the webpage, click on the '**open visual editor**' button present on the respective behavior.
#### Targeting audience
You can target A/B tests to specific audience segments. This will allow you to gain deeper insights into how different variations resonate with different groups of visitors. For example, you can restrict the A/B test to visitors from the USA using mobile devices.
* Click on the '**Add Rules**' button.
* Choose the **audience category** you wish to target for the A/B test from the popup.
* Then, from the **attribute** dropdown, select one of the attributes. For the above example, the audience category will be geography, and the attribute will be country.
* Then, from the **operation** dropdown, select one of the operations, such as 'is one of' or 'is not one of' based on your requirement. For the above example, the operation type will be 'is one of'.
* Then, provide the **value** in the input field. For the above example, the value will be the United States. You can enter multiple values. In a few of the cases, you can see the dropdown option under the values section.
* Finally, under the **targeting behavior** dropdown, select the percentage rollout option. If you want to do an A/B test between default and one of the behavior then configure the value as 50% for default and 50% for the newly created behavior. And if you want to do the A/B test between two different behaviors, then configure the value as 50% for both behaviors.
* Once the target audience is configured, make sure to click on the '**Save**' button.
#### Add Goals
Running an A/B test without a goal(s) is of no use. Goals define the effectiveness of an experience. **For example**, if you are running an A/B test on the home page, then the goal event can be clicking on the signup button or the pricing page. You can choose different types of goals based on your requirements.
* Page: Number of visitors who visit the given page path after they are part of an experience.
* Click: Number of visitors who click on the configured element, such as a button click.
* Custom: You can create your own custom events and track them based on your requirements.
* Revenue: Tracks the revenue generated from an experience.
In the experience goals tab, perform the below steps to add a goal
* Click on the '**Add goals**' button.
* In the popup, select the type of goal event you want to add.
* Then select the goal event that you want to add.
* Enter the access code and click on the '**Add**' button.
* If you don't find your goal event, then you can create a new goal event by clicking on the '**Create a new goal**' option.
By default, the first goal event that you add to an A/B test will be considered the primary goal. If you have multiple goal events in an A/B test, then you can make any one of the goal events the primary goal event.
#### Preview of the A/B test
Once an A/B test is configured, make sure to preview the changes you have made to each behaviour before making it live. You can preview the behavior by clicking on the '**preview'** button present on the respective behavior.
{% hint style="info" %}
If you do not see the changes in the preview, then check if the CustomFit code snippet is installed on the website. If you have installed the code snippet, then check whether your browser is blocking the opening of new tabs.
{% endhint %}
#### Taking an A/B test live
To take the A/B test live click on the power switch toggle.
# How to create a Split URL test
Split URL testing is a method used to compare two versions of a web page or a website by splitting the traffic between them. For example, you have two versions of pricing page, i.e., Version 1 with URL [www.customfit.ai/pricing](http://www.customfit.ai/pricing) and Version 2 with URL [www.customfit.ai/pricing-variaition](http://www.customfit.ai/pricing-variaition). You then split your webpage traffic between these two URLs, with half of the visitors seeing Version A and the other half seeing Version B.
### Steps to create a Split URL test
#### Create an experience
* Log in to the dashboard and navigate to the Experience page from the sidebar.
* Click on the '**Create Experience**' button.
* After giving your A/B test a name and a description, click the "**Create Experience**" button.
#### Add page paths
Add the URL's of two pages you want to test. One URL will be the original page (Version A) and the other URL will be the redirection URL (Version B).
* Click on the '**Add pages**' button.
* From the drop-down, select the **Simple page path match** option and enter the page URL of the original page (Version A). Once the page URL is entered, click on the '**Add**' button.
* Again, click on the '**Add pages**' button.
* From the drop-down, select the **Simple page path match** option and enter the page URL of the redirection page (Version B). Once the page URL is entered, click on the '**Add**' button.
#### Create behaviors
* Click on the '**Add Behavior'** button.
* Then give a proper **Name** and **Description** for your behavior.
* Click on the '**Add'** button.
Configure Split URL
* Click on the '**open visual editor**' button present on the behavior.
* From the popup, choose the Version A page URL. Then the Version A page will open in a visually editable way.
* Click on the \ icon present in the toolbar.
* From the dropdown choose the '**Redirection/Split URL**' option.
* Enter the Version B page URL to which you want the visitor to be redirected and then click on the '**Save Changes**' button. If you want to redirect to Version B page along with query parameters then select the '**Redirect along with query parameters?**' checkbox.
* Click on the '**Finalize & Exit**' button.
With this configuration, anyone who lands on Version A of the pricing page will be redirected to Version B of the pricing page.
#### Targeting audience
You can target split URL tests to specific audience segments. For example, you can restrict the split URL test to visitors from the United States.
* Click on the '**Add Rules**' button.
* Choose the **audience category** you wish to target for the split URL test from the popup.
* Then, from the **attribute** dropdown, select one of the attributes. For the above example, the audience category will be geography, and the attribute will be country.
* Then, from the **operation** dropdown, select one of the operations, such as 'is one of' or 'is not one of' based on your requirement. For the above example, the operation type will be 'is one of'.
* Then, provide the **value** in the input field. For the above example, the value will be the United States. You can enter multiple values. In a few of the cases, you can see the drop-down option under the values section.
* Finally, under the **targeting behavior** dropdown, select the percentage rollout option. Then configure the value as 50% for the default and 50% for the newly created behavior.
* Once the target audience is configured, make sure to click on the '**Save**' button.
#### Add goals
In the experience goals tab, perform the below steps to add a goal.
* Click on the '**Add goals**' button.
* In the popup, select the type of goal event you want to add.
* Then select the goal event that you want to add.
* Enter the access code and click on the '**Add**' button.
* If you don't find your goal event, then you can create a new goal event by clicking on the '**Create a new goal**' option.
By default, the first goal event that you add will be considered the primary goal. If you have multiple goal events, then you can make any one of the goal events the primary goal event.
#### Preview of the split URL test
Once a split URL test is configured, make sure to preview it before taking it live.
* Click on the '**Preview**' icon present on the behavior.
* Then from the popup select the Version A page URL.
Instead of opening Version A page you will be redirected to Version B page. If you see this behavior then your split URL test has been configured properly.
{% hint style="info" %}
If you do not see the changes in the preview, then check if the CustomFit code snippet is installed on the website. If you have installed the code snippet, then check whether your browser is blocking the opening of new tabs.
{% endhint %}
#### Taking a split URL test live
To take the split URL test live click on the power switch toggle.
# How to create a Shopify theme based testing
Shopify Theme-Based Split URL Testing allows you to test two or more completely different theme versions of your Shopify store to identify which layout, design, or user flow delivers higher conversions. Unlike traditional A/B testing, which tests changes within a single page, this method lets you run experiments across different themes.
For example, you might want to compare your current theme with a newer one, or test a version of your store with a festive layout against a standard layout. CustomFit.ai splits your visitors between them based on your defined targeting or automatically distributes traffic equally.
This type of testing is especially useful when:
* You’re redesigning your Shopify store and want to test the new layout without affecting your live site.
* You want to compare fast-loading, minimal themes vs rich media-heavy themes.
* You want to validate a theme optimized for mobile before making it live for all users.
### Steps to create a Theme based testing
#### Create an experience
* Log in to the dashboard and navigate to the Experience page from the sidebar.
* Click on the '**Create Experience**' button.
* After giving your test a name and a description, click the "**Create Experience**" button.
#### Add page paths
* Click on the '**Add pages**' button.
* From the drop-down, select the **All Pages** option and click on the '**Add**' button.
#### Create behaviors
* Click on the '**Add Behavior'** button.
* Then give a proper **Name** and **Description** for your behavior.
* Click on the '**Add'** button.
Configure Split URL
* Click on the '**open visual editor**' button present on the behavior.
* Click on the \ icon present in the toolbar.
* From the dropdown choose the '**Global JavaScript**' option.
* Copy and paste the code below in the JavaScript editor.
```javascript
(function() {
var themeName = 'newTestTheme', themeQueryParam = {
_ab: 0,
_fd: 0,
_sc: 1,
pb: 0,
preview_theme_id: 180738294057//update this with your theme id
};
if(Shopify && Shopify.theme && Shopify.theme.id != themeQueryParam.preview_theme_id) {
document.body.style.display="none";
// add theme details above
var updateQueryStringParameter = function(uri, key, value) {
var re = new RegExp("([?&])" + key + "=.*?(&|#|$)", "i");
if( value === undefined ) {
if (uri.match(re)) {return uri.replace(re, '$1$2');} else {return uri;}
} else {
if (uri.match(re)) {return uri.replace(re, '$1' + key + "=" + value + '$2');
} else {
var hash = '';
if( uri.indexOf('#') !== -1 ){hash = uri.replace(/.*#/, '#');uri = uri.replace(/#.*/, '');}
var separator = uri.indexOf('?') !== -1 ? "&" : "?";
return uri + separator + key + "=" + value + hash;
}
}
};
var themeUrl = window.location.href;
for (var key in themeQueryParam) {
themeUrl = updateQueryStringParameter(themeUrl, key, themeQueryParam[key]);
}
window.location.href = themeUrl;
}
})();
const style = document.createElement('style');
style.textContent = `#PBarNextFrameWrapper { display: none !important; }`;
document.head.appendChild(style);
```
* In the editor, go to line number 6 and change the preview\_theme\_id to your new theme id.
* Also, add the following JS by clicking on **JS for Default behavior** to hide the preview bar.
```
const style = document.createElement('style');
style.textContent = `#PBarNextFrameWrapper { display: none !important; }`;
document.head.appendChild(style);
```
* Click on the **Save Changes** button.
* Click on the '**Finalize & Exit**' button.
#### Targeting audience
You can target a Shopify theme to specific audience segments. For example, you can restrict the Shopify theme to visitors coming from a particular campaign. Alternatively, you can target it at all visitors.
* Click on the '**Add Rules**' button.
* Choose the **audience category** you wish to target for the Shopify theme test from the pop-up.
* Then, from the **attribute** dropdown, select one of the attributes. For the above example, the audience category will be UTM Parameters, and the attribute will be UTM Campaign.
* Then, from the **operation** dropdown, select one of the operations, such as 'is one of' or 'is not one of', based on your requirement. For the above example, the operation type will be 'is one of'.
* Then, provide the **value** in the input field. For the above example, the value will be the campaign name. You can enter multiple values. In a few of the cases, you can see the drop-down option under the values section.
* Finally, under the **targeting behavior** dropdown, select the percentage rollout option. Then, configure the value as 50% for the default and 50% for the newly created behavior.
* Once the target audience is configured, make sure to click on the '**Save**' button.
#### Add goals
In the experience goals tab, perform the below steps to add a goal.
* Click on the '**Add goals**' button.
* Then, give the goal name and select the event type based on your requirement. For example, if you want to track the number of ATC's, then select the Shopify option from the dropdown.
* Next, from the events list, select the event that matches your requirement. In this case, let's choose the Product Added to cart option from the dropdown.
* If you want to add a specific product to the track, then click on Add rules, and then enter the specific product ID in the rule.
* Finally, select the Goal evaluation type from the dropdown based on your requirement. For example, select Unique visitors if you want to see how many unique visitors performed Add to cart for the specified product. Atlast click on the **Create** button.
By default, the first goal event that you add will be considered the primary goal. If you have multiple goal events, then you can make any one of the goal events the primary goal event.
#### Taking the test live
To make the Shopify theme test live, click on the power switch toggle.
#### Important Note
After powering off or terminating a theme-level A/B test, it's crucial to immediately delete the test theme that was created during the experience. This is because Shopify may store theme identifiers in the user's cookies. If the test theme is not deleted, returning visitors might continue to see the test version even after the experience is turned off — leading to inconsistent behavior and inaccurate data.
To avoid this:
* Delete the test theme associated with the A/B experience right after turning it off.
* If you want to keep a backup of the theme, duplicate it first, then proceed to delete the original test theme.
* Make sure the theme you delete is the one used specifically for testing — not your live or main theme.
Following these steps ensures a clean rollback and prevents any residual effects from the A/B test.
# How to create an AI Conversion Optimize experience
AI Conversion Optimize uses user data and machine learning to show visitors the best webpage/landing page version for them. It constantly learns what works best for each type of visitor, making sure everyone sees the page most likely to interest them, for a smoother and more effective experience.
AI Conversion Optimize is applied to the majority of your website’s visitors, typically around 80%. This allows the AI to gather sufficient data to determine if its optimizations lead to higher conversions compared to the default website setup.
#### Create an AI Conversion Optimize experience
* Log in to the dashboard and navigate to the Experience page from the sidebar.
* Click on the '**Create Experience**' button.
* After giving your experience a name and a description, click the "**Create Experience**" button.
#### Add page paths
Add the page path(s) on which you want to run AI Conversion Optimization. **For example**, if you want to run on the pricing page, then enter the pricing page path.
* Click on the '**Add pages**' button.
* From the drop-down, select the required option.
* **Simple page path match**: It checks if the given page path matches exactly.
* **Page path contains**: It checks if the page path contains the given text.
* Enter the page path and click on the '**Add**' button.
#### Create behaviors
You can create multiple behaviors (variations) on your website or webpage. When you create an experience, then by default, a default behavior will be created. This will be your default (control) website, and you will not be allowed to delete default behavior. To add the new behavior
* Click on the '**Add Behavior'** button.
* Then give a proper **Name** and **Description** for your behavior.
* Click on the '**Add'** button.
* To edit the webpage, click on the '**open visual editor**' button present on the respective behavior.
**Targeting audience**
You can target the AI conversion optimize experience to specific audience segments. For example, if you want to run AI conversion optimize experience only to USA visitors with mobile devices.
* Click on the '**Add Rules**' button.
* Choose the **audience category** you wish to target from the popup.
* Then, from the **attribute** dropdown, select one of the attributes. For the above example, the audience category will be geography, and the attribute will be country.
* Then, from the **operation** dropdown, select one of the operations, such as 'is one of' or 'is not one of' based on your requirement. For the above example, the operation type will be 'is one of'.
* Then, provide the **value** in the input field. For the above example, the value will be the United States. You can enter multiple values. In a few of the cases, you can see the dropdown option under the values section.
* Finally, under the **targeting behavior** dropdown, select the percentage rollout option. If you want to do an A/B test between default and one of the behavior then configure the value as 50% for default and 50% for the newly created behavior. And if you want to do the A/B test between two different behaviors then configure the value as 50% for both behaviors.
* Once the target audience is configured, make sure to click on the '**Save**' button.
#### Add goals
Running an outbound experience without a goal(s) is of no use. Goals define the effectiveness of an experience. **For example**, if you are running an outbound experience on the home page, then the goal event can be clicking on the signup button or the pricing page. You can choose different types of goals based on your requirements.
* Page: Number of visitors who visit the given page path after they are part of an experience.
* Click: Number of visitors who click on the configured element, such as a button click.
* Custom: You can create your own custom events and track them based on your requirements.
* Revenue: Tracks the revenue generated from an experience.
In the experience goals tab, perform the below steps to add a goal
* Click on the '**Add goals**' button.
* In the popup, select the type of goal event you want to add.
* Then select the goal event that you want to add.
* Enter the access code and click on the '**Add**' button.
* If you don't find your goal event, then you can create a new goal event by clicking on the '**Create a new goal**' option.
By default, the first goal event that you add to an A/B test will be considered the primary goal. If you have multiple goal events in an A/B test, then you can make any one of the goal events the primary goal event.
**Preview of the experience**
Once an AI Conversion Optimize experience is configured, make sure to preview the changes you have made to each behaviour before making it live. You can preview the behavior by clicking on the '**preview'** button present on the respective behavior.
{% hint style="info" %}
If you do not see the changes in the preview, then check if the CustomFit code snippet is installed on the website. If you have installed the code snippet, then check whether your browser is blocking the opening of new tabs.
{% endhint %}
**Taking the experience live**
To take the A/B test live, click on the power switch toggle.
# How to create an Outbound Experience
#### Creating an Outbound Experience
* Open the website or the landing page in the new tab that you wish to personalize.
* Right-click anywhere on the page and select the "Personalize this page" option. If you are unable to locate this option, the CustomFit Chrome extension is not installed. The CustomFit Chrome extension is available for installation from [here](https://chromewebstore.google.com/detail/customfitai-website-ab-te/ofhlnapgheofdhlliafiaalkefdpbcpl).
* Make sure you have logged into the CustomFit dashboard page otherwise, you will be redirected to the login page for authentication.
* After authentication, you will be redirected to a website or landing page with a popup where you will find an option to create a new campaign.
* Click on the '**Create a new campaign**' button and give the name. Once the name has been given, click on the '**Create**' button.
{% embed url="" %}
If you are already in the visual editor mode and want to create a new outbound experience then,
* At the top left, you can see the experiences button
* Click on it and you will see the list of experiences that are already created.
* At the last, you will see an option "Create Campaign" option.
* Click on it and create a new campaign.
#### Adding new pages
If you want to add new pages to your existing experience, then
* At the top left, you can see the Experiences button
* Click on it, and you will see the list of experiences.
* Then click on the arrow icon of the respective experience to which you want to add a new page.
* From the options, select '**Personalized pages**'.
* Enter the page url which you want to add and click on the '**Add page**' button.
#### Add Goals
Running an outbound experience without a goal(s) is of no use. Goals define the effectiveness of an experience. **For example**, if you are running an outbound experience on the home page, then the goal event can be clicking on the signup button or the pricing page. You can choose different types of goals based on your requirements.
* Page: Number of visitors who visit the given page path after they are part of an experience.
* Click: Number of visitors who click on the configured element, such as a button click.
* Custom: You can create your own custom events and track them based on your requirements.
* Revenue: Tracks the revenue generated from an experience.
To add the goals
* Click on the "Insights" button present in the top bar of the visual editor.
* Click on the goals tab.
* Then click on the '**Add goals**' button.
* In the popup, select the type of goal event you want to add.
* Then select the goal event that you want to add.
* Enter the access code and click on the '**Add**' button.
* If you don't find your goal event, then you can create a new goal event by clicking on the '**Create a new goal**' option.
By default, the first goal event that you add will be considered the primary goal. If you have multiple goal events, then you can make any one of the goal events the primary goal event.
If you want to track the goal event through a visual editor, then
* Click on any element for which you wish to track it as a goal.
* In the '**editor palette**', click on the '**Action**' option.
* Then, under the '**Onlick**' function, select the '**Track click**' option.
* Finally, give the name of your goal event and click on the '**save**' button.
#### Preview
Once you're done editing or personalizing the website or landing page, you can preview what the webpage looks like to make sure that the changes are as expected. To enter into preview mode, click on the 'Preview/Interactive' toggle present in the app bar. In the preview mode, you can also copy and send the link to your team members if you need to get any approvals or suggestions.
{% hint style="info" %}
If you copy and send the preview link to your team members, then make sure that before you enter preview mode, you publish the changes.
{% endhint %}
{% hint style="info" %}
If you do not see the changes in the preview, then check if the CustomFit code snippet is installed on the website. If you have installed the code snippet, then check whether your browser is blocking the opening of new tabs.
{% endhint %}
#### Generating Link
Once you are done editing or personalizing the website or landing page, click on the '**Publish**' button in the app bar to save all your changes. Then click on the '**Get Link**' button to generate a unique, sharable, tiny URL. Visitors who land on the website or landing page through this link will see the personalized content.
If there is any dynamic content present in your experience, then CustomFit auto-detects it and requests that you provide the value before generating the unique link. All the dynamic content will be encoded in the tiny URL, and it won't be visible to the visitor.
If you want to add the expiry timer to the generated links, you can do so by clicking on the 'Advanced' option while generating the link. You can provide the timer either in minutes, hours, or days. If the visitor lands on the website or landing page through this link after the given time, then they won't see the personalized content; instead, they will see the default content.
#### Power off the experience
If you want to power off the experience, then
* At the top left, you can see the Experiences button
* Click on it, and you will see the list of experiences.
* Then click on the arrow icon of the respective experience that you wish to power off.
* From the options, select '**Power off**'.
* In the confirmation popup click on the '**Ok**' button and the experience will be powered off.
# Creating an Experience
Any website should change and modify itself in various ways to make sure that they deliver the most relevant content, resulting in a personalized visitor experience when they land on your website. Providing better visitor experience results in increasing the desired goals such as the number of sign-ups, the number of demo requests, etc.
CustomFit.ai dashboard makes experience creation easy.
* Log in to the dashboard and navigate to the Experience page from the sidebar
* Click on the "Create Experience" button
* Enter the following details:
1. **Name:** A meaningful name for your experience that will allow you to easily locate it in the dashboard.
2. **Description:** Briefly describe what this experience is about. This will help your team members understand the experience's purpose.
3. **Priority:** Provide the priority for each experience you are creating. Priority is a numerical value and it is used to determine the priority of an experience. For example, if you have changed the background image in two of the experiences, then the experience with higher priority will serve the background image for the website. The lower value has the lowest priority and the higher value has higher priority. If you do not give any value then by default the priority value will be set to 1.
4. **Track:** Enable this field if you wish to track the events under this experience so that you can see the journey of the visitors under the experience.
* Once all the details are provided then click on the "Create Experience" button
# Experience Page Paths
Once you have created an experience the next step is to add the page path/s which you wish to personalize. **For example**, if you wish to personalize the home page and pricing page then, you can personalize it out by adding both the pages in the same experience. CustomFit provides different options to add the page paths.�
### **Page path is**
Use this option if you wish to match the exact URL of the website page path you want to personalize. **For example**, if you want to personalize the pricing page then type the full URL in the input field.
To add the page path
* Click on Add page paths
* From the drop-down select, the "**Page path is**" option
* Enter the exact URL of the website page path which you wish to personalize. Make sure you click on *enter* button once you type the URL
* Click on Add button
### **Page path contains**:
This option looks for whether the website page path contains the specified text. If it contains then personalization will be applied. Use this option if you have multiple page paths with the same text and you want to personalize all the page paths.
**For example**, if you wish to personalize all the page paths which contain blogs in the URL then in the input field enter the text which you want to check i.e., blogs. In the *Reference page path* field enter the full URL of one of the page paths so that you can edit it in the visual editor i.e., . So the changes made to the above page path will be applied to , , and so on.
To add the page path
* Click on Add page paths
* From the drop-down select, the "**Page path contains**" option
* Enter the text which you wish the check whether the page path URL contains the entered text. Make sure you click on *enter* button once you type the text
* Enter the exact URL of a page as the reference page path to open it in the visual editor. Make sure you click on *enter* button once you type the URL
* Click on Add button
{% hint style="info" %}
You cannot add multiple texts in the input field. **For example**, a website page path containing both blogs & marketing.
{% endhint %}
### Page path regex:
Use this option if you wish to personalize the pages which have a specific pattern in the URL.
**For example**, if you wish to personalize all the comparison pages then in the input field enter the regex pattern to be matched in the URL i.e., ***\\/comparisons\\/.\**** which indicates all the comparison pages in the website should be personalized. In the *Reference page path* field enter the full URL of one of the page paths so that you can edit it in the visual editor i.e., ;
To add the page path
* Click on Add page paths
* From the drop-down select, the "**Page path regex**" option
* Enter the regex which you wish to check whether the page path URL contains the entered regex. Make sure you click on *enter* button once you type the regex
* Enter the exact URL of a page as the reference page path to open it in the visual editor. Make sure you click on *enter* button once you type the URL
* Click on Add button
### Pause personalization for a specific page
If you wish to pause the personalization for a specific page from an experience then, change the status from Live to Pause by clicking on the status icon of the respective page path.
### Delete the page from an experience
If you wish to delete a particular page from an experience then, click on the delete icon of the respective page path.
{% hint style="danger" %}
If you delete a page from an experience then all the changes made to the page will be deleted and it cannot be reverted back.
{% endhint %}
# Experience Targeting
The experience targeting tab lets you create different behavior(variations) of your website and also lets you determine which visitors will see each behavior of an experience.
## Behavior
A single experience can have multiple behaviors. When you create an experience then by default a default behavior will be created. This will be your default(control) website and you will not be allowed to delete default behavior.
### Adding a new behavior
* To add a new behavior click on the **Add Behavior** button
* Then give a proper **Name** and **Description** for your behavior
* Click on the **Add** button
### Updating behavior name or description
If you wish to update the behavior name or description then
* Click on the three dots of the respective behavior
* From the drop-down select the **Edit** option
* In the popup update the behavior name/description
* Click on the **Update** button
### Deleting a behavior
If you wish to delete any one of the behavior then
* Click on the three dots of the respective behavior
* From the drop-down select the **Delete** option
* In the confirmation popup enter the access code
* Click on the **Yes** button
{% hint style="warning" %}
You cannot delete a behavior if it is part of some rules.
{% endhint %}
### Cloning of the behavior
If you have one behavior and made some changes in that behavior. And now, if you want to create new behavior for a different section of the audience. In the new behavior you need to change only one element and, the rest of the changes are similar to the old behavior. Then there is no need to redo all the changes once again. All you need to do is clone the existing behavior and do the necessary change. To clone the behavior
* Click on the three dots of the respective behavior
* From the drop-down select the **Make a clone** option
* Give the behavior **Name** and **Description**
* Click on the **Clone** button
**For example**, if you have created the behavior as the first-time visitor and personalized the hero text, CTA, and background image. Now you want to create new behavior for the repeated visitor just by changing the hero text, whereas the CTA and background image should remain the same as the first-time visitor. Then you can clone the first-time behavior(CustomFit creates new behavior with all the changes pre-configured from the cloned behavior) and then you can change only the hero text.�
{% hint style="warning" %}
You cannot have two behaviors with the same name.
{% endhint %}
### Editing the behavior
CustomFit.ai visual editor lets you edit different behaviors of your website quickly with zero code changes. You can know more about visual editor options over here to edit a behavior
* Click on the **Open Visual Editor** button
* Then from the popup select the page of the website which you wish to edit
### Preview behavior
Once you're done editing the behavior, you can preview the changes made before making it live to make sure that the changes are as expected and also to check that there are no broken links. You can also send the preview link to your team member if you need to get any approvals or suggestions. To view the behavior in the preview mode
* Click on the **Select Preview** button of the respective behavior
* From the drop-down select the **Preview** option
* If there are multiple pages in the behavior then from the drop-down select the page which you want to preview
To send the preview link to your team member
* Click on the **Select Preview** button of the respective behavior
* From the drop-down select the **Share Preview** option
* If there are multiple pages in the behavior then, from the drop-down select the page which you wish to generate a link
* If you wish to directly send the preview link then, click on the **Copy Preview Link** button
* If you wish to send the preview link through an email then, enter the email id in the given field and click on **Send Email** button
{% hint style="info" %}
If you do not see the changes in the preview then, check if the CustomFit code snippet is installed on the website. If you have installed the code snippet then, check whether your browser is blocking the opening of new tabs.
{% endhint %}
## Targeting visitors based on rules
CustomFit.ai allows you to target different behaviors to different visitors based on various attributes such as the geography of the visitors, the device of the visitors, based on the interaction with the website, and so on.
You can target a more specific audience to a particular behavior by writing the rules. Each rule has four parts: an attribute, an operator, values, and the behavior to be served. **For example**, if you want to serve the USA behavior to visitors coming from the USA then, the rule will be `Country` IS\_ONE*\_*OF United States. Here, an attribute is `Country`, an operator is `IS_ONE_OF`, value is the `United States` and the behavior to be served is `USA` behavior.
A rule can have multiple conditions where the visitors need to satisfy all the conditions to be served with a specified behavior. **For example**, if you wish to serve the USA behavior to visitors coming from USA and the device type is of Mobile.
If you have multiple behaviors and want to serve different behaviors to a different segment of visitors then, you can write multiple rules. **For example**, if you have two behaviors i.e., India & USA then, you can have first rule serving to Indian behavior and the second rule serving the USA behavior.
The first rule will have the highest priority, the second rule will have the second-highest priority, and so on the last rule will have the least priority.
Below are the few instructions which make you writing the rules easier:
* To copy a rule click on the copy icon above the rule to be copied
* To delete a rule click on the delete icon above the rule to be deleted
* To add a new rule click on the Add button or Add Rule button
* To copy a condition click on the copy icon beside the condition to be copied
* To delete a condition click on the delete icon beside the condition to be deleted
* To add a new condition click on the "+" icon which is present beside the last condition
You can also give a name to the rule. **For example**, if you are writing a rule to segment the visitors coming from the INDIA then, you can write the rule name as Indian Visitors. � To change the rule the name
* Click on the rule name
* Change the rule name as per you requirement
* Click on yes icon to change the rule name or click on no icon to retain the same rule name
CustomFit allows you to write a rule-based on various visitors attributes. [Learn more.](https://doc.customfit.ai/audience-segments/geo-location)
## Percentage Rollout
If you want to test out the new behavior for a small section of visitors then, make use of the percentage rollout option. **For example**, you can serve the sales behavior only to the 30% of the visitors with sales attributes and the remaining 70% of the visitors with the default behavior. The percentage rollout option can also be used to determine how the personalized behavior is performing when compared to default behavior by splitting the traffic that matches the given rule.
## Default Rollout
If a visitor does not fall under any one of the written rules then, based on the default rollout respective behaviors will be served.
When you make any changes in the targeting page and try to switch to other tabs without saving the changes then you will be prompted with a confirmation popup. If you wish to save the changes made before moving to the other page then click on the **Stay** button.
If you decide to ignore the changes and move to other pages then click on **Leave** button.
# Visual editor
* Click on the open visual editor
* Choose the page path from the dropdown which you wish to edit
* Once you select the page path, it's redirected to the visual editor page.
# Experience Goals
Providing a personalized experience without a goal/s is of no use. Goals define the effectiveness of the personalization which you have provided for a segment of visitors. **For example**, if you are personalizing the home page then, the goal event can be the click on the Signup button.
#### Types of goal events
* **Page view**: Loading of a particular page after the visitor has seen the personalized behavior. **For example**, a visitor seeing the personalized home page and then visiting the thank you page(i.e., goal event).
* **Click**: A visitor performing a certain action after seeing the personalized behavior. **For example**, a visitor clicking on the Contact us button(i.e., goal event) after seeing the personalized home page.
### Adding Goal Events
* Click on the experience in which you want to add the goals
* Navigate to Goals tab
* Click on Add Goal Events button
* Then from the drop-down select the event or multiple events(Page view/Click) which you wish to make it as the goal event
* Enter the access code and click on **Add** button
Then you see the goal events
### Deleting Goal Event
* Click on the delete icon of the respective goal event which you wish to delete
* Enter the access code and click on **Yes** button to confirm the deletion
### Reset goal event
* Click on the experience from which you want to reset the goal event
* Click on the Goals tab
* Click on the reset button of the respective goal event for which you want to reset the values to zero
### Goal Insights
For each goal you have added to an experience, CustomFit provides the following insights
* **Name:** Name of the behavior under which the goal event is triggered
* **Sessions:**
* Total: Total number of sessions under the personalized/default behavior
* Unique: Total number of sessions under the personalized/default behavior from the unique visitors.
* **Goals:**
* Total: Total number of times goal event is triggered(Page view/Click) under
the personalized/default behavior
* Unique: Total number of times the goal event is triggered(Page view/Click) under the personalized/default behavior from the unique visitors.
* **Goals achieved:** Total number of times goal event is triggered. Atleast one goal event is enough to increment this goal count incase of multiple goal events
* **Conversion rate:** It gives the percentage of the unique visitors who experienced the personalization and triggered the goal event
* **Lift:** It gives the percentage of the personalized behavior change when compared with the different behaviors. By default we will be comparing with the default behavior(Controlled version of the website)
* **Stat sig:** It indicates the confidence that the goal triggered is reliable and not due to chance. By default, we compare the statistical significance with the default behavior.
* **Property insights:** It consists of various visitor's properties when the goal event was triggered. For example, the total number of visitors from the specific city who triggered the goal event under a personalized behavior/default behavior
#### Calculate the lift against
By default the data is displayed for the last 7 days. You can also select different days or select the custom date range.
When you click on custom you need to select the From and To dates
{% hint style="info" %}
FROM date cannot be greater than the TO date
FROM date cannot exceed from the last 3months
TO date cannot exceed from the current date
{% endhint %}
By default, the lift will be calculated against the default behavior. If you wish to calculate the lift against different personalized behavior then
* Click on the Calculate the lift against
* From the dropdown select the behavior against which you wish to calculate the lift
* Then based on the selected behavior, the lift will be calculated for all the goal events in the experience.
{% hint style="info" %}
Lift is calculated only at the behavior level
{% endhint %}
#### Goal level property insights
You can get the various visitor's properties when the goal event was triggered. For example, the total number of visitors from the specific city who triggered the goal event under a personalized behavior. To view the property level insights
* Click on property insights of the respective behavior which you wish to see
* You can also click on property insights of the respective rule which you wish to see
* From the dropdown select the event for which you wish to see the insights
# Experience Insights
The insights page provides various information about the behavior and rules of an experience
* **Behavior:** It consists of the behavior names and rules under the specific behavior for which the goal event is triggered
* **Sessions:**
* Total: Total number of sessions under the personalized/default behavior
* Unique: Total number of sessions under the personalized/default behavior from the unique visitors.
* **Goals:**
* Total: Total number of times goal event is triggered(Page view/Click) under the personalized/default behavior
* Unique: Total number of times the goal event is triggered(Page view/Click) under the personalized/default behavior from the unique visitors.
{% hint style="info" %}
Atleast one goal event is enough to increment this goal count incase of multiple goal events
{% endhint %}
* **Conversions:** It gives the percentage of the unique visitors who experienced the personalization and triggered the goal event
* **Lift:** It gives the percentage of the personalized behavior change when compared with the different behaviors. By default we will be comparing with the default behavior(Controlled version of the website)
* **Stat sig:** It indicates the confidence that the goal triggered is reliable and not due to chance. By default, we compare the statistical significance with the default behavior.
* **Session duration:** Average amount of time the visitor stays at your website after seeing the personalized behavior
* **Traffic stats:** It displays the graph for the respective behavior and rule
* **Property insights:** It consists of various visitor's properties when the goal event was triggered. For example, the total number of visitors from the specific city who triggered the goal event under a personalized behavior/default behavior
#### Traffic Stats :
By default the data is displayed for the last 7 days. You can also select different days or select the custom date range.
When you click on custom you need to select the From and To dates
{% hint style="info" %}
FROM date cannot be greater than TO date
FROM date cannot exceed from the last 3months
TO date cannot exceed from the current date
{% endhint %}
Click on traffic stats graph icon corresponding to a behavior to know how the respective behavior is performing or Click on traffic stats graph icon corresponding to a rule to know how the respective rule is performing
At the bottom of the page you can observe the traffic based graph for different parameters such as UTM, Geography, Technology and Referrer. By default, utm source graph is displayed.
From the dropdown you can select top 10 or last 10 or all options. By default top 10 values are displayed in the graph .For example: If you want to know the traffic from top 10 city names from where the visitor visited our website then, select top 10 option from the dropdown
If you want to know the cumulative values for the traffic based on top 10 city names then enable the cumulative option
Select Last 10 option from the dropdown in order to see the last 10 values in the graph. For example: If you want to know the traffic from the last 10 device types through which the visitor visited our website then, select last 10 option from the dropdown
If you want to know the cumulative values for the traffic based on last 10 device types then enable the cumulative option
Select All option from the dropdown. For example: If you to know the traffic, based on all the device types then select All option. A table consisting of total number of sessions happened through different device types is displayed.
Click on graph icon under the daywise count column. Daywise summary graph is displayed for the specific selected attribute. By default 7 days graph is displayed.
For example: If you want to know the daywise summary graph for the specific device type like desktop. Click on the graph icon for the desktop device and correspondingly the graph is displayed
#### Calculate the lift against
By default, the lift will be calculated against the default behavior. If you wish to calculate the lift against different personalized behavior then
* Click on the Calculate the lift against
* From the dropdown select the behavior against which you wish to calculate the lift
* Then based on the selected behavior, the lift will be calculated for all the goal events in the experience.
{% hint style="info" %}
Lift is calculated only at the behavior level
{% endhint %}
#### Goal level property insights
You can get the various visitor's properties when the goal event was triggered. For example, the total number of visitors from the specific device type who triggered the goal event under a personalized behavior. To view the property level insights
* Click on property insights of the respective behavior
* You can also click on property insights of the respective rule
* From the dropdown select the event for which you wish to see the insights
# Experience Settings
The settings page allows you to edit/configure various details of an experience.
#### Name and Description
You can update the name and description of an experience by entering the required data in the name and description field. Then click on the Update button.
#### Priority
Priority is a numerical value and it is used to determine the priority of an experience. For example, if you have changed the background image in two of the experiences, then the experience with higher priority will serve the background image for the website. The lower value has the lowest priority and the higher value has higher priority. If you do not give any value then by default the priority value will be set to 1.
#### Journey Settings
* If you want to understand the journey of the visitors who are falling under this experience, then track the experience
* Under journey settings, you can configure whether you want to track all the events(Page view and clicks)
* Under journey settings, you can configure whether you want to track only the selected events.
# Experience Dashboard
The experience dashboard page provides various information about experiences, such as :
### Name
A meaningful name of your experience will allow you to easily locate it in the dashboard.
### Priority
Provide the priority information of each experience you have created. Priority is a numerical value and it is used to determine the priority of an experience. The lower value has the lowest priority and the higher value has higher priority.
### Behaviors
The Behaviors column in the dashboard gives information about the total number of behaviors present in an experience.
### Pages
The Pages column displays the total number of pages present in an experience.
### Power Switch
Turn on the power switch to make the experience live.
### Goals
If you click on goals button then you will be redirected to the respective goals page
### Actions
Under the actions column you can perform various actions such as
#### Delete
In the Actions column, you can delete an experience by clicking on the delete option from the dropdown. Once you click on the delete icon a confirmation pop up window appears to confirm your delete action.
#### Edit
You can also edit the experience name by clicking on the edit option from the dropdown.
In the popup window you can change the experience name as per your requirement.
#### Clone
You can also clone an experience(Create duplicate experience) by clicking on the Make a clone option from the dropdown.
Give an experience name. Make sure that the experience name should not match with an existing experience name.
# Experience FAQs
## Can I create two experiences with the same priority?
Yes, you can create two experiences with the same priority. In this case, the experience which is created recently will have the highest priority.
## What if I make an experience trackable after few days?
CustomFit starts tracking the events under Journey Explorer only after the experience is made trackable.
## I am unable to see the changes made to the website in the preview mode
There might be multiple reasons why you might not be able to see the changes
1. Make sure that you have installed the CustomFit snippet on your website
2. Check whether the browser is blocking any tab openings. If yes, then allow CustomFit to open the preview mode in the new tab.
# Overview
CustomFit visual editor lets you edit different behaviors of your website quickly with zero code changes. **For example**, if you wish to edit the Marketing behavior then click on the **Open Visual Editor** button
If the experience has multiple pages then select the page which you wish to edit
The CustomFit visitor editor has four components:
1. **Editor Page** : A copy of the website page which you wish to edit or personalize
2. **App bar** : A toolbar that appears at the top of visual editor interface
3. **Editor Palette** : It allows to edit the various properties of an element
4. **Toolbar** : It also allows to edit the various properties of an element
# App Bar
The app bar consists of following features
* Breadcrumbs
* Undo
* Redo
* Popups
* Preview
* Tutor
* Abort
* Finalize
* Finalize & Exit
#### Breadcrumbs
When you click on any element in the web page then the visual editor will detect the display path(Breadcrumbs) of your selection. It also allows you to navigate to the parent element of the selected element.
#### Undo
If you have done any changes to an element and want to undo the changes then, you can do it by clicking on Undo in the app bar.
#### Redo
It's the reverse of undo function. Restore the changes that were previously undone
#### Popups
If you have added any popups to the webpage then by default all the popups will be hidden. You can view the popups present on the webpage by clicking on the Popups button present in the app bar. By once again clicking on the Popups button all the popups will be hidden.
#### Preview
Once you're done editing or personalizing the web page, you can preview how the webpage looks like to make sure that the changes are as expected. In the preview mode, you can also send the link to your team members if you need to get any approvals or suggestions.
The preview also comes into handy when you want to close inbuilt popups or chatbots.
#### Tutor
If you are into the visual editor interface for the first time then clicking on the Tutor button in the app bar will display the video which will help you in getting an overview of the CustomFit visual editor.
#### Abort
The abort button discards all the changes made to the webpage and takes you back to the experience targeting page.
#### Finalize
Once you are done editing or personalizing certain elements of your webpage and want to make sure that the changes are not lost then, click on finalize button. Clicking on finalize button will save all your changes but still present in the visual editor interface.
#### Finalize & Exit
Once you are done editing or personalize your webpage then click on Finalize & Exit button. This will save all your changes and takes you back to the experience targeting page
# Editor Palette
The editor palette appears whenever you click on any HTML element, like a text element or an image. The editor palette allows editing the selected element.
### Changing the Text
Using CustomFit visual editor, you will be able to change any text in the webpage without any prior coding knowledge. To edit the text
* Click on any text element on the web page. In the editor palette, you can see the text field with prefilled text. Modify the text based on your requirement
* Click on the **Save** button
### Changing the Typography of the Text
If you wish to change the typography of the text element then you can do it in the editor palette. In the Typography section, you can edit the following styles
* **Font Size**: You can change the font size
* **Font Style**: You can change the font style(Italics, bold, etc)
* **Font Weight**: You can change the boldness of the text
* **Font Family**: You can also change the font family
When you select any text element then all the above values will be pre-filled with the current value.
### Changing the Image
If you wish to change any image on the webpage then click on the image which you wish to change. Then in the editor palette, you can see the **Image Source** field. This field is visible if the clicked element is of type image, if it is of any other type then you won't see the Image Source field.
In the Image Source field either enter the image URL or upload it from your local folder.
Click on **Save** button to see the image being replaced in the visual editor.
### Changing the Background Image
If you wish to change/apply any background image in the website then click on the element to which you wish to change and in the editor palette you can see the **Background Image URL** field.
In the Background Image URL field either enter the image URL or upload it from your local folder.
Click on the **Save** button to see the image being replaced in the visual editor.
### Changing the Dimension
If you wish to change the dimension of any element then click on the element which you wish to change and in the editor palette you can see the **Dimensions** field.
Change the dimensions based on your requirement.
Click on the **Save** button to see the updated dimensions being applied to the element.
### Removing an Element
If you wish to remove an element from a webpage then click on the element and in the editor palette you can see the **Remove** option under the Visibility section.�
Click on the **Remove** option.
Click on the **Save** button
In the visual editor you can see the removed element in the blur.
And again if you want to add the removed element then click on the element and unselect the **Remove** option.
### Hide/Show
The hide option in the editor palette allows you to hide/show any element. Click on the element which you wish to hide. Click on the **Hide** option in the editor palette under the Visibility section.
Click on the **Save** button.
In the visual editor, you can see the hidden element in the blur.
And again if you want to show the hidden element then click on the element and unselect the **Hide** option.
### Changing the URL
If you have any element(button) with an URL and if you wish to can change the URL then you can do it through the editor palette. When you click on the element then in the editor palette you can see the **Link to(href)** field.
Change the URL as per your requirement and click on the **Save** button.
It also provides you an option to configure whether the URL has to be opened on the same tab or in the new tab.
### Applying Border Radius
If there are elements such as buttons or images and if you wish to have a rounded border for it. Then you can achieve it by clicking on it and in the editor palette, you can see the **Border Radius** field.
Provide the required border-radius and click on the **Save** button.
In the visual editor interface, you can see the element with the rounded border.
### Changing the CSS Classes
If you wish to update the CSS classes of any element then you achieve it through the **CSS Classes** field in the editor palette. Click on the element. Change the required CSS Classes and click on the **Save** button.
### Reset
If you have done multiple changes to an element and wish to reset the element to its default values then click on the Reset button in the editor palette.
### Onclick Execute JavaScript
* Select the element on which you want to execute JS
* From the editor palette under the action section, you will find an Onclick option
* From the dropdown select the Execute JS option
* Copy and paste the JS code and click on Save
### Onload Execute JavaScript
* Select the element on which you want to execute JS
* From the editor palette under the action section, you will find an Onload option
* From the dropdown select the Execute JS option
* Copy and paste the JS code and click on Save
# Toolbar
The toolbar allows you to edit various properties(Text, Image, Color, etc.) of the selected element.
### Edit Text
You can edit the text of any element by either
* Double click on the element and then edit the text
* Click on an element that you wish to edit and then select the **Edit** option
**Hotkey** to enable Edit option: Click on E
### Guides
It allows you to verify the alignments and measure the distances between two elements. To check the alignments select the **Guide** option and move the mouse cursor on an element for which you wish to see the alignments
To check the measurements
* **Click** on an element from which you wish to see the measurement
* Select the **Guide** option
* Move the mouse cursor on any element then you can see the measurement wrt the clicked element
**Hotkey** to enable Guide option: Click on G
### Margin
It allows you to add(increase) or subtract(reduce) outer space from any or all sides of the selected element. To edit the margin
* **Click** on an element for which you wish to edit the margin
* Select the **Margin** option
* To **add** the margin just Click on the **Left**, **Right**, **Bottom** & **Top** arrow keys to add the margin respectively. **For example**, if you click on the Left arrow key then the margin will be increased at the left side of an element
* To **subtract** the margin press **Alt** and click on the **Left**, **Right**, **Bottom** & **Top** arrow keys to subtract the margin respectively. **For example**, if you click on the Top arrow key then the margin will be reduced from the top of an element
**Hotkey** to enable Margin option: Click on M
### Padding
It allows you to add(increase) or subtract(reduce) inner space from any or all sides of the selected element. To edit the padding
* **Click** on an element for which you wish to edit the padding
* Select the **Padding** option
* To **add** the padding just click on the **Left**, **Right**, **Down** & **Up** arrow keys to add the padding respectively. **For example**, if you click on the Left arrow key then the padding will be increased at the left side of an element
* To **subtract** the padding press **Alt** and click on the **Left**, **Right**, **Down** & **Up** arrow keys to subtract the padding respectively. **For example**, if you click on the Top arrow key then the padding will be reduced from the top of an element
**Hotkey** to enable Padding option: Click on P
### Font Styles
This option allows you to edit the various font styles. To edit the font size
* **Click** on an element for which you wish to increase or decrease the font size
* Select the **Font** option
* Click on the **Up** arrow button to increase the font size
* Click on the **Down** arrow button to decrease the font size
To change the font alignment
* **Click** on an element for which you wish to change the alignment
* Select the **Font** option
* Click on the **Left** arrow button to make the font left aligned
* Click on the **Right** arrow button to make the font right-aligned
To change the line space
* **Click** on an element for which you wish to change the line spacing
* Select the **Font** option
* Press **Shift** and click on the **Up** arrow button to increase the line spacing
* Press **Shift** and click on the **Bottom** arrow button to decrease the line spacing
To change the letter space
* **Click** on an element for which you wish to change the letter spacing
* Select the **Font** option
* Press **Shift** and click on the **Left** arrow button to decrease the letter spacing
* Press **Shift** and click on the **Right** arrow button to increase the letter spacing
To change the font-weight(Boldness)
* **Click** on an element for which you wish to change the font-weight
* Select the **Font** option
* Press **Ctrl** and click on the **Up** arrow button to increase the font-weight
* Press **Ctrl** and click on the **Bottom** arrow button to decrease the font-weight
**Hotkey** to enable Font Styles option: Click on F
# Popups
CustomFit allows you to add banners & popups on your website with zero code. You can have popup content personalized based on the audience it is targeted at. You can add a new popup on the webpage if you are in the CustomFit visual editor.
1. Clicking on the + icon in the visual editor
2. Select the pop-ups tab if you want to add a popup. Or select the inline tab if you want to add an inline element/banner
3. In each tab, you can find a different set of popups
For example: If you wish to add an email popup then select the popup which contains an email field.
Once you have added a popup then you can see 4 buttons on top of the popup.
1. **Convert to Template:** If you have made some changes to the template and want to reuse the template then you can save it and reuse it. To save the template click on the *Convert to Template* button
2. **Settings:** The settings button provides you with various options to configure a popup
3. **Hide:** Once you are done personalizing your popup and want to continue with webpage personalization then click on the hide button to hide the popup
4. **Delete:** If you want to delete the popup then click on the delete button
### **Popup Settings**
The settings option allows you to configure your popup based on various requirements.
#### **Visibility**
This option lets you configure on which device the popup should be visible
* Desktop and Mobile: If you want the popup to be visible on both desktop and mobile then select the Desktop and Mobile option
* Desktop only: If you want the popup to be visible only on the desktop then select the Desktop only option
* Mobile only: If you want the popup to be visible only on the mobile then select the Mobile only option
{% hint style="info" %}
By default, the Visible option will be set to Desktop and Mobile
{% endhint %}
#### Display
This option lets you configure when the popup should be displayed
* On Entry: If you want the popup to be displayed as soon as the visitor lands on the webpage then select the *On Entry* option
{% embed url="" %}
* After X Seconds: If you want the popup to be displayed after X seconds of the page load then select the *After X Seconds* option. By default, the value will be set to 20 seconds
{% embed url="" %}
* Exit Intent: If you want the popup to be displayed as soon as the visitor tries to close the webpage then select the *Exit Intent* option. There is an additional option that you can configure specifying the popup should be displayed after X seconds of page load and then trying the close the webpage. If the visitor tries to close the popup within X seconds then the popup will not be displayed. By default, the value will be set to 2 seconds
{% embed url="" %}
* Scroll %: If you want the popup to be displayed after the visitor has scrolled X percentage on the webpage then select the *Scroll %* option. By default, the value will be set to 20%
{% embed url="" %}
{% hint style="info" %}
By default, the Display option will be set as On Entry
{% endhint %}
**Close settings**
This option allows you to configure the behavior of a popup once it is closed
* Show on page refresh: As soon as the visitor clicks on the close(X) icon then the popup will be dismissed for the visitor. If you have selected the *Show on page refresh* option then the popup will be again visible if the visitor refreshes the page
* Show on next session: As soon as the visitor clicks on the close(X) icon then the popup will be dismissed for the visitor. If you have selected the *Show on next session* option then the popup will be again visible for the visitor in the next session
* Show after X duration: As soon as the visitor clicks on the close(X) icon then the popup will be dismissed for the visitor. If you have selected the *Show after X duration* option then the popup will be again visible for the visitor after X seconds. If the visitor refreshes the page or opens a new session within X seconds then the popup will not be visible. By default, the value will be set to 86400 seconds i.e., 1 day
{% hint style="info" %}
By default, the Close settings will be set to *Show on next session* option
{% endhint %}
#### **Form submit settings**
This option allows you to configure what should be the next steps after the form has been submitted.
* Invoke API: If you wish to invoke your custom API as soon as the visitor submits the form, select the Invoke API option. As the visitor fills the email id and clicks on the button then CustomFit will invoke the configured API
* Create HubSpot contact: If you are using Hubspot as your CRM then CustomFit allows you to create Hubspot contact as soon as the visitor submits the form. For that first, you need to [integrate Hubspot](https://doc.customfit.ai/integrations/hubspot) with CustomFit and select *Create Hubspot contact* option under the Form settings
{% hint style="info" %}
If Hubspot has not been integrated and if you have selected *Create HubSpot contact* then the form submission will fail
{% endhint %}
* Create Salesforce lead: If you are using Salesforce as your CRM then CustomFit allows you to create a Salesforce lead as soon as the visitor submits the form. For that first, you need to [integrate Salesforce](https://doc.customfit.ai/integrations/salesforce) with CustomFit and select *Create Salesforce lead* option under the Form settings
{% hint style="info" %}
If Salesforce has not been integrated and if you have selected *Create Salesforce lead* then the form submission will fail
{% endhint %}
* Add to CustomFit email list: If you do not have Hubspot/Salesforce as your CRM and also do not have any internal API to be invoked then you can select *Add to CustomFit email list* option. This option allows you to store the list of email ids locally on the CustomFit side. CustomFit allows you to select the email list in which you wish to save the email id\\
{% embed url="" %}
{% hint style="info" %}
By default, the Form submit settings will be set to Invoke API option
{% endhint %}
#### **Success message**
If the form submission is successful then CustomFit allows you to have your success message. By default, the success message is *We got the info*. The success message will be displayed over the form button
{% embed url="" %}
#### **Failure message:**
If the form submission fails then CustomFit allows you to have your failure message. By default, the failure message is *Oops! something went wrong, please try again*. The failure message will be displayed over the form button
{% embed url="" %}
#### **After submit open Url**
After the visitor has successfully submitted the form, you have an option of whether the visitor needs to be redirected to a new page or just close the popup. If the *After submit open URL* field is empty then the popup just closes. If the *After submit open URL* field has any value then the visitor will be redirected
{% embed url="" %}
### **Example**
Below steps will help you in adding a popup and editing the popup based on your requirements
#### Edit the text
1. Click on the text that you wish to edit
2. Change the text in the editor palette
3. Once you make the changes click on save to apply the necessary changes
#### Changing the image
1. Click on the image
2. Click on the browse icon in the editor palette and change the image based on your requirement
3. Click on save
#### Changing the CTA
1. Click on the CTA
2. From the editor palette, you can change the text, dimensions, radius, etc. of the CTA. You can also change *href* of the CTA
3. Click on save
#### Change the background color of the popup
1. Click on the image
2. Click on parent then the entire template of the popup gets selected
3. Click on the fill color tool and select the color of your choice
4. Click on save
To preview your changes click on the preview button to check that your edits looks as you intended.
{% hint style="info" %}
Always the Preview Link is copied up to the last finalized changes
{% endhint %}
{% hint style="info" %}
All the CustomFit popups are responsive by default. We suggest you check how the popup looks like in both mobile and desktop mode before making it live.
{% endhint %}
# Triggers
### Overview
A **trigger** defines the exact moment an experience is activated for a visitor.
While targeting determines **who** should see an experience, a trigger determines **when** it should appear. It controls the timing and behavioral condition required before the experience is displayed or executed.
Triggers allow you to align your experiences with real user behavior. Instead of showing content immediately or randomly, you can wait for meaningful actions such as time spent on a page, scrolling, clicking a button, or preparing to leave. This ensures that experiences feel contextual, relevant, and less disruptive.
Using triggers effectively helps you:
* Deliver messages at the most impactful moment
* Improve engagement and conversion rates
* Avoid interrupting critical user flows
* Personalize interactions based on behavior
* Create more strategic and intentional user journeys
Each experience has its own trigger configuration, which can be managed from the **Settings** tab. Selecting the right trigger is essential for balancing visibility, timing, and user experience.
In short:
* **Targeting = Who sees it**
* **Trigger = When they see it**
Together, they give you full control over how and when your experiences are delivered.
### Where to Find Triggers
To configure triggers for an experience in CustomFit.ai, follow these steps:
1. Log in to your **CustomFit.ai Dashboard**.
2. From the left-hand sidebar, click on **Experience Engine**.
3. Select the experience in which you want to configure the trigger.
4. Navigate to the **Settings** tab within the selected experience.
5. Locate the **Trigger** section and choose the desired trigger type.
6. Configure the required trigger conditions and save your changes.
### Trigger Types
#### 1. Default
**Description:**\
Triggers the experience as soon as possible after the page begins loading.
**Use case:**\
Best for experiences that should appear immediately, such as announcements or mandatory messages.
**Notes:**
* Executes early in the page lifecycle.
* May display before all page elements are fully rendered.
#### 2. On Load of Page
**Description:**\
Triggers the experience when the DOM is fully loaded and ready.
**Use case:**\
Ideal when the experience depends on page elements being available in the DOM.
**Notes:**
* Waits for the page structure to be ready.
* More stable for element-dependent interactions than the Default trigger.
#### 3. On Click of an Element
**Description:**\
Triggers when the visitor clicks on a specified element.
**Configuration Required:**
* You must define the target element (e.g., CSS selector, element ID, or class).
**Use case:**
* Button clicks
* Navigation links
* Call-to-action interactions
**Example:**\
Trigger an experience when a user clicks the “Start Free Trial” button.
#### 4. Time Spent on a Page
**Description:**\
Triggers after the visitor has spent a specified amount of time on the page.
**Configuration Required:**
* Time in milliseconds (e.g., `10000` = 10 seconds)
**Use case:**
* Delayed popups
* Engagement prompts
* Timed promotions
**Example:**\
Show a subscription offer after 15 seconds on the page.
#### 5. Scroll Percentage
**Description:**\
Triggers after the visitor has scrolled a specified percentage of the page.
**Configuration Required:**
* Scroll percentage (e.g., 50%)
**Use case:**
* Content engagement prompts
* Mid-article offers
* Progressive messaging
**Example:**\
Display a related content recommendation after a visitor scrolls 70% of the article.
#### 6. Exit Intent
**Description:**\
Triggers when the visitor shows intent to leave the page.
**How it works:**\
Detects cursor movement toward the browser’s top bar or tab area (desktop devices).
**Use case:**
* Abandoned cart offers
* Last-chance promotions
* Feedback surveys
**Notes:**
* Primarily effective on desktop devices.
* May not function consistently on mobile.
#### 7. Custom
**Description:**\
Triggers based on custom conditions defined by you.
**Invocation (How to fire the trigger):**
After defining your custom logic or rule conditions, call the function below to invoke the trigger:
* **Function:** `executeTrigger();`
* **Purpose:** Executes your custom trigger logic and fires the experience when conditions are met.
```js
// Some code// ...your custom logic here
executeTrigger();
```
**Use case:**
* Complex targeting conditions
* Combined behavioral triggers
* Advanced segmentation rules
**Example: Invoke trigger after a delay**
Use `executeTrigger();` to invoke your custom trigger once your logic is ready. For example, to trigger the experience after **5 seconds**:
```js
setTimeout(function () {
// Call this method to invoke the custom trigger
executeTrigger();
}, 5000);
```
# Sitewide JS
**Sitewide JS** allows you to run custom JavaScript across every page where the CustomFit.ai code snippet is installed. It acts as a centralized scripting layer that applies globally, rather than being tied to a specific experience.
The script executes **before any experience changes are applied**, ensuring that your global logic runs first. This makes it especially useful for preparing data, setting shared conditions, defining reusable functionality, or establishing variables that experiences can depend on.
Unlike experience-level scripts that are scoped to individual campaigns, Sitewide JS applies consistently across your website wherever CustomFit.ai is active. It helps maintain uniform behavior, reduces duplication, and gives you greater control over how your personalization and experimentation framework operates at a foundational level.
Sitewide JS runs **only on live experiences**, meaning it will not execute while experiences are powered off.
### Where to Find Sitewide JS
To configure Sitewide JS in CustomFit.ai, follow these steps:
1. Log in to your **CustomFit.ai Dashboard**.
2. From the left-hand sidebar, click on **Settings** and then select **CustomFit Setup**.
3. Inside the setup section, navigate to the **Sitewide JS** tab.
4. Enter your JavaScript code in the provided editor.
5. Save and publish your changes to apply them to live experiences.
#### Important Considerations
* Changes apply globally once published.
* Scripts execute only when experiences are live.
* Since it runs before experiences, avoid conflicts with later modifications.
* Keep logic optimized to prevent unnecessary overhead across pages.
# ABM
Create 1-1 or 1-n personalized URL links
If you are driving the traffic to your website through outbound emails, social media campaigns, push notifications, etc. then you can give them a highly personalized experience. The ABM section will help you to add personalization parameters( such as user properties & UTM params) and generate 1-1 or 1-n personalized links.
For example, when you send a marketing/sales mail to your prospect, in most cases you know the prospect's first name, last name, company, designation, use-case to highlight, etc. With the help of the CustomFit ABM tool, you can embed all the information and generate a personalized link.
### Generating 1-n personalized link
To generate 1-n personalized links follow the below steps
1. Provide the Landing Page URL for which you would like to generate the link. For example, if you wish the visitor to land on a specific product page then provide the particular page URL
2. If you wish to add any custom property then provide the property name and value. For example, if you are generating a link for startups then the property name can be industry and the value should be startups
3. You can also add UTM parameters as part of the personalized link. For example, if you are running a Google campaign then enter google under the UTM Source
* UTM Source: This helps you to track the source from which the traffic is driven. For example, LinkedIn, Facebook, etc.
* UTM Medium: This helps you to know the channel which is driving more traffic to your website. For example, Social, CPC, etc.
* UTM Campaign: This indicates the name of the campaign which you are running. For example, Marketing Campaigns, Free-trial-demo Campaigns, etc.
* UTM Term: This helps you to track the specific keywords for the running campaign. For example, logo, link, etc.
* UTM Content: This helps you to differentiate the ads within a campaign. For example, vid-ad, etc.
Copy the generated URL and share it with your team or add it to any of your promotional campaigns(Ads, posts, etc.)
The generated URL has all the parameters attached to it as query parameters. And If you wish to shorten the URL and hide the parameters, then click on Generate tiny URL.
### Generating 1-1 personalized links
If you have a CSV file with a list of records and want to generate 1-1 personalized link for each of the records then follow the below steps
* Click on the CSV Upload tab
* Provide the Landing Page URL for which you would like to generate the link
* Upload the CSV file. The first row of the CSV file is considered a property name. You can download the sample CSV file by clicking on the sample.csv
* If you wish to add any UTM Parameters to be part of the personalized link then enter the values in the respective fields
* If you want to ignore/remove a few of the columns from the personalized links then from the dropdown unselect the column names which is not necessary
* Click on Generate tiny URL to generate the shortened URL.
* Click on Export to CSV to download the CSV file.
Below is the video of how to generate 1-1 personalized links
# Geo Location
Geo targeting allows you to provide a personalized experience for the visitors visiting from a specific geographic location. **For example,** you can provide a different experience who is visiting from INDIA and a different experience who is visiting from the USA.
CustomFit provides different Geo attributes that allow the visitor to target a visitor coming from a very specific geographic location. The different Geo attributes supported by CustomFit are :
* **Continent**
* **Country**
* **Country Code**
* **Region**
* **Region Code**
* **City**
* **Zip code**
CustomFit.ai supports the following different operator types:
| Operator Type | Description |
| ----------------------------- | ---------------------------------------------- |
| IS\_ONE\_OF, IS\_NOT\_ONE\_OF | Exact match |
| IS\_SET, IS\_NOT\_SET | Checks whether the attribute is set or not set |
To write a Geo-based rule
* Click on Add or Add rules
* Click on the attribute field
* In the dropdown, you can see the GEO section
* Select the required attribute
* Next, set the operator type based on your requirement
* From the dropdown select the pre-filled values. And if there is no dropdown then enter the value
* Then select the behavior which needs to be served
#### Rule with a single condition
For example, targeting visitors who are visiting from INDIA. So, the rule will be Country IS\_ONE\_OF INDIA.
#### Rule with multiple conditions
For example, targeting visitors who are visiting from INDIA and the device type is Desktop. So, the rule will be Country IS\_ONE\_OF INDIA AND Device IS\_ONE\_OF Desktop.
#### Rule with multiple values
For example, targeting visitors who are visiting either from Delhi or Karnataka. So, the rule will be Country IS\_ONE\_OF INDIA AND Region IS\_ONE\_OF Delhi or Karnataka.
# Technology
Based on the visitor's browser's visitor agent CustomFit identifies various technical attributes:
* **Browser**
* **Device Type**
* **Operating System**
* **Screen Width**
* **Screen Height**
CustomFit.ai supports the following different operator types:
| Operator Type | Description |
| ----------------------------- | ---------------------------------------------- |
| IS\_ONE\_OF, IS\_NOT\_ONE\_OF | Exact match |
| IS\_SET, IS\_NOT\_SET | Checks whether the attribute is set or not set |
To write a Technology-based rule
* Click on Add rule
* Click on the attribute field
* In the dropdown, you can see the Technology section
* Select the required attribute
* Next, set the operator type based on your requirement
* From the dropdown select the pre-filled values. And if there is no dropdown then enter the value
* Then select which behavior needs to be served
#### Rule with a single condition
For example, targeting visitors who are visiting from Desktop. So, the rule will be Device IS\_ONE\_OF Desktop.
#### Rule with multiple conditions
For example, targeting visitors who are visiting from Desktop and the browser is Chrome. So, the rule will be Device IS\_ONE\_OF Desktop AND Browser IS\_ONE\_OF Chrome.
#### Rule with multiple values
For example, targeting visitors who are visiting from Desktop and the browser is Chrome or Safari. So, the rule will be Device IS\_ONE\_OF Desktop AND Browser IS\_ONE\_OF Chrome OR Safari.
# UTM Parameters
UTM parameter targeting allows you to provide a personalized experience on the website when the visitor lands from specific UTM campaigns. With UTM parameter targetting you can personalize any page on the website, not just the landing page, as CustomFit attaches the UTM parameters to the visitor. **For example,** if a visitor is landing on one of the product pages from a specific UTM campaign then, you can provide a personalized experience on the demo page.
As CustomFit attaches the UTM parameters, you can provide a personalized experience to the visitor when they are returning to the website and do not have UTM parameters in the URL.
#### UTM parameters rule:
To write a UTM parameter rule
* Click on Add rule
* Click on the attribute field
* In the dropdown, you can see the UTM section
* Select the required type of UTM parameter
* Next, set the operator type based on your requirement
* Enter the value of the UTM parameter
* Then select which behavior needs to be served
CustomFit supports all the five different types of UTM parameters:
1. **Campaign Source**: The source parameter allows you to track from where the traffic is originated from. The parameter is **utm\_source**. The traffic can be from different sources such as Facebook, Google, or the name of an email list. **For example,** you can personalize the experience only for the visitors with **utm\_source=twitter.** Then the rule will be utm\_source IS*\_*ONE\_OF Twitter
* **Campaign Medium**: The medium parameter allows you to track what *type* of traffic the visitor originated from – email, social, referral, etc. The parameter is **utm\_medium**. **For example,** you can personalize the experience only for the visitors with **utm\_medium=email.** Then the rule will be utm\_medium IS*\_*ONE\_OF email
* **Campaign Name**: The name parameter allows you to track how a specific campaign is performing. The parameter is **utm\_campaign**. **For example,** you can personalize the experience only for the visitors with **utm\_campaign= facebook-campaign1.** Then the rule will be utm\_campaign IS*\_*ONE\_OF facebook-campaign1
* **Campaign Content**: The content parameter allows you to track which link was clicked when you have multiple links pointing to the same URL. The parameter is **utm\_content**. **For Example,** you can personalize the experience only for the visitors with **utm\_content=hero-text-signup.** Then the rule will be utm\_content IS*\_*ONE\_OF hero-text-signup
* **Campaign Term**: The term parameter is used for paid search ads to track which term a visitor came from. The parameter is **utm\_term**. **For Example,** you can personalize the experience only for the visitors with **utm\_term=Quora+Website+personalization.** Then the rule will be utm\_term IS*\_*ONE\_OF Quora+Website+personalization
CustomFit.ai supports the following different operator types:
| Operator Type | Description |
| ------------------------------------- | ---------------------------------------------- |
| IS\_ONE\_OF, IS\_NOT\_ONE\_OF | Exact match |
| STARTS\_WITH, DOES\_NOT\_STARTS\_WITH | Prefix match |
| ENDS\_WITH, DOES\_NOT\_ENDS\_WITH | Suffix match |
| CONTAINS, DOES\_NOT\_CONTAINS | Sub string match |
| IS\_SET, IS\_NOT\_SET | Checks whether the attribute is set or not set |
#### Rule with multiple conditions
For example, targeting visitors who are visiting from Google source, youtube\_video medium and marketing\_cro campaign
# Visitor Attributes
CustomFit allows you to target visitors based on various custom attributes such as Designation, Team, and so on. **For example,** if you are running an email campaign for the Marketing team then, you can create a custom attribute as Team. All the custom attributes can be attached to the visitors as query parameters.
To write a rule based on custom attributes
* Click on Add rule
* Click on the attribute field
* In the dropdown, you can see the Custom Properties section
* Select the required attribute
* Next, set the operator type based on your requirement
* Enter the value/s
* Then select which behavior needs to be served.
CustomFit allows you to create custom attributes of the following types:
* String
* Number
* Boolean
### The supported operation types for string type attributes are
#### IS\_ONE\_OF, IS\_NOT\_ONE\_OF
Use this operation type if you want to match each character from start to end. For example, to target the visitors with the team as Marketing. So, the rule will be Team IS\_ONE\_OF Marketing
To target the visitors apart from the Marketing team. So, the rule will be Team IS\_NOT\_ONE\_OF Marketing
#### STARTS\_WITH, DOES\_NOT\_STARTS\_WITH
Use this operation to perform the prefix match with the query parameter value. For example, to target the visitors whose first name starts with John. So the rule will be firstname STARTS\_WITH John
To target the visitors whose first name does not starts with John. So, the rule will be firstname DOES\_NOT\_STARTS\_WITH John
#### ENDS\_WITH, DOES\_NOT\_ENDS\_WITH
Use this operation to perform the suffix match with the query parameter value. For example, to target the visitors whose email id ends with *ai* domain. So the rule will be email\_id ENDS\_WITH ai
To target the visitors whose email id is not gmail.com. So, the rule will be email\_id DOES\_NOT\_ENDS\_WITH gmail.com
#### CONTAINS, DOES\_NOT\_CONTAINS
Use this operation to perform the substring match with the query parameter value.
#### IS\_SET, IS\_NOT\_SET
Use this operation to check whether the query parameter value has been set or not. For example, to target the visitors whose designation is known to us. So, the rule will be Designation IS\_SET
To target the visitors whose designation is not known to us. So, the rule will be Designation IS\_NOT\_SET
### The supported operation types for number type attributes are
#### IS\_ONE\_OF, IS\_NOT\_ONE\_OF
Use this operation type if you want to target the visitors whose age is 25. So, the rule will be Age IS\_ONE\_OF 25
To target the visitors apart from the age 25. So, the rule will be Age IS\_NOT\_ONE\_OF 25
#### GREATER\_THAN, GREATER\_THAN\_OR\_EQUAL\_TO
Use this operation type if you want to target visitors whose age is greater than 25. So, the rule will be Age GREATER\_THAN 25
To target visitors whose age is greater than or equal to 25. So, the rule will be Age GREATER\_THAN\_OR\_EQUAL\_TO 25
#### LESS\_THAN, LESS\_THAN\_OR\_EQUAL\_TO
Use this operation type if you want to target visitors whose experience is less than 3 years. So, the rule will be Experience LESS\_THAN 3
To target visitors whose experience is less than or equal to 3 years. So, the rule will be Experience LESS\_THAN\_OR\_EQUAL\_TO 3
#### IS\_SET, IS\_NOT\_SET
Use this operation to check whether the query parameter value has been set or not. For example, to target the visitors whose age is known to us. So, the rule will be Age IS\_SET
To target the visitors whose age is not known to us. So, the rule will be Age IS\_NOT\_SET
### The supported operation types for boolean type attributes are
#### IS\_ONE\_OF
Use this operation if you want to check whether any of the boolean attributes is set to TRUE or FALSE. For example, to target the visitors who have already requested a demo. Assume that you are using a boolean attribute "demo requested" to keep track of whether the visitor has requested the demo or not. So, the rule will be demo requested IS\_ONE\_OF True
To target the visitors who have not requested a demo. So, the rule will be demo requested IS\_ONE\_OF False
CustomFit allows you to write a rule by combining the different attribute types. For example, if you want to target visitors whose team is marketing, the experience is 3 years and they have not requested a demo. So the rule will be Team IS\_ONE\_OF Marketing AND Experience GREATER\_THAN\_OR\_EQUAL\_TO 3 And Demo Requested IS\_ONE\_OF False
### Visitor attributes Creation
CustomFit provides two ways to create visitor attributes:
1. Through Dashboard.
2. Through URL. To Create a visitor attribute just add the required attribute as a query parameter in the URL with the prefix cfup. For example, if you want to create a visitor attribute **Team** then the URL should be . If you are creating visitor attributes through URL then, the attribute type will be decided based on the attribute value. In the above example, the attribute Team will be of type String.
# Salesforce Attributes
On successful integration of the Salesforce, CustomFit displays 3 different Salesforce categories under which we have the various attributes:
* **Salesforce Leads**
* **Salesforce Contact**
* **Salesforce Account**
All the Salesforce attributes can be attached to the visitors as query parameters. To write a rule based on Salesforce attributes
* Click on Add rules
* Click on the Attribute field
* In the dropdown, you can see the Salesforce Lead section
**If you select String type property then the supported operation types for String type attributes are:**
#### IS\_ONE\_OF, IS\_NOT\_ONE\_OF
Use this operation type if you want to match each character from start to end. For example, to target the visitors with the Company name as CustomFit.ai. So, the rule will be Company IS\_ONE\_OF CustomFit.ai then, serve them B1 behavior.
For example, to target the visitors apart from the CustomFit.ai company. So, the rule will be Company IS\_NOT\_ONE\_OF CustomFit.ai then, serve them B2 behavior
#### STARTS\_WITH, DOES\_NOT\_STARTS\_WITH
Use this operation to perform the prefix match with the query parameter value. For example, to target the visitors whose first name starts with Smith. So the rule will be FirstName STARTS\_WITH Smith then, serve them B1 behavior
For example, to target the visitors whose first name does not starts with Smith. So the rule will be FirstName DOES\_NOT\_STARTS\_WITH Smith then, serve them B2 behavior
#### ENDS\_WITH, DOES\_NOT\_ENDS\_WITH
Use this operation to perform the suffix match with the query parameter value. For example, to target the visitors whose Email ends with *ai* domain. So the rule will be Email ENDS\_WITH ai then, serve them B1 behavior
For example, to target the visitors whose Email does not ends with *ai* domain. So the rule will be Email DOES\_NOT\_ENDS\_WITH ai then, serve them B2 behavior
#### CONTAINS, DOES\_NOT\_CONTAINS
Use this operation to perform the substring match with the query parameter value.
For example, to target the visitors whose DATA\_QUALITY\_DESCRIPTION\_\_C contains rating. So the rule will be DATA\_QUALITY\_DESCRIPTION\_\_C CONTAINS rating then, serve them B1 behavior
For example, to target the visitors whose DATA\_QUALITY\_DESCRIPTION\_\_C does not contains rating. So the rule will be DATA\_QUALITY\_DESCRIPTION\_\_C DOES\_NOT\_CONTAINS rating then, serve them B2 behavior
#### IS\_SET, IS\_NOT\_SET
Use this operation to check whether the query parameter value has been set or not. For example, to target the visitors whose cleanstatus is known to us. So, the rule will be CleanStatus IS\_SET then, serve them B1 behavior
For example, to target the visitors whose cleanstatus is not known to us. So, the rule will be CleanStatus IS\_NOT\_SET then, serve them B2 behavior
**If you select Number type property then the supported operation types for Number type attributes are:**
####
#### IS\_ONE\_OF, IS\_NOT\_ONE\_OF
Use this operation type if you want to target the visitors whose DATA\_QUALITY\_SCORE\_\_C is 1. So, the rule will be DATA\_QUALITY\_SCORE\_\_C IS\_ONE\_OF 1 then, serve them B1 behavior
For example, if you want to target the visitors whose DATA\_QUALITY\_SCORE\_\_C is not 1. So, the rule will be DATA\_QUALITY\_SCORE\_\_C IS\_NOT\_ONE\_OF 1 then, serve them B2 behavior
#### GREATER\_THAN, GREATER\_THAN\_OR\_EQUAL\_TO
Use this operation type if you want to target visitors whose DATA\_QUALITY\_SCORE\_\_C is greater than 0. So, DATA\_QUALITY\_SCORE\_\_C is GREATER\_THAN 0 then, serve them B1 behavior
For example, if you want to target visitors whose DATA\_QUALITY\_SCORE\_\_C is greater than or equal to 0. So, DATA\_QUALITY\_SCORE\_\_C is GREATER\_THAN\_OR\_EQUAL\_TO 0 then, serve them B2 behavior
#### LESS\_THAN, LESS\_THAN\_OR\_EQUAL\_TO
Use this operation type if you want to target visitors whose DATA\_QUALITY\_SCORE\_\_C is less than 1. So, the rule will be DATA\_QUALITY\_SCORE\_\_C LESS\_THAN 1 then, serve them B1 behavior
For example, if you want to target visitors whose DATA\_QUALITY\_SCORE\_\_C is less than or equal to 1 year. So, the rule will be DATA\_QUALITY\_SCORE\_\_C LESS\_THAN\_OR\_EQUAL\_TO 1 then, serve them B2 behavior
#### IS\_SET, IS\_NOT\_SET
Use this operation to check whether the query parameter value has been set or not. For example, to target the visitors whose DATA\_QUALITY\_SCORE\_\_C is known to us. So, the rule will be DATA\_QUALITY\_SCORE\_\_C IS\_SET then, serve them B1 behavior
For example, to target the visitors whose DATA\_QUALITY\_SCORE\_\_C is not known to us. So, the rule will be DATA\_QUALITY\_SCORE\_\_C IS\_NOT\_SET then, serve them B2 behavior
For reference, click on the link to know the list of Salesforce properties wrt Leads, Contact, and Account.
# HubSpot Attributes
On successful integration of the HubSpot, CustomFit displays 2 different HubSpot categories under which we have the various attributes:
* **HubSpot Contact**
* **HubSpot Firmographic**
All the HubSpot attributes can be attached to the visitors as query parameters. To write a rule based on HubSpot attributes
* Click on Add rules
* Click on the Attribute field
* In the dropdown, you can see the HubSpot Firmographic section
**If you select String type property then the supported operation types for String type attributes are:**
#### IS\_ONE\_OF, IS\_NOT\_ONE\_OF
Use this operation type if you want to match each character from start to end. For example, to target the visitors with the state as Karnataka. So, the rule will be State IS\_ONE\_OF Karnataka then, serve them B1 behavior.
For example, to target the visitors apart from the state as Karnataka. So, the rule will be State IS\_NOT\_ONE\_OF Karnataka then, serve them B2 behavior.
#### STARTS\_WITH, DOES\_NOT\_STARTS\_WITH
Use this operation to perform the prefix match with the query parameter value. For example, to target the visitors whose domain name starts with CustomFit. So the rule will be Domain STARTS\_WITH CustomFit then, serve them B1 behavior
For example, to target the visitors whose domain name does not starts with CustomFit. So the rule will be Domain DOES\_NOT\_STARTS\_WITH CustomFit then, serve them B2 behavior
#### ENDS\_WITH, DOES\_NOT\_ENDS\_WITH
Use this operation to perform the suffix match with the query parameter value. For example, to target the visitors whose website ends with *ai* domain. So the rule will be Website ENDS\_WITH ai then, serve them B1 behavior
For example, to target the visitors whose website does not ends with *ai* domain. So the rule will be Website DOES\_NOT\_ENDS\_WITH ai then, serve them B2 behavior
#### CONTAINS, DOES\_NOT\_CONTAINS
Use this operation to perform the substring match with the query parameter value.
For example, to target the visitors whose website contains .com. So the rule will be Website CONTAINS .com then, serve them B1 behavior
For example, to target the visitors whose website does not contains .com. So the rule will be Website DOES\_NOT\_CONTAINS .com then, serve them B2 behavior
#### IS\_SET, IS\_NOT\_SET
Use this operation to check whether the query parameter value has been set or not. For example, to target the visitors whose DATA\_QUALITY\_SCORE\_\_C is known to us. So, the rule will be DATA\_QUALITY\_SCORE\_\_C IS\_SET then, serve them B1 behavior
For example, to target the visitors whose DATA\_QUALITY\_SCORE\_\_C is not known to us. So, the rule will be DATA\_QUALITY\_SCORE\_\_C IS\_NOT\_SET then, serve them B2 behavior
**If you select Number type property then the supported operation types for Number type attributes are:**
#### IS\_ONE\_OF, IS\_NOT\_ONE\_OF
Use this operation type if you want to target the visitors whose num\_associated\_contacts is 1. So, the rule will be num\_associated\_contacts IS\_ONE\_OF 1 then, serve them B1 behavior
For example, to target the visitors whose num\_associated\_contacts is apart from 1. So, the rule will be num\_associated\_contacts IS\_NOT\_ONE\_OF 1 then, serve them B2 behavior
#### GREATER\_THAN, GREATER\_THAN\_OR\_EQUAL\_TO
Use this operation type if you want to target visitors whose number of employees is greater than 20. So, Number of Employees is GREATER\_THAN 20 then, serve them B1 behavior
For example, to target visitors whose number of employees is greater than or equal to 20. So, Number of Employees is GREATER\_THAN\_OR\_EQUAL\_TO 20 then, serve them B2 behavior
#### LESS\_THAN, LESS\_THAN\_OR\_EQUAL\_TO
Use this operation type if you want to target visitors whose number of employees is less than 1000. So, the rule will be Number of Employees is LESS\_THAN 1000 then, serve them B1 behavior
For example to target visitors whose number of employees is less than or equals to 1000. So, the rule will be Number of Employees is LESS\_THAN\_OR\_EQUAL\_TO 1000 then, serve them B2 behavior
#### IS\_SET, IS\_NOT\_SET
Use this operation to check whether the query parameter value has been set or not. For example, to target the visitors whose number of page views is known to us. So, the rule will be HS\_ANALYTICS\_NUM\_PAGE\_VIEWS IS\_SET then, serve them B1 behavior
For example, to target the visitors whose number of page views is not known to us. So, the rule will be HS\_ANALYTICS\_NUM\_PAGE\_VIEWS IS\_NOT\_SET then, serve them B2 behavior
For reference, you can go through the below link to know the list of hubspot properties
# Kickfire Attributes
On successful integration of the Kickfire, CustomFit displays various Kickfire attributes:
All the Kickfire attributes can be attached to the visitors as query parameters. To write a rule based on Kickfire attributes
* Click on Add rules
* Click on the Attribute field
* In the dropdown, you can see the Kickfire section
**If you select String type property then the supported operation types for String type attributes are:**
#### IS\_ONE\_OF, IS\_NOT\_ONE\_OF
Use this operation type if you want to match each character from start to end. For example, to target the visitors with the country as India. So, the rule will be Country IS\_ONE\_OF India then, serve them B1 behavior.
For example, to target the visitors apart from the country as India. So, the rule will be Country IS\_NOT\_ONE\_OF India then, serve them B2 behavior.
#### STARTS\_WITH, DOES\_NOT\_STARTS\_WITH
Use this operation to perform the prefix match with the query parameter value. For example, to target the visitors whose trade name starts with CustomFit. So the rule will be TradeName STARTS\_WITH CustomFit then, serve them B1 behavior
For example, to target the visitors whose trade name does not starts with CustomFit. So the rule will be TradeName DOES\_NOT\_STARTS\_WITH CustomFit then, serve them B1 behavior
#### ENDS\_WITH, DOES\_NOT\_ENDS\_WITH
Use this operation to perform the suffix match with the query parameter value. For example, to target the visitors whose website ends with *ai* . So the rule will be Website ENDS\_WITH ai then, serve them B1 behavior
For example, to target the visitors whose website does not ends with com. So the rule will be Website DOES\_NOT\_ENDS\_WITH com then, serve them B2 behavior
#### CONTAINS, DOES\_NOT\_CONTAINS
Use this operation to perform the substring match with the query parameter value.
For example, to target the visitors whose companyname contains ltd. So the rule will be CompanyName CONTAINS ltd then, serve them B1 behavior
For example, to target the visitors whose companyname does not contains ltd. So the rule will be CompanyName DOES\_NOT\_CONTAINS ltd then, serve them B2 behavior
#### IS\_SET, IS\_NOT\_SET
Use this operation to check whether the query parameter value has been set or not. For example, to target the visitors whose sicgroup is known to us. So, the rule will be sicGroup IS\_SET then, serve them B1 behavior
For example, to target the visitors whose sicgroup is not known to us. So, the rule will be sicGroup IS\_NOT\_SET then, serve them B2 behavior
**If you select Number type property then the supported operation types for Number type attributes are:**
#### IS\_ONE\_OF, IS\_NOT\_ONE\_OF
Use this operation type if you want to target the visitors whose confidence value is 75. So, the rule will be CONFIDENCE IS\_ONE\_OF 75 then, serve them B1 behavior
For example, to target the visitors whose confidence value is not 75. So, the rule will be CONFIDENCE IS\_NOT\_ONE\_OF 75 then, serve them B2 behavior
#### GREATER\_THAN, GREATER\_THAN\_OR\_EQUAL\_TO
Use this operation type if you want to target visitors whose dstoffset is greater than 0. So, DSTOFFSET is GREATER\_THAN 0 then, serve them B1 behavior
For example, to target visitors whose dstoffset is greater than or equal to 0. So, DSTOFFSET is GREATER\_THAN\_OR\_EQUAL\_TO 0 then, serve them B2 behavior
#### LESS\_THAN, LESS\_THAN\_OR\_EQUAL\_TO
Use this operation type if you want to target visitors whose dstoffset is less than 1. So, the rule will be DSTOFFSET LESS\_THAN 1 then, serve them B1 behavior
For example, to target visitors whose dstoffset is less than or equal to 1. So, the rule will be DSTOFFSET LESS\_THAN\_OR\_EQUAL\_TO 1 then, serve them B2 behavior
#### IS\_SET, IS\_NOT\_SET
Use this operation to check whether the query parameter value has been set or not. For example, to target the visitors whose isISP is known to us. So, the rule will be ISISP IS\_SET then, serve them B1 behavior
For example, to target the visitors whose isISP is not known to us. So, the rule will be ISISP IS\_NOT\_SET then, serve them B2 behavior
# Visitor Behavior
CustomFit allows you to target based on the behavior of the visitors. For example, if the visitor is visiting the website for the first time or the visitor is a repeated visitor, whether the visitor has clicked on the demo button, and so on.
# Page event
For page events, CustomFit.ai supports three types of operator types:
| Operator Type | Description |
| --------------------- | ------------------------------------------------- |
| Has been viewed | Whether the selected page has been viewed |
| Has not been viewed | Whether the selected page has not been viewed |
| Compare view by count | Comparing two different pages by their view count |
### Has been viewed
CustomFit supports the following conditions for has been viewed operator type
| Conditions | Allowed Values | Description |
| ---------- | -------------- | --------------------------------------------------------------- |
| Frequency | Exactly | The selected page has been viewed exactly "n" times |
| | At Most | The selected page has been viewed at most "n" times |
| | At Least | The selected page has been viewed at least "n" times |
| Duration | On | The selected page has been viewed on the given date "X" |
| | In The Last | The selected page has been viewed in the last "X" days |
| | In Between | The selected page has been viewed between "X" date and "Y" date |
| | Before | The selected page has been viewed before "X" date |
| | After | The selected page has been viewed after "X" date |
#### Frequency Exactly
For example, targeting visitors who have visited the pricing page exactly 3 times in the last 10 days then serve them B1 behavior
#### Frequency Atmost
For example, targeting visitors who have visited the pricing page atmost(Maximum) 3 times in the last 10 days then serve them B1 behavior
#### Frequency Atleast
For example, targeting visitors who have visited the pricing page atleast(Minimum) 3 times in the last 10 days then serve them B1 behavior
#### Duration On
For example, targeting visitors who have visited the pricing page exactly 3 times on 01/10/2021(MM/DD/YYYY) then serve them B1 behavior
#### Duration In the last
For example, targeting visitors who have visited the pricing page atleast 3 times in the last 10 days then serve them B1 behavior
#### Duration In between
For example, targeting visitors who have visited the pricing page alteast 3 times in between 01/10/2021 to 01/20/2021(MM/DD/YYYY) then serve them B1 behavior
#### Duration Before
For example, targeting visitors who have visited the pricing page atleast 3 times before 01/10/2021(MM/DD/YYYY) then serve them B1 behavior
#### Duration After
For example, targeting visitors who have visited the pricing page atleast 3 times after 01/10/2021(MM/DD/YYYY) then serve them B1 behavior
### Has not been viewed
CustomFit supports the following conditions for has not been viewed operator type
| Conditions | Allowed Values | Description |
| ---------- | -------------- | ------------------------------------------------------------------- |
| Duration | On | The selected page has not been viewed on the given date "X" |
| | In The Last | The selected page has not been viewed in the last "X" days o |
| | In Between | The selected page has not been viewed between "X" date and "Y" date |
| | Before | The selected page has not been viewed before "X" date |
| | After | The selected page has not been viewed after "X" date |
#### Duration On
For example, targeting visitors who have not visited the pricing page on 01/10/2021(MM/DD/YYYY) then serve them B1 behavior
#### Duration In the last
For example, targeting visitors who have not visited the pricing page in the last 10 days then serve them B1 behavior
#### Duration In between
For example, targeting visitors who have not visited the pricing page in between 01/10/2021 to 01/20/2021(MM/DD/YYYY) then serve them B1 behavior
#### Duration Before
For example, targeting visitors who have not visited the pricing page before 01/10/2021(MM/DD/YYYY) then serve them B1 behavior
#### Duration After
For example, targeting visitors who have not visited the pricing page after 01/10/2021(MM/DD/YYYY) then serve them B1 behavior
### Compare view by count
For Compare view by count, CustomFit supports the following conditions
| Conditions | Allowed Values | Description |
| ---------- | ------------------------- | ----------------------------------------------------------------------------------------------------------------- |
| Frequency | Greater Than | The selected page should have been viewed more number of times compared to the list of pages selected |
| | Greater Than or Equals to | The selected page should have been viewed more or the same number of times compared to the list of pages selected |
| | Lesser Than | The selected page should have been viewed less number of times compared to the list of pages selected |
| | Lesser Than or Equals To | The selected page should have been viewed less or same number of times compared to the list of pages selected |
| | Equals | The selected page should have been viewed same number of times compared to the list of pages selected |
| Duration | On | The comparison of the count value will be on the given date "X" |
| | In The Last | The comparison of the count value will be in the last "X" days |
| | In Between | The comparison of the count value will be between "X" date and "Y" date |
| | Before | The comparison of the count value will be before "X" date |
| | After | The comparison of the count value will be after "X" date |
#### Frequency Greater than
For example, targeting visitors who have visited subscription management page more number of times when compared to Billing automation & UPI transactions page in the last 10 days then, serve them Subscription management behavior
#### Frequency Greater than Equal to
For example, targeting visitors who have visited subscription management page more or equal number of times when compared to Billing automation & UPI transactions page in the last 10 days then, serve them Subscription management behavior
#### Frequency Lesser than
For example, targeting visitors who have visited subscription management page less number of times when compared to Billing automation & UPI transactions page in the last 10 days then, serve them Subscription management behavior
#### Frequency Lesser than Equal to
For example, targeting visitors who have visited subscription management page less or equal number of times when compared to Billing automation & UPI transactions page in the last 10 days then, serve them Subscription management behavior
#### Frequency Equals
For example, targeting visitors who have visited subscription management page same number of times when compared to Billing automation & UPI transactions page in the last 10 days then, serve them Subscription management behavior
#### Duration On
For example, serve Subscription management behavior who have visited subscription management page more number of times when compared to Billing automation & UPI transactions page on 01/10/2021(MM/DD/YYYY)
#### Duration In the last
For example, serve Subscription management behavior who have visited subscription management page more number of times when compared to Billing automation & UPI transactions page in the last 10 days
#### Duration In between
For example, serve Subscription management behavior who have visited subscription management page more number of times when compared to Billing automation & UPI transactions page between 01/10/2021 to 01/20/2021(MM/DD/YYYY)
#### Duration After
For example, serve Subscription management behavior who have visited subscription management page more number of times when compared to Billing automation & UPI transactions page after 01/10/2021(MM/DD/YYYY)
#### Duration Before
For example, serve Subscription management behavior who have visited subscription management page more number of times when compared to Billing automation & UPI transactions page before 01/10/2021(MM/DD/YYYY)
# Click event
For click events, CustomFit.ai supports three types of operator types:
| Operator Type | Description |
| ---------------------- | --------------------------------------------------- |
| Has been clicked | Whether the selected event has been clicked |
| Has not been clicked | Whether the selected event has not been clicked |
| Compare click by count | Comparing two different events by their click count |
### Has been clicked
CustomFit supports the following conditions for has been clicked operator type
| Conditions | Allowed Values | Description |
| ---------- | -------------- | --------------------------------------------------------------------- |
| Frequency | Exactly | The selected event has been clicked exactly "n" times |
| | At Most | The selected event has been clicked at most "n" times |
| | At Least | The selected event has been clicked at least "n" times |
| Duration | On | The selected event has been clicked on the given date "X" |
| | In The Last | The selected event has been clicked in the last "X" days or "X" hours |
| | In Between | The selected event has been clicked between "X" date and "Y" date |
| | Before | The selected event has been clicked before "X" date |
| | After | The selected event has been clicked after "X" date |
#### Frequency Exactly
For example, targeting visitors who have clicked on Get pricing button exactly 3 times in the last 10 days then serve them B1 behavior
#### Frequency Atmost
For example, targeting visitors who have clicked on Get pricing button atmost 3 times in the last 10 days then serve them B1 behavior
#### Frequency Atleast
For example, targeting visitors who have clicked on Get pricing button atleast 1 times in the last 10 days then serve them B1 behavior
#### Duration On
For example, targeting visitors who have clicked on Get pricing button atleast 1 times on 01/10/2021(MM/DD/YYYY) then serve them B1 behavior
#### Duration In the last
For example, targeting visitors who have clicked on Get pricing button atleast 1 times in the last 10 days then serve them B1 behavior
#### Duration In between
For example, targeting visitors who have clicked on Get pricing button atleast 1 times between 01/10/2021(MM/DD/YYYY) and 01/20/2021(MM/DD/YYYY) then serve them B1 behavior
#### Duration Before
For example, targeting visitors who have clicked on Get pricing button atleast 1 times before 01/10/2021(MM/DD/YYYY) then serve them B1 behavior
#### Duration After
For example, targeting visitors who have clicked on Get pricing button atleast 1 times after 01/10/2021(MM/DD/YYYY) then serve them B1 behavior
### Has not been clicked
CustomFit supports the following conditions for has not been clicked operator type
| Conditions | Allowed Values | Description |
| ---------- | -------------- | ------------------------------------------------------------------------- |
| Duration | On | The selected event has not been clicked on the given date "X" |
| | In The Last | The selected event has not been clicked in the last "X" days or "X" hours |
| | In Between | The selected event has not been clicked between "X" date and "Y" date |
| | Before | The selected event has not been clicked before "X" date |
| | After | The selected event has not been clicked after "X" date |
#### Duration On
For example, targeting visitors who have not clicked on Get pricing button on 01/10/2021(MM/DD/YYYY) then serve them B1 behavior
#### Duration In the last
For example, targeting visitors who have not clicked on Get pricing button in the last 10 days then serve them B1 behavior
#### Duration In between
For example, targeting visitors who have not clicked on Get pricing button between 01/10/2021(MM/DD/YYYY) and 01/20/2021(MM/DD/YYYY) then serve them B1 behavior
#### Duration Before
For example, targeting visitors who have not clicked on Get pricing button before 01/10/2021(MM/DD/YYYY) then serve them B1 behavior
#### Duration After
For example, targeting visitors who have not clicked on Get pricing button after 01/10/2021(MM/DD/YYYY) then serve them B1 behavior
### Compare click by count
CustomFit supports the following conditions for click by count operation type
| Conditions | Allowed Values | Description |
| ---------- | ------------------------- | ---------------------------------------------------------------------------------------------------------------- |
| Frequency | Greater Than | The selected event has been clicked more number of times when compared with the list of events selected |
| | Greater Than or Equals to | The selected event has been clicked more or equal number of times when compared with the list of events selected |
| | Lesser Than | The selected event has been clicked less number of times when compared with the list of events selected |
| | Lesser Than or Equals To | The selected event has been clicked less or equal number of times when compared with the list of events selected |
| | Equals | The selected event has been clicked equal number of times when compared with the list of events selected |
| Duration | On | The comparison of the count value will be on the given date "X" |
| | In The Last | The comparison of the count value will be in the last "X" days |
| | In Between | The comparison of the count value will be between "X" date and "Y" date |
| | Before | The comparison of the count value will be before "X" date |
| | After | The comparison of the count value will be after "X" date |
#### Frequency Greater than
For example, targeting visitors who have clicked Startup plan button more number of times when compared to SMB plan & Enterprise plan button in the last 10 days then, serve them Startup Behavior
#### Frequency Greater than Equals
For example, targeting visitors who have clicked Startup plan button more or same number of times when compared to SMB plan & Enterprise plan button in the last 10 days then, serve them Startup Behavior
#### Frequency Less than
For example, targeting visitors who have clicked Startup plan button less number of times when compared to SMB plan & Enterprise plan button in the last 10 days then, serve them SMB or Enterprise Behavior
#### Frequency Less than Equals
For example, targeting visitors who have clicked Startup plan button less or same number of times when compared to SMB plan & Enterprise plan button in the last 10 days then, serve them SMB or Enterprise Behavior
#### Frequency Equals
For example, targeting visitors who have clicked Startup plan button same number of times when compared to SMB plan & Enterprise plan button in the last 10 days then, serve them SMB or Enterprise or Startup behavior
#### Duration On
For example, targeting visitors who have clicked Startup plan button more number of times when compared to SMB plan & Enterprise plan button on 10/01/2021 then, serve them Startup Behavior
#### Duration In the last
For example, targeting visitors who have clicked Startup plan button more number of times when compared to SMB plan & Enterprise plan button in the last 10 days then, serve them Startup Behavior
#### Duration In between
For example, targeting visitors who have clicked Startup plan button more number of times when compared to SMB plan & Enterprise plan button between 10/01/2021 and 20/01/2021 then, serve them Startup Behavior
#### Duration Before
For example, targeting visitors who have clicked Startup plan button more number of times when compared to SMB plan & Enterprise plan button in the before 10/01/2021 then, serve them Startup Behavior
#### Duration After
For example, targeting visitors who have clicked Startup plan button more number of times when compared to SMB plan & Enterprise plan button in the after 10/01/2021 then, serve them Startup Behavior
# Track event
For track events, CustomFit.ai supports three types of operator types:
| Operator Type | Description |
| ---------------------- | --------------------------------------------------- |
| Has been tracked | Whether the selected event has been tracked |
| Has not been tracked | Whether the selected event has not been tracked |
| Compare track by count | Comparing two different events by their track count |
### Has been tracked
CustomFit supports the following conditions for has been tracked operator type
| Conditions | Allowed Values | Description |
| ---------- | -------------- | --------------------------------------------------------------------- |
| Frequency | Exactly | The selected event has been tracked exactly "n" times |
| | At Most | The selected event has been tracked at most "n" times |
| | At Least | The selected event has been tracked at least "n" times |
| Duration | On | The selected event has been tracked on the given date "X" |
| | In The Last | The selected event has been tracked in the last "X" days or "X" hours |
| | In Between | The selected event has been tracked between "X" date and "Y" date |
| | Before | The selected event has been tracked before "X" date |
| | After | The selected event has been tracked after "X" date |
#### Frequency Exactly
For example, tracking the number of times the visitors has played the demo video. If a visitor has played the demo video exactly 3 times in the last 10 days then, serve them B1 behavior
#### Frequency Atmost
For example, tracking the number of times the visitors has played the demo video. If a visitor has played the demo video atmost 3 times in the last 10 days then, serve them B1 behavior
#### Frequency Atleast
For example, targeting visitors who have clicked on Get pricing button atleast 1 time in the last 10 days then serve them B1 behavior
For example, tracking the number of times the visitors has played the demo video. If a visitor has played the demo video atleast 1 time in the last 10 days then, serve them B1 behavior
#### Duration On
For example, tracking the number of times the visitors has played the demo video. If a visitor has played the demo video atleast 1 time on 10/01/2021then, serve them B1 behavior
#### Duration In the last
For example, tracking the number of times the visitors has played the demo video. If a visitor has played the demo video atleast 1 time in the last 10 days then, serve them B1 behavior
#### Duration In between
For example, tracking the number of times the visitors has played the demo video. If a visitor has played the demo video atleast 1 time in between 10/01/2021 and 20/01/2021 then, serve them B1 behavior
#### Duration Before
For example, tracking the number of times the visitors has played the demo video. If a visitor has played the demo video atleast 1 time before 10/01/2021 then, serve them B1 behavior
#### Duration After
For example, tracking the number of times the visitors has played the demo video. If a visitor has played the demo video atleast 1 time after 10/01/2021 then, serve them B1 behavior
### Has not been tracked
CustomFit supports the following conditions for has not been tracked operator type
| Conditions | Allowed Values | Description |
| ---------- | -------------- | ------------------------------------------------------------------------- |
| Duration | On | The selected event has not been tracked on the given date "X" |
| | In The Last | The selected event has not been tracked in the last "X" days or "X" hours |
| | In Between | The selected event has not been tracked between "X" date and "Y" date |
| | Before | The selected event has not been tracked before "X" date |
| | After | The selected event has not been tracked after "X" date |
#### Duration On
For example, tracking the number of times the visitors has played the demo video. If the visitors has not played the demo video on 10/01/2021 then, serve them B1 behavior
#### Duration In the last
For example, tracking the number of times the visitors has played the demo video. If the visitor has not played the demo video in the last 10 days then, serve them B1 behavior
#### Duration In between
For example, tracking the number of times the visitors has played the demo video. If the visitor has not played the demo video in between 10/01/2021 and 20/01/2021 then, serve them B1 behavior
#### Duration Before
For example, tracking the number of times the visitors has played the demo video. If the visitor has not played the demo video before 10/01/2021 then, serve them B1 behavior
#### Duration After
For example, tracking the number of times the visitors has played the demo video. If the visitor has not played the demo video after 10/01/2021 then, serve them B1 behavior
### Compare track by count
CustomFit supports the following conditions for track by count operation type
| Conditions | Allowed Values | Description |
| ---------- | ------------------------- | ---------------------------------------------------------------------------------------------------------------- |
| Frequency | Greater Than | The selected event has been tracked more number of times when compared with the list of events selected |
| | Greater Than or Equals to | The selected event has been tracked more or equal number of times when compared with the list of events selected |
| | Lesser Than | The selected event has been tracked less number of times when compared with the list of events selected |
| | Lesser Than or Equals To | The selected event has been tracked less or equal number of times when compared with the list of events selected |
| | Equals | The selected event has been tracked equal number of times when compared with the list of events selected |
| Duration | On | The comparison of the count value will be on the given date "X" |
| | In The Last | The comparison of the count value will be in the last "X" days |
| | In Between | The comparison of the count value will be between "X" date and "Y" date |
| | Before | The comparison of the count value will be before "X" date |
| | After | The comparison of the count value will be after "X" date |
#### Frequency Greater than
#### Frequency Greater than
For example, if a visitor has played the product1 video more number of times when compared with the product2 video in the last 10 days then, serve them B1 behavior
#### Frequency Greater than Equals
For example, if a visitor has played the product1 video more or same number of times when compared with the product2 video in the last 10 days then, serve them B1 behavior
#### Frequency Less than
For example, if a visitor has played the product1 video less number of times when compared with the product2 video in the last 10 days then, serve them B1 behavior
#### Frequency Less than Equals
For example, if a visitor has played the product1 video less or same number of times when compared with the product2 video in the last 10 days then, serve them B1 behavior
#### Frequency Equals
For example, if a visitor has played the product1 video same number of times when compared with the product2 video in the last 10 days then, serve them B1 behavior
#### Duration On
For example, if a visitor has played the product1 video more number of times when compared with the product2 video on 10/01/2021 then, serve them B1 behavior
#### Duration In the last
For example, if a visitor has played the product1 video more number of times when compared with the product2 video in the last 10 days then, serve them B1 behavior
#### Duration In between
For example, if a visitor has played the product1 video more number of times when compared with the product2 video in between 10/01/2021 and 20/01/2021 then, serve them B1 behavior
#### Duration Before
For example, if a visitor has played the product1 video more number of times when compared with the product2 video before 10/01/2021 then, serve them B1 behavior
#### Duration After
For example, if a visitor has played the product1 video more number of times when compared with the product2 video after 10/01/2021 then, serve them B1 behavior
# GA4 Integration
Google Analytics 4 (GA4) lets you collect visitor data on your websites and apps for analytical purposes. You can import audiences from GA4 into your CustomFit account and create GA4 audiences directly from your CustomFit dashboard by linking your CustomFit account with GA4.
Integrating CustomFit with GA4 is a one-time process. You don't need to repeat this procedure every time you create a new experience.
{% hint style="warning" %}
You must first verify that the GA4 code is installed on your website before continuing. If Google Tag Manager (GTM) was used for installation, please follow the instructions present in this [document](https://doc.customfit.ai/integrations/ga4-integration-via-gtm).
{% endhint %}
### Enabling GA4 Integration
Perform the following steps to integrate GA4 with your CustomFit account:
* Log in to your CustomFit dashboard.
* From the dashboard sidebar, click on **Settings > 3rd Party Integrations.**
* On the integrations page, you can see the **Google Analytics 4** section.
* Click on the status field to enable Google Analytics 4 integration.
### Configuring GA4
* Once GA4 has been enabled, you will be redirected to the settings page. Or you can access the GA4 settings page by clicking on the Settings button present in the **Google Analytics 4** section.
* Connect your GA4 account with CustomFit.ai by clicking on **Sign in with Google.**
* Confirm the Google account you wish to use with CustomFit. Then, click Allow to provide permissions.
* If the integration is successful then you can see your GA4 connected email successful,.
* If you have installed GA4 through GTM then select the Tag installation mode as Google Tag Manager and Click on **Save** button. Follow the instructions listed in this [document](https://doc.customfit.ai/integrations/ga4-integration-via-gtm) to integrate GA4 through GTM.
### Setting up Experience Behavior as Audience in GA4
You can create audiences for your experience in your GA4 account directly from your CustomFit dashboard. It spares you from repeatedly setting up your GA4 filters in order to create audiences. Perform the following steps to accomplish it:
* Select **Allow CustomFit.ai to create GA4 audiences,** and click on the **Save** button**.**
* Now you will be able to set up your experience behavior as an audience in GA4. You can setup the audience while creating an experience or even after the experience has been created. To set up an audience in an experience, go to the integrations tab under an experience and click on **Set up Behaviors as Audiences in GA4**.
* Choose the GA account and property from the Set up Audiences pop-up. By doing this, the Audiences section will be enabled and it will populate all the versions of experience behaviors to be setup as Audiences in GA4.
* Type the versions' names into the corresponding text areas. This name will be used to identify the audiences in the GA4 account. Once done, click on the **Save** button. The audience will be created only when you **power on** the experience.
* You can only remove audiences once they have been set up; you cannot change any already-existing audiences. To do so, click on **Manage Audiences**.
* To remove an audience, click on the Delete icon for that audience. Click on Delete all to remove all the audiences. Once done, click **Save** button to confirm the changes.
### Reports in GA4
Once your audiences are created, you can compare them in your GA4 account for various parameters such as average Session Duration, Revenue, Bounce rate, etc. To view the reports, perform the below steps:
* On your GA4 dashboard, go to User Acquisition. This is the report for all the users.
* If you want to compare the user acquisition report with one of the audiences created by CustomFit, then click on **Add Comparison**. Enter the **dimension** as the audience name, then under **Match Type,** select **exactly matches,** and under the value, select the experience behavior of the audience that you want to compare. Next, click on the **Apply** button.
{% embed url="" %}
### Using GA4 audience to target visitors
To target website visitors for your experience, you may also import the audiences from GA4 into your CustomFit account. For example, you can use the audience that has added items to a wishlist and provide them with a special discount when they land on the website. To import GA4 audiences, perform the below steps:
* In the GA4 settings page, select **For CustomFit.ai experiences, use the GA4 audience to target visitors** option, and click on the **Save** button.
* Navigate to the experience where you wish to set up the GA4 audience as a rule.
* Click on **Add Rules**.
* From the list of options available, select **GA4 Audience.**
* To view the Audience list for a particular GA4 account and property, pick it from the popup.
* The **Audience match** and **Audience not match** options let you decide whether to include or exclude the user from the audience list.
* Next, choose the necessary GA4 audience from the final dropdown menu.
* Lastly, to save the configuration, click the **Save** button.
{% embed url="" %}
# GA4 Integration via GTM
### Creating Data Layer Variable
* Log in to your GTM account.
* Click on the **Variables** from the sidebar and then click on **New** button present in User-Defined Variables section.
* Enter the title as **CustomFit-Exp-Beh-String**
* Next, select the variable type as **Data Layer Variable**.
* Then, provide the Data Layer Variable Name as **customfit\_exp\_beh\_string**.
* Set the **Data Layer Version** to **Version 2.**
* Finally, set the **Default value** as **0** and click the **Save** button.
### Creating Triggers
* Click on the **Triggers** from the sidebar and then click on the **New** button.
* Give the **Trigger Name** as **CustomFit-Data-Push-GA4-Trigger**.
* Next, click on the **Trigger Configuration** and choose the Trigger type as **Custom Event**.
* Enter the E**vent name** as **customfit-data-push-ga4.**
* Finally, click on the **Save** button.
### Creating Tags
* Click on the **Tags** from the sidebar and then click on the **New** button.
* Give the **Tag Name** as **CustomFit-Data-Push-GA4**.
* Next, click the **Tag Configuration** and choose Tag type as **Google Analytics**. In Google Analytics, select **Google Analytics: GA4 Event** option.
* In the **Measurement ID** field, enter the Measurement ID of the GA4 account to which the data needs to be sent.
* Enter the **Event Name** as **experience\_impression.**
* In the **Event Parameters** section, click on the **Add row** button. Give the **Event Parameter** as **exp\_variant\_string** and value as **{{CustomFit-Exp-Beh-String}}**.
* Finally, click the **Triggering** section, and choose the **Firing Triggers** as **CustomFit-Data-Push-GA4-Trigger**. And Click on the **Save** button.
### Enabling and Configuring GA4 in CustomFit.ai
GTM is now fully set up to capture your CustomFit.ai data. The next step is to forward this data to GA4 by enabling the GA4 integration within your CustomFit.ai experiences. For detailed guidance on enabling the integration and completing the setup, refer to the article [linked](/integrations/ga4-integration).
# Microsoft Clarity Integration
Microsoft Clarity is a behavioral analytics tool that offers dashboards, heatmaps, session replays, and features such as rage clicks and dead clicks that make it easy to analyze issues that frustrate users.
You can integrate your CustomFit account with Microsoft Clarity to have your CustomFit experiences and behaviours pushed as custom tags in Clarity. This will allow you to view the recordings, heatmaps, and other insights of the corresponding visitor sessions if you are tracking website visitors with CustomFit and Microsoft Clarity.
### Prerequisites
* A Microsoft Clarity account that is currently active
* Your webpage should have both the CustomFit code snippet and Microsoft Clarity analytics code.
### Integrating CustomFit with Clarity
* Log in to your CustomFit dashboard.
* From the dashboard sidebar, click on **Settings > 3rd Party Integrations.**
* On the integrations page, you can see the **Clarity** section.
* Click on the status field to enable Clarity integration.
### Analyze recordings and heatmaps in Microsoft Clarity
* Log in to your Microsoft Clarity account.
* Go to **My Projects** and select your project.
* Click on **Filters**.
* Go to the **Customised Filters** section and click on **Customised Tags** option.
* From the **Customised tags** dropdown, select **customfit**. From the next dropdown select the required experience behavior and click on **Apply** button.
{% hint style="warning" %}
It will take around one hour for the custom tags that are pushed from CustomFit to appear in Microsoft Clarity.
{% endhint %}
{% embed url="" %}
# Hotjar Integration
Hotjar tracks how visitors use and interact with your website or product. You can integrate your CustomFit account with Hotjar to have your CustomFit experiences and behaviours pushed as custom event in Hotjar. This will allow you to view the recordings, heatmaps, and other insights of the corresponding visitor sessions if you are tracking website visitors with CustomFit and Hotjar.
### Prerequisites
* A Hotjar account that is currently active
* Your webpage should have both the CustomFit code snippet and the Hotjar analytics code.
### Integrating CustomFit with Hotjar
* Log in to your CustomFit dashboard.
* From the dashboard sidebar, click on **Settings > 3rd Party Integrations.**
* On the integrations page, you can see the **Hotjar** section.
* Click on the status field to enable Hotjar integration.
### Analyze recordings and heatmaps in Hotjar
* Log in to your Hotjar account.
* Click on the **dashboard** from the sidebar.
* Then click on the **Add Filter** button.
* From the list of options available click on the **event**.
* From the event drop-down, select **is any of these** options. From the next dropdown, select the required experience behavior and click on the **Apply** button.
{% embed url="" %}
# Clearbit Integration
Clearbit is a web-enabled marketing software that gathers information about people and companies.
Integrating CustomFit.ai and Clearbit will help your website to:
* Automatically display customer company details.
* Customize the use case based on the organization name, sector, and industry type
Follow the below steps to integrate CustomFit.ai with Clearbit :
* Log in to the dashboard and click on settings from the sidebar
* Click on 3rd Party Integrations
* On the integrations page, you can see the Clearbit section
* Click on the status field to enable Clearbit Integration
* Now Login to Clearbit and Go to the Dashboard, In the API Menu Copy the "secret API key"
* In the Clearbit section, you can see the Settings button. Click on it.
* Paste the copied secret API key in the "**Secret API key**" field. And also fill the other two fields based on your requirements
* **Cache timeout in minutes**: The minimum is 1 minute and the maximum is 43200 minutes. The cache time specifies the duration of how long the CustomFit can cache the IP address to firmographic details to avoid API call to Clearbit for the request coming from the same IP. This will speed up the personalization time
* **Skip fuzzy results**: True/False. Indicates if Clearbit achieved an exact match. If the value is set to true then CustomFit will attach the Clearbit properties to the visitors only if it is an exact match. And if it is set to false then CustomFit won't attach the Clearbit properties to the visitors
* Click on the Save button once all the details are filled
�
# 6sense Integration
6sense provides predictive insights into prospective buyers, analyzing their needs and predicting behavior throughout the buyer journey. Integrating 6sense with CustomFit enables personalized content delivery based on company attributes and segments, such as conducting A/B tests for users from targeted companies identified by 6sense.
Follow the below steps to integrate CustomFit.ai with 6sense:
* Log in to the dashboard and click on settings from the sidebar
* Click on 3rd Party Integrations
* On the integrations page, you can see the 6sense section
* Click on the status field to enable 6sense Integration
* Now log in to 6sense and Copy the "API key"
* In the 6sense section, you can see the Settings button. Click on it
* Paste the copied API key in the "**API key**" field
* Specify the cache timeout in minutes. The cache time specifies the duration of how long the CustomFit can cache the IP address to firmographic details to avoid API call to 6sense for the request coming from the same IP. This will speed up the personalization time. The minimum is 1 minute, and the maximum is 43200 minutes.
* Click on the Save button once all the details are filled
# Segment Integration
Segment collects, cleans, and controls your visitor data/event within a reliable infrastructure. You can integrate your CustomFit account with Segment to have your CustomFit experiences and behaviours pushed as custom events in Segment.
### Prerequisites
* A Segment account that is currently active
* Your webpage should have both the CustomFit code snippet and the Segment analytics code.
### Integrating CustomFit with Segment
* Log in to your CustomFit dashboard.
* From the dashboard sidebar, click on **Settings > 3rd Party Integrations.**
* On the integrations page, you can see the **Segment** section.
* Click on the status field to enable Segment integration.
### Validating integration
Once the integration is configured, you can validate that your experience behavior data is being transmitted to Segment.
* Log in to your Segment account.
* Click on **Sources** under Connections in the sidebar.
* Then click on the source installed on your website.
* To view a list of all the events the source has received, select the **Debugger** tab.
* Under the Debugger tab, you can see an event by the name **CustomFit Experience Viewed**. Click on this event to see the experience and behavior details.
# Mixpanel Integration
Mixpanel is an event analytics platform that allows anyone to get answers from their customers and revenue data in seconds. You can integrate your CustomFit account with Mixpanel to have your CustomFit experiences and behaviours pushed as custom events in Mixpanel.
### Prerequisites
* A Mixpanel account that is currently active
* Your webpage should have both the CustomFit code snippet and the Mixpanel analytics code.
### Integrating CustomFit with Mixpanel
* Log in to your CustomFit dashboard.
* From the dashboard sidebar, click on **Settings > 3rd Party Integrations.**
* On the integrations page, you can see the **Mixpanel** section.
* Click on the status field to enable Mixpanel integration.
### Validating integration
Once the integration is configured, you can validate that your experience behavior data is being transmitted to Mixpanel.
* Log in to your Mixpanel account.
* To view a list of all the events the account has received, select the **Events** tab.
* Under the **Events** tab, you can see an event by the name **CustomFit Experience Viewed**. Click on this event to see the experience and behavior details.
### Reports in Mixpanel
To filter the reports, perform the below steps:
* Log in to your Mixpanel account.
* Under the **Reports** tab, click on the **Insights** option.
* Then click on the **Select Event** option. And search for the **CustomFit Experience Viewed** event.
* Then click on the **Filter** option.
* From the event properties, select the required property to filter. For example, if you want to filter the report based on experience behavior then select **experience\_behavior**.
* Then, from the dropdown, select the value for the selected event property and click on the Add button.
# Amplitude Integration
Amplitude is a digital analytics platform that gives self-service visibility into the entire customer journey. You can integrate your CustomFit account with Amplitude to have your CustomFit experiences and behaviours pushed as custom events in Amplitude.
### Prerequisites
* A Amplitude account that is currently active
* Your webpage should have both the CustomFit code snippet and the Amplitude analytics code.
### Integrating CustomFit with Amplitude
* Log in to your CustomFit dashboard.
* From the dashboard sidebar, click on **Settings > 3rd Party Integrations.**
* On the integrations page, you can see the **Amplitude** section.
* Click on the status field to enable Amplitude integration.
### Validating integration
Once the integration is configured, you can validate that your experience behavior data is being transmitted to Amplitude.
* Log in to your Amplitude account.
* Click on the **Data** tab.
* To view a list of all the events the account has received, select the **Events** option.
* Under the **Events** tab, you can see an event by the name **CustomFit Experience Viewed**. Click on this event to see the experience and behavior details.
### Reports in Amplitude
To filter the reports, perform the below steps:
* Log in to your Amplitude account.
* Click on the **Create** button.
* Then, click on the **Segmentation** option.
* Click on the **Add Events** option and search for the **CustomFit Experience Viewed** event.
* Next, click on the **Filter by** option to filter the events based on the experience behavior data.
* From the event properties, select the required property to filter. For example, if you want to filter the report based on experience behavior then select **experience\_behavior**.
* Then, from the dropdown, select the requried value and click on the **Apply** button.
# Heap Integration
Heap is a digital insights platform that gives you a complete understanding of your customers’ digital journeys, so you can quickly improve conversion, retention, and customer delight. You can integrate your CustomFit account with Heap to have your CustomFit experiences and behaviours pushed as custom events in Heap.
### Prerequisites
* A Heap account that is currently active
* Your webpage should have both the CustomFit code snippet and the Heap analytics code.
### Integrating CustomFit with Heap
* Log in to your CustomFit dashboard.
* From the dashboard sidebar, click on **Settings > 3rd Party Integrations.**
* On the integrations page, you can see the **Heap** section.
* Click on the status field to enable Heap integration.
### Validating integration
Once the integration is configured, you can validate that your experience behavior data is being transmitted to Heap.
* Log in to your Heap account.
* Click on the **Data** option from the sidebar.
* Next, click on the **Live data feed** option.
* If you see the **CustomFit Experience Viewed** events then your Heap account is successfully receiving events from CustomFit.
### Reports in Heap
To filter the reports, perform the below steps:
* Log in to your Heap account.
* Click on the **Data** option from the sidebar.
* Next, click on the **Labeled events** option.
* Create a new label by clicking on the **Label event or property** button and then choosing the E**vent** option from the dropdown.
* Select the **category** as **Custom Events**.
* Next, give the **name** as **CustomFit Experience**. Then, select the **source** as **Custom**. Finally choose the **CustomFit Experience Viewed** event and click on the **Label event** button. This will label all the CustomFit experiences irrespective of the experience behaviors.
* If you want to label events specific to a particular experience behavior then click on the **Add filter** option.
* Next, from the **property** dropdown choose the **expereince\_behavior** option.
* Next, select the **operator** type as **equals** and select the required experience behavior value from the dropdown. Finally click on the **Label Event** button to create a label.
* Once the label has been created you can see the summary of the labelled events.
* If you want to create a Heap Segements then click on the **Segments** option.
* Next, click on the **Define segment** button.
* Select the **Category** as **Custom Events**.
* Give the segment name as CustomFit Experience Behavior. Alternatively, you can specify any name that would identify the segment—for instance, the name of an experienced behaviour. Then click on the **Add filter** option.
* Under the **Edit segment criteria** click on the property option and **choose users who have done** from the dropdown.
* Then, from the event dropdown select the required **event**. For example, CustomFit Experience behavior.
* Then, specify the **time range** and click on the **Label segment** button.
# Salesforce
Salesforce is a customer relationship management solution that brings companies and customers together.
Follow the below steps to integrate CustomFit.ai with Salesforce:
* Log in to the dashboard and click on settings from the sidebar
* Click on 3rd Party Integrations
* On the integrations page, you can see the Salesforce section
* Click on the status field to enable Salesforce Integration
* You need consumer key, consumer secret and instance URL . Follow the below steps to get these values
* Login to the Salesforce account by providing the credentials
* You need to create a connected app. [Click here](https://doc.customfit.ai/integrations/salesforce/connected-app) to know how to create a connected app.
* After the successful creation of the connected app you can find the Consumer Key and Consumer Secret.
* Copy and paste the consumer key and consumer secret from the connected app and enter the instance URL(URL visitor to login to your salesforce account). For example :
* Click on the Connect button, once all the details are filled
* Now in order for CustomFit to keep the data updated with the Salesforce data, you need to create an Apex class. [Click here](https://doc.customfit.ai/integrations/salesforce/apex-class) to learn how to create an Apex Class
* Now you need to create different triggers whenever there is any change in the Salesforce Contact, Lead or Account data. [Click here](https://doc.customfit.ai/integrations/salesforce/apex-triggers) to learn how to create different triggers
* Finally, configure the Remote Site Settings from [here](https://doc.customfit.ai/integrations/salesforce/remote-site-settings).
* In-case if the Salesforce integration fails, Click on Go back button, which will take you back to integrations page and then retry. If the problem persists, then reach out to CustomFit support
*
# Connected App
A **connected app** is a framework that enables an external **application(CustomFit)** to integrate with **Salesforce** using APIs and standard protocols. **Connected apps** use these protocols to authenticate, authorize, and provide single sign-on (SSO) for external **apps(CustomFit)**.� You can know more about Salesforce connected app [here](https://help.salesforce.com/articleView?id=sf.connected_app_overview.htm\&type=5). To Create a Connected app
* Click on settings icon
* Then click on Setup option from the dropdown
* Search for App Manager option and click on it
* Click on New Connected App
* Then provide the basic information
* Connected App Name: CustomFit App
* API Name: CustomFit\_App
* Contact Email:
* Then enable the OAuth Settings
* Provide the Callback URL as
* Under OAuth scopes add the following OAuth Scopes
* Access your basic information
* Access and manage your data
* Provide access to your data via the web
* Perform requests on your behalf at any time
* Then click on Save button
# Apex Class
You can know more about Apex class [here](https://developer.salesforce.com/docs/atlas.en-us.apexcode.meta/apexcode/apex_dev_guide.htm). To Create an Apex Class
* Click on settings icon
* Then click on Setup option from the dropdown
* Search for Apex Classes option and click on it
* Click on New button
* Copy and paste the below code snippet. The code snippet checks the Salesforce data and if there is any change/update in the customer information then it updates to CustomFit
```
public class CustomFitWebHook {
public static String jsonContent(List