콘텐츠로 이동

임베드 코드

이 페이지에는 다양한 위젯에 대한 임베드 코드의 구조에 대한 자세한 정보가 포함되어 있습니다.

cTrader Web, 귀하의 전략, 단일 전략, 다중 전략, 시장 차트

cTrader Web, 시장 차트, 귀하의 전략, 단일 전략 및 다중 전략 위젯의 임베드 코드는 다음과 같습니다:

 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>

각 매개변수와 함수 인수는 다음과 같이 정의됩니다.

이름 정의 및 값
div id "ctrader-root". 이는 웹 리소스에 위젯을 임베드하기 위한 고유 식별자입니다.
style "width: {number}%, height: {number}%". 임베드된 블록의 상대적 너비와 높이(부모 컨테이너의 크기에 대한 상대값). 부모 요소의 display 속성이 display: block으로 설정되어야 합니다.
type...defer "text/javascript". 임베드된 블록에 텍스트 형식의 JavaScript가 포함되어 있다는 지시문입니다. defer 속성은 브라우저가 블록이 임베드된 리소스의 전체 HTML 파싱을 완료한 후에만 스크립트가 실행되어야 함을 나타냅니다.
'runPlugin' 실행할 스크립트의 이름입니다.
'ctrader-plugin-root 임베드할 요소의 이름입니다.
"route" 기본 cTrader Web URL에 대한 임베드할 요소의 상대 URL입니다.
"appConfig" 임베드된 요소의 구성입니다. 가능한 값은 다음 행을 참조하세요.
"chart":{"initialChartLayout":"Single"}" cTrader Web 위젯의 초기 차트 모드입니다. "initialChartLayout"을(를) "Single", "Multi", 또는 "Free"로 설정할 수 있습니다.
"strategy":{"showStrategyPromotion":false} 귀하의 전략 또는 모든 전략 위젯에 대해 전략 프로모션 블록이 표시되는지 여부를 결정하는 구성입니다.

경고

이러한 위젯을 웹 리소스에 임베드하기 전에 style 매개변수를 설정하는 것이 필수입니다. 그렇지 않으면 위젯이 표시되지 않습니다. 위젯의 width와 height만 지정하고 다른 모든 속성은 비워둘 수 있습니다.