Skip to content

Integrating Blueshift in Your Own Content or Website

If you are looking for ways to share your trade ideas and strategy performance publicly, this section is for you. On Blueshift, we support multiple modes of sharing your ideas

Sharing backtest results

This is the simplest option. Once you are done with a backtest, go to the backtest page and locate the orange share button on the top right.

backtest-share

Before you can share a backtest, you must make it public. Backtests on Blueshift by default are private. Only when it is made public, others can see it. Once you click the share button above, you will see a share pop up dialog box. Click the option against make this backtest public .... This takes a while to change the permission settings of your backtest visibility.

backtest-share

Once it is public, you will get a link which you can share directly. Anyone with the link will be able see the backtest results. Or you can choose to share directly on supported social media platforms. Note: public sharing of backtest will still keep the strategy code private. Only the results (and not the code) will be visible. Also at any point in time, you can switch back the backtest to private mode.

Embedding backtest results

If you are a blogger, or create and publish contents on your own website, you can easily embedd the backtest results in your content. To do that, click the (</>)button and copy and paste the code in your content html. This will create an iframe widget of the backtest and embed it on your website, any where in the html body. Clicking this will take the user to the backtest results page on Blueshift. The widget cannot be resized, as it is meant to be used to show an overview of the results and will take to the detailed backtest page for more.

Embedding backtest and live trading buttons

Also, it is very straight-forward to embed a backtest or a live trading button on your website or blog. This is especially useful if you are creating relevant content and wants your users to interact and try out your strategies first-hand.

To do this, first you need to include Blueshift third-party javascript library somehere in the html within a script tag as below:

1
<script src="https://di206pkbrwro2.cloudfront.net/static-assets-prod/3rd-party-integration/blueshift-3rd-party-script-prod-v3-minified.js"></script>
To display the button and automatically bind your strategy, first upload your strategy code in a public GitHub repository. Make sure the strategy code file is a valid Blueshift code (and ends in .py extension) and its size is no more than 1 MB. Then use the custom blueshift-connect-button to include at the desired place in your html as below

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
<html>
<head>
<script 
   src="https://di206pkbrwro2.cloudfront.net/static-assets-prod/3rd-party-integration/blueshift-3rd-party-script-prod-v3-minified.js">
</script>
</head>
<body>
<blueshift-connect-button 
  data-blueshift="button" 
  data-action="backtest" 
  data-name="my_strategy"
  data-is-folder="0"
  data-editor-type="code" 
  data-strategy-link="https://github.com/QuantInsti/blueshift-demo-strategies/blob/master/factors/time_series_momentum.py"
  data-backtest-bundle-name="NSE Minute" 
  data-backtest-end-date=2010-01-01 
  data-backtest-start-date=2020-12-31
  data-backtest-start-capital=10000
  data-button-size="sm" 
  data-button-theme="light">
</blueshift-connect-button>
</body>
</html>
This creates a button like which, once click, can automatically load and run a backtest or a start launching of a live execution.

blueshift button

The parameters (data-* values) above have the following meaning:

  • data-blueshift: [Required] The value is always button.
  • data-action: [Required] Set it to backtest for a backtest button, or go-live for live trading.
  • data-name: [Required] Strategy name - a valid Python module name (without any .py extension).
  • data-is-folder: [Required] Set it to value = 0.
  • data-editor-type: [Required] Set this to code.
  • data-strategy-link: [Required] Link to your GitHub file.
  • data-backtest-bundle-name: [Optional] For backtest, the name of one of the datasets on blueshift.
  • data-backtest-end-date: [Optional] For backtest, end date in yyyy-mm-dd format.
  • data-backtest-start-date: [Optional] For backtest, start date in yyyy-mm-dd format.
  • data-backtest-start-capital: [Optional] Only applicable for backtest, starting capital.
  • data-button-size: [Optional] Size of the button - use sm (small), m (medium) or l (large).
  • data-button-theme: [Optional] Background theme where the button - use light or dark.

Clicking this button will automatically take your users to Blueshift. In case they already have an account on Blueshift, this automatically creates the strategy and fills in the backtest paramets (if supplied, for backtest), or takes the user to the live execution launch page. A new or signed out user, after completion of sign-up/ sign-in on Blueshift, will follow the same.