[티스토리] 블로그에 해외 실시간 주식 차트 넣는 법 (미국, 코인, ETF)

목차

 

요즈음 블로그에 미국 주식과 관련한 글들이 많이 올라옵니다. 오늘은 이와 관련하여 해외 실시간 차트를 글에서 제공하고 싶으신 분들이 있으실 텐데 오늘은 그 방법에 대해 알아봅시다.

 

해당 방법은 티스토리 블로그뿐만 아니라 웹페이자 HTML 코드를 삽입할 수 있는 모든 곳에서 사용할 수 있다는 장점이 있습니다.

 

해외 실시간 차트 삽입 방법 (차트 HTML 코드 만들기)

아래의 TradingView라는 사이트에서 원하는 차트의 HTML코드를 삽입할 수 있습니다.

https://www.tradingview.com/

TradingView – Track All Markets

[1] 상단 메뉴에서 [More] → [For business] → [Widgets]으로 들어갑니다.

홈페이지

[2] [Widgets]를 누르고 하단으로 내리면 [Get Widget]이라는 버튼이 나오는데 클릭해 줍니다.

[Get Widget]

 

[3] 그리고 아래로 내리면 이제 차트를 설정할 수 있는 곳이 나옵니다.

 

Embed Code는 실질적으로 블로그에 넣을 html 코드이고

Settings는 사용자의 입맛대로 차트를 구성하는 옵션들입니다.

 

[4] 자기가 원하는 옵션으로 Settings를 설정해 줍니다.

 

Setting에 여러 옵션이 있지만 이중에 개인적으로 일반적인 포스팅에 필요한 기능은 다음과 같다고 생각합니다.

Settings

Default Symbol을 클릭하여 원하는 종목을 선택해줍니다.

원하는 종목 검색

Color Theme은 블로그의 배경색에 따라 Dark나 Light로 설정해주시면 됩니다.

 

차트 크기를 고정으로 가져가고 싶으면 Width와 Height를 조절하시면 됩니다. (Px 단위)

 

체크한 기능은 다음과 같습니다.

• Show Details : 종목에 대한 간략한 정보를 우측에 띄워줍니다. (접을 수도 있습니다)
• <<Get image>> button : 방문자가 차트를 이미지로 저장할 수 있게 카메라 아이콘이 생성됩니다.
• Show symbol description  : 차트의 종목명이나 상장거래소 정보를 표시해 줍니다.

Apply 버튼을 클릭하면 다음과 같은 차트를 얻을 수 있습니다.

 

이외에는 추가적으로 적용해보시고 원하시면 추가하면 됩니다.

 

이제 차트를 만들었으니 본격적으로 차트를 블로그에 삽입해 봅시다.

내 블로그에 차트 삽입하기

[1] 그림의 Copy Code 버튼을 통해 코드를 복사합니다.

Copy code

 

[2] 자신의 티스토리 블로그 글을 쓰는 곳에서 HTML 모드를 엽니다.

HTML 모드

 

[3] 복사한 코드를 원하는 위치에 붙여 넣습니다.

코드 삽입

 

[4] 이제 미리 보기를 통해 결과를 확인하실 수 있습니다.

차트 삽입 결과

 

실제로 넣으면 아래와 같이 나옵니다.

 

 

AAPL stock chart by TradingView

 

필요하다면 자주 쓰는 지표나 주식은 서식을 통해서 필요할 때마다 쉽게 불러올 수 있습니다. 아래의 글을 참고해주시기 바랍니다. (에드센스 코드 대신 복사한 차트 코드를 붙여 넣으면 됩니다.)

2022.08.20 - [블로그] - [애드센스] 티스토리 서식으로 간단하게 광고 적용하기

[애드센스] 티스토리 서식으로 간단하게 광고 적용하기