Broker Rating widget

The Broker Rating widget allows you to showcase your broker’s rating from TradingView directly on your website. It displays the star rating out of 5, awards your broker has won, and the total number of reviews.

Requirements

The widget uses ‘blob’ URLs to display broker awards. If you define a Content Security Policy (CSP) on your site, ensure your CSP includes the following directive to allow these URLs:

img-src 'self' blob:;

This directive allows your site to fetch and display images from ‘blob’ URLs, which are necessary for showing broker awards within the widget.

Add the widget

To add the Broker Rating widget to your webpage, first include the following script in your HTML. This script registers a new custom element <tv-broker-rating>.

<script src="https://www.tradingview-widget.com/widget/broker-rating.js?locale=en&broker=sample"></script>

After adding the script, you can use the custom element in your HTML as follows:

<tv-broker-rating broker="sample" theme="light" lang="en" transparent></tv-broker-rating>

The widget should be placed within a container element with a defined width, such as within a flexbox container or with specific width CSS styles. The displayed height of the widget depends on the number of awards and the displayed width.

Customize the widget

Custom element attributes

The <tv-broker-rating> element supports several attributes to customize its appearance and behavior:

  • broker: The name of your broker as supplied by TradingView. Contact your TradingView representative for your broker’s internal name.
  • theme: Defines the color theme. Options are 'light' or 'dark'.
  • lang: Specifies the language for text and tooltips. Available options include en (default), ar_AE, br, ca_ES, cs, de_DE, es, fr, he_IL, hu_HU, id, in, it, ja, kr, ms_MY, pl, ru, sv_SE, th_TH, tr, vi_VN, zh_CN, zh_TW, el, nl_NL, and ro.
  • transparent: If included, the widget’s background will be transparent without an outer border. If omitted, the widget will use the default theme background color.

Example code

<script src="https://www.tradingview-widget.com/widget/broker-rating.js?locale={your_locale}&broker={your_broker_name}"></script>
<div class="broker-rating-container">
<!-- Broker Rating widget will be inserted here -->
<tv-broker-rating broker="{your_broker_name}" theme="{your_theme}" lang="{your_locale}"></tv-broker-rating>
</div>

Replace {your_locale}, {your_broker_name}, and {your_theme} with your specific settings.

Script URL parameters

Ensure the script URL contains query parameters for locale and broker that match the attributes on the custom element. This prevents additional network requests for displaying the data:

<script src="https://www.tradingview-widget.com/widget/broker-rating.js?locale={your_locale}&broker={your_broker_name}"></script>
<div class="broker-rating-container">
<tv-broker-rating broker="{your_broker_name}" lang="{your_locale}"></tv-broker-rating>
</div>

Replace {your_locale} and {your_broker_name} with your settings.

Using the script for multiple brokers or locales

It is possible to load the script once and use it for multiple different brokers and/or locales. However, if you do this, there will be an additional network request for data for any instance that doesn’t match the settings defined in the script query parameter.

Contact us

For feedback or questions, please contact your TradingView representative. They can assist with any issues or provide further customization options for the widget.