NOTE: The ClickBank Trust Badge (CBTB) is NO LONGER required.
Overview
The ClickBank Trust Badge (CBTB) is a header, displaying the ClickBank brand, that must be displayed on all pages that contain a ClickBank pay link leading to a ClickBank order form. The CBTB is also required on the Thank You Page. This promotes a secure experience for the customer, regardless of the path that led them to your pitch page.
When the CBTB is clicked by the user, a modal displays with a short text summary identifying ClickBank as the retailer for the product.
ClickBank has provided JavaScript that can be used to add the CBTB to any product page. The CBTB can be added as a header bar or as a floating tab, and can be implemented in one of eight color palettes – four greyscale and four full-color. If you are a seller, you can choose the style and color configuration that works best with your site.
Since the CBTB is mandatory, your product can be disapproved or removed from the marketplace if your Pitch Page does not display the CBTB correctly.
Display
The CBTB can be displayed as a header bar or as a floating tab.
NOTE – Users on Internet Explorer 8 will always see the header bar due to limitations within the browser.
The header bar is centered on the top of the page. When the user scrolls down, the header scrolls off the page. For example:
The floating tab can be placed in any of the four corners of the page.
If the tab is displayed in either of the upper corners, the tab scrolls off the page when the user scrolls down. If the tab is displayed in either of the lower corners, it stays static and remains in that corner when the user scrolls down. The tab is positioned 10 pixels from the edge of the browser regardless of the window size.
For example:
If the user clicks the CBTB, it expands to show information about ClickBank.
For example:
There are eight color palette choices. These are the greyscale options:
These are the color options:
You can change your configuration and color/theme selection at any time.
Language Support
ClickBank uses browser detection to display the appropriate language for the CBTB. Supported languages include English, French, German, Spanish, Italian and Portuguese (also supported on the ClickBank order form).
Implementing the CBTB
You can add the ClickBank trust badge to your pages by logging into your account and generating a custom badge. The CBTB is linked to your account, so if you have multiple accounts, you will need to generate separate CBTBs for each account.
NOTE – If you use GoDaddy Website Builder version 6 or older, see the Implementing the CBTB With GoDaddy Website Builder procedure.
NOTE – The CBTB cannot be used on a page created using Wix or the latest GoDaddy GoCentral Website Builder.
- Log in to your ClickBank account.
- Click the Vendor Settings tab.
- Click My Site.
- Scroll down to the “ClickBank Trust Badge - Injection Code" section, then click Configure Settings. For example:
- Choose the badge configuration and color/theme combination that works best with your site. For example:
- Click Save Changes.
- Copy the unique JavaScript snippet provided. For example:
- Add the JavaScript snippet to your page.
- If you can edit the HTML directly, paste the JavaScript snippet into your HTML pages. We recommend placing it just above the closing header tag.
For example: - If you are using a website builder or other tool to create your site, find the option for adding JavaScript to the page and add the snippet there.
- If you can edit the HTML directly, paste the JavaScript snippet into your HTML pages. We recommend placing it just above the closing header tag.
- The CBTB should now be displayed on your page.
- View the page to verify that the CBTB is displaying properly.
NOTE – If you change the settings for your CBTB, it may take up to two hours for the new settings to be reflected on all of your pages.
Implementation Recommendations
To ensure the best experience for your customers with the addition of the ClickBank Trust Badge:
- Include a DOCTYPE declaration at the top of your HTML so that your page doesn't render in quirks mode. For example:
<!DOCTYPE html>
- If you choose to use the Centered Header Bar Badge Configuration, we recommend that you set the margin of the body tag element to 0. For example:
body{margin:0;}
- Test your CBTB implementation after making any changes. We recommend that your testing include the following at a minimum:
- Test your pages in different browsers and devices to confirm proper layout and functionality.
- Review your own analytics to ensure that everything is tracking properly.
- Ensure any proprietary scripts, such as exit pops, are working properly.
Modifying the CBTB For a Single Page
By default, the CBTB is displayed with the configuration and theme that you selected in your account. However, you can add parameters to the JavaScript on a specific page, which will override the account settings and display the CBTB with a different configuration or theme on that page.
You might want to use parameters to override the default Trust Badge selection for the purposes of split testing. With this, you may test a few different variations of the ClickBank Trust Badge to determine the best fit for your customers shopping experience.
The parameters that you can modify are position and theme.
Position
This parameter specifies the location of the ClickBank Trust Badge. It correlates to the “Badge Configuration” selection in your account. The possible values for this parameter are:
- HEADER
- TOP_LEFT
- TOP_RIGHT
- BOTTOM_LEFT
- BOTTOM_RIGHT
Theme
This parameter specifies the ClickBank Trust Badge coloring. It correlates to the “Color/Theme” selection in your account. The possible values for this parameter are:
- WHITE
- LIGHT_GREY
- DARK_GREY
- BLACK
- DARK_BLUE
- LIGHT_BLUE
- LIGHT_YELLOW
- LIGHT_GREEN
Example
For example, this code displays the CBTB in the lower left corner of the page with the black color theme:
<!-- ClickBank Trust Badge -->
<script src='//cbtb.clickbank.net/?vendor={VENDOR}&position=bottom_left&theme=black'></script>
Troubleshooting
This section contains information about troubleshooting common issues with the CBTB. If you are having issues with the CBTB that aren't discussed on this page, contact our client services team for assistance.
If you previously implemented the Always On Shopping Portal JavaScript, the CBTB is automatically displayed as a header bar in white. You can follow the procedures above to customize your configuration and color settings.
Restoring an Account Removed For Incorrect CBTB Use
If your account has been removed from the ClickBank Marketplace due to incorrect CBTB use, you can have your account restored.
Follow the procedures above to correctly display the CBTB on your site, then contact our client services team to have your account restored.
NOTE – The CBTB is account-specific. If you have multiple accounts, you must display the CBTB for the correct account on each pitch page. Using the CBTB for one account on a pitch page for another account is not correct use.
Implementing the CBTB With GoDaddy Website Builder
GoDaddy Website Builder uses custom template code which conflicts with JavaScript libraries used by the CBTB. As a consequence, you must modify the code used for the CBTB if you are implementing it using GoDaddy Website Builder.
Use the Implementing the CBTB procedure to configure your CBTB and copy the JavaScript snippet, then use this procedure to implement the CBTB and test your implementation.
NOTE – You must use a tab configuration for the CBTB if you are implementing it through GoDaddy Website Builder.
- Log in to your ClickBank account.
- Click the Vendor Settings tab.
- Click My Site.
- Locate the ClickBank Trust Badge - Injection Code section, then click Configure Settings. For example:
- Choose the badge configuration and color/theme combination that works best with your site. For example:
- Click Save Changes.
- Copy the unique JavaScript snippet provided. For example:
- Log in to the GoDaddy Website Builder and open the designer so that you can see your website and the various options for adding new elements to the page.
- Click the Manage Site button in the upper right corner. This option is displayed as a button with 3 horizontal lines. For example:
- Click Site Settings. For example:
- On the following display, click the Site-Wide Code tab. For example:
- Within the “Code to put between <HEAD> tags (all pages)" text box, add the following code snippet:
<script>
Then, add the JavaScript code snippet copied from your ClickBank account. This snippet is in this format, with your account nickname replacing "yournickname":
(function() {
var define = window.define;
window.define = function(package) {
if (package.HandlebarsEnvironment) {
window.Handlebars = package;
}
define.apply(this, arguments);
}; })();
</script>
<script src="//cbtb.clickbank.net/?vendor=yournickname"></script>
- Click OK to save the settings.
- Click Publish to publish your site.
- View the page to verify that the CBTB is displaying properly.
NOTE – If you change the settings for your CBTB, it may take up to two hours for the new settings to be reflected on all of your pages.
Additional Resources &Related Articles
- Creating Your First Product – This article describes the process of creating a product. Implementing the ClickBank Trust Badge is part of product creation.
- Creating a Payment Link – This article explains how to create a payment link to use on your pitch page.
- BLOG POST: Introducing the New ClickBank Trust Badge