このページではバフェット・コードが上場企業向けに提供する、コーポレートサイトのIRページに埋め込めるウィジェットについて説明します。
上場企業はウェブサイトにたった数行のhtmlを書くだけで、素敵な「決算ハイライト」ページを作ることができます。しかも利用無料です。
上場企業IRページ向けウィジェットについて
コーポレートサイトのIRページは、上場企業にとって投資家への玄関ともいうべき重要な場所です。
しかしながら投資家向けにコンテンツを作るのは簡単ではありません。
- そもそもどのようなページが投資家に求められるのだろう
- グラフや表はどのような見せ方がわかりやすいだろうか
- コンテンツが決まってもデザインセンスが足りないので不安
そうした課題をお持ちのご担当者は少なくないと思います。
そこでバフェット・コードでは、上場企業向けにコーポレートサイトのIRページへ簡単に投資家向けコンテンツを作れるウィジェット（IR ウィジェット）を提供しています。
IRウィジェットには
- 決算ハイライト
- 株式の状況
の2種類があります。
いずれも近年のIRでは必須とされるコンテンツになります。
IRウィジェットは、IRページに数行のHTMLを記載することで簡単に埋め込むことができます。
IRウィジェットはそれだけでページが完結できるよう、ページ全体のデザインを作り込んでいますので、コードを埋め込むだけで投資家向けコンテンツが完成します。
導入事例
実際のIRページへの導入事例をご覧ください。
いずれもウィジェットのみでページが完結しています。
導入方法
IRウィジェットをご利用になるには、下記の2つの作業が必要です。
お問い合わせ
まず、こちらからお問い合わせをお願いします。
利用規約に合意いただいたのち、バフェット・コード側で配信設定を行います。
それが完了しましたらIRウィジェットが利用可能となります。
お問い合わせいただいてから1週間もかからずリリースすることが可能です。
IRページの利用方法
利用可能になったIRウィジェットは、HTMLのテンプレートをコピー & ペーストしたうえで、
- 決算ハイライトのURL
- 株式状況のURL
- バフェットコードの企業ページのURL
の3箇所を変更するだけで使い始めることができます。
IRウィジェット、企業ページのURLは銘柄コードによって以下のように決まっています。
YOUR_TICKER は、ご自身の会社の銘柄コード（4桁の半角整数）です。
- 決算ハイライト
https://widget.buffett-code.com/v1/YOUR_TICKER/financial-highlights.js - 株式の状況
https://widget.buffett-code.com/v1/YOUR_TICKER/stock-information.js - バフェットコードの企業ページ
https://www.buffett-code.com/company/YOUR_TICKER/
例えば、銘柄コードが "1234" だった場合、それぞれ下記のようになります。
- 決算ハイライト
https://widget.buffett-code.com/v1/1234/financial-highlights.js - 株式の状況
https://widget.buffett-code.com/v1/1234/stock-information.js - バフェットコードの企業ページ
https://www.buffett-code.com/company/1234/
HTMLの埋め込み手順
決算ハイライト
決算ハイライトの埋め込む手順は下記のとおりです。
1. 下記をコピー & ペーストする
<div id="buffett-code-widget-financial-highlights" data-chart-colors="rgba(0, 104, 183, 0.8):rgba(199, 36, 36, 0.8):rgba(255, 163, 25, 0.8):rgba(35, 172, 14, 0.8)"></div>
<script type="module" src="決算ハイライトのURL" async charset="utf-8"></script>
<a href="バフェットコードの企業ページのURL" style="font-family: 'Helvetica Neue', Arial, 'Hiragino Kaku Gothic ProN', 'Hiragino Sans', Meiryo, sans-serif">Powered by バフェット・コード</a>
2. 決算ハイライトURL、企業ページのURLを自身の企業のものに書き換える
株式の状況
株式の状況の埋め込む手順は下記のとおりです。
1. 下記をコピー & ペーストする
<div id="buffett-code-widget-stock-information"></div>
<script type="module" src="株式の状況のURL" async charset="utf-8"></script>
<a href="バフェットコードの企業ページのURL" style="font-family: 'Helvetica Neue', Arial, 'Hiragino Kaku Gothic ProN', 'Hiragino Sans', Meiryo, sans-serif">Powered by バフェット・コード</a>
2. 決算ハイライトURL、企業ページのURLを自身の企業のものに置き換える
決算ハイライトの色指定について（webデザイナー・webエンジニア向け）
決算ハイライトは、必要に応じて data-chart-colors 属性 を指定することでグラフの凡例の色を変更できます。
- #ff6600 のような16進数カラーコード
- rgba(255, 127, 0, 1) のようなCSSの色指定リテラル
のいずれかを、区切り文字 ":" で連結して4色指定してください。未設定の場合、指定色が足りない場合はデフォルトで配色されます。なお、「株式の状況」は色の変更はできません。