Aller au contenu

Codes intégrés

Cette page contient des informations détaillées sur la structure des codes intégrés pour différents widgets.

cTrader Web, Vos stratégies, Stratégie unique, Stratégies multiples, Graphique du marché

Le code intégré pour les widgets cTrader Web, Graphique du marché, Vos stratégies, Stratégie unique et Stratégies multiples ressemble à ce qui suit :

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
<div id="ctrader-plugin-root" style="width: 100%, height: 100%"></div>
<script id="init" type="text/javascript" defer src="https://app.ctrader.com/widget.js"></script>
<script type="text/javascript">
    const script = document.getElementById('init');

    script.onload = () => {
        putInitScript('runPlugin');
        runPlugin('ctrader-plugin-root', {"route":"/?lang=en&theme=light&u=letstrade747","appConfig":{"chart":{"initialChartLayout":"Single"}}});
    };
</script>
 1
 2
 3
 4
 5
 6
 7
 8
 9
10
<div id="ctrader-plugin-root" style="width: 100%, height: 100%"></div>
<script id="init" type="text/javascript" defer src="https://app.ctrader.com/widget.js"></script>
<script type="text/javascript">
    const script = document.getElementById('init');

    script.onload = () => {
        putInitScript('runPlugin');
        runPlugin('ctrader-plugin-root', {"route":"/copy-provider/?lang=en&theme=dark&providerNickname=letstrade747&u=letstrade747","appConfig":{"strategy":{"showStrategyPromotion":true}}});
    };
</script>
 1
 2
 3
 4
 5
 6
 7
 8
 9
10
<div id="ctrader-plugin-root" style="width: 100%, height: 100%"></div>
<script id="init" type="text/javascript" defer src="https://app.ctrader.com/widget.js"></script>
<script type="text/javascript">
    const script = document.getElementById('init');

    script.onload = () => {
        putInitScript('runPlugin');
        runPlugin('ctrader-plugin-root', {"route":"/esp/2082/?lang=en&theme=dark&u=letstrade747","appConfig":{"strategy":{"showStrategyPromotion":false}}});
    };
</script>
 1
 2
 3
 4
 5
 6
 7
 8
 9
10
<div id="ctrader-plugin-root" style="width: 100%; height: 100%; position: relative"></div>
<script id="init" type="text/javascript" defer src="https://app.ctrader.com/widget.js"></script>
<script type="text/javascript">
    const script = document.getElementById('init');

    script.onload = () => {
        putInitScript('runPlugin');
        runPlugin('ctrader-plugin-root', {"route":"/multiple-strategies/?lang=en&theme=dark&u=letstrade747&strategyIdList=2082%2C2203","appConfig":{"strategy":{"showStrategyPromotion":true}}});
    };
</script>
 1
 2
 3
 4
 5
 6
 7
 8
 9
10
<div id="ctrader-plugin-root" style="width: 830px; height: 700px; position: relative"></div>
<script id="init" type="text/javascript" defer src="https://ct.spotware.com/widget.js"></script>
<script type="text/javascript">
    const script = document.getElementById('init');

    script.onload = () => {
        putInitScript('runPlugin');
        runPlugin('ctrader-plugin-root', {"route":"/market-chart/?s=EURUSD&period=H1&charttype=candlestick&palettename=dark&lang=en&w=830&h=700"});
    };
</script>

Chaque paramètre et argument de fonction est défini comme suit.

Nom Définitions et valeurs
div id "ctrader-root". Il s'agit de l'identifiant unique pour intégrer le widget dans une ressource web.
style "width: {number}%, height: {number}%". La largeur et la hauteur relatives du bloc intégré (par rapport à la taille du conteneur parent). Notez que la propriété display de l'élément parent doit être définie sur display: block.
type...defer "text/javascript". La directive qui indique que le bloc intégré contient du JavaScript au format texte. L'attribut defer indique que le script ne doit être exécuté qu'après que le navigateur a fini d'analyser l'intégralité du HTML de la ressource où le bloc est intégré.
'runPlugin' Le nom du script à exécuter.
'ctrader-plugin-root Le nom de l'élément à intégrer.
"route" L'URL de l'élément à intégrer par rapport à l'URL de base de cTrader Web.
"appConfig" La configuration de l'élément intégré. Pour les valeurs possibles, consultez les lignes suivantes.
"chart":{"initialChartLayout":"Single"}" Le mode de graphique initial du widget cTrader Web. "initialChartLayout" peut être défini sur "Single", "Multi" ou "Free".
"strategy":{"showStrategyPromotion":false} La configuration qui détermine si le bloc Promotion de stratégie est affiché pour les widgets Vos stratégies ou Toutes les stratégies.

Avertissement

La définition du paramètre style de ces widgets est obligatoire avant de les intégrer sur votre ressource web ; sinon, les widgets ne seront pas affichés. Vous pouvez uniquement spécifier la width et la height des widgets et laisser tous les autres attributs vides.