tradingviewのウィジェットを記事に貼り付け高さを調整する - Cocoonテーマに関する質問 https://wp-cocoon.com/community/cocoon-theme/tradingview%e3%81%ae%e3%82%a6%e3%82%a3%e3%82%b8%e3%82%a7%e3%83%83%e3%83%88%e3%82%92%e8%a8%98%e4%ba%8b%e3%81%ab%e8%b2%bc%e3%82%8a%e4%bb%98%e3%81%91%e9%ab%98%e3%81%95%e3%82%92%e8%aa%bf%e6%95%b4%e3%81%99/ Cocoon ディスカッション掲示板 ja Mon, 17 Aug 2026 02:26:08 +0000 wpForo 60 RE: tradingviewのウィジェットを記事に貼り付け高さを調整する https://wp-cocoon.com/community/cocoon-theme/tradingview%e3%81%ae%e3%82%a6%e3%82%a3%e3%82%b8%e3%82%a7%e3%83%83%e3%83%88%e3%82%92%e8%a8%98%e4%ba%8b%e3%81%ab%e8%b2%bc%e3%82%8a%e4%bb%98%e3%81%91%e9%ab%98%e3%81%95%e3%82%92%e8%aa%bf%e6%95%b4%e3%81%99/#post-22638 Mon, 30 Sep 2019 22:37:15 +0000 わいひら様

誠にありがとうございます！無事、解決できました！

]]> Cocoonテーマに関する質問 Chainsmoker198 https://wp-cocoon.com/community/cocoon-theme/tradingview%e3%81%ae%e3%82%a6%e3%82%a3%e3%82%b8%e3%82%a7%e3%83%83%e3%83%88%e3%82%92%e8%a8%98%e4%ba%8b%e3%81%ab%e8%b2%bc%e3%82%8a%e4%bb%98%e3%81%91%e9%ab%98%e3%81%95%e3%82%92%e8%aa%bf%e6%95%b4%e3%81%99/#post-22638 RE: tradingviewのウィジェットを記事に貼り付け高さを調整する https://wp-cocoon.com/community/cocoon-theme/tradingview%e3%81%ae%e3%82%a6%e3%82%a3%e3%82%b8%e3%82%a7%e3%83%83%e3%83%88%e3%82%92%e8%a8%98%e4%ba%8b%e3%81%ab%e8%b2%bc%e3%82%8a%e4%bb%98%e3%81%91%e9%ab%98%e3%81%95%e3%82%92%e8%aa%bf%e6%95%b4%e3%81%99/#post-22587 Mon, 30 Sep 2019 09:07:57 +0000 リンク先の説明を読む限りでは、自動サイズで高さを設定するには、CSSで変更するしかなさそうですね。

ウィジェットが異なる画面サイズに対応していません。どうすれば良いですか？
<i>自動サイズ</i>設定を使用してください。自動サイズ調整がオンの場合、ウィジェットは、囲み要素の幅および/または高さの100%を使用します。ウィジェットが正しく機能するためには、ある一定の親要素の高さを設定することがとても重要です。

子テーマのstyle.cssに対して、以下を追記すればできるかと思います。

div {
  height: 300px;
}

デバイスごとに、高さを変更する場合は、サイズを指定したメディアクエリ内に書くと良いかと思います。

]]> Cocoonテーマに関する質問 わいひら https://wp-cocoon.com/community/cocoon-theme/tradingview%e3%81%ae%e3%82%a6%e3%82%a3%e3%82%b8%e3%82%a7%e3%83%83%e3%83%88%e3%82%92%e8%a8%98%e4%ba%8b%e3%81%ab%e8%b2%bc%e3%82%8a%e4%bb%98%e3%81%91%e9%ab%98%e3%81%95%e3%82%92%e8%aa%bf%e6%95%b4%e3%81%99/#post-22587 RE: tradingviewのウィジェットを記事に貼り付け高さを調整する https://wp-cocoon.com/community/cocoon-theme/tradingview%e3%81%ae%e3%82%a6%e3%82%a3%e3%82%b8%e3%82%a7%e3%83%83%e3%83%88%e3%82%92%e8%a8%98%e4%ba%8b%e3%81%ab%e8%b2%bc%e3%82%8a%e4%bb%98%e3%81%91%e9%ab%98%e3%81%95%e3%82%92%e8%aa%bf%e6%95%b4%e3%81%99/#post-22575 Mon, 30 Sep 2019 02:07:33 +0000 わいひら様

ご返信いただきまして、ありがとうございます。

説明文ですが、以下のページの下の方に記載がござます。（"ウィジェットが異なる画面サイズに対応していません。どうすれば良いですか？"の箇所です）

https://jp.tradingview.com/widget/advanced-chart/

また、いただいたアドバイスを参考にCSSを以下の通り更新してみましたが、うまくいきませんでした。もし、よろしければ、どのような記載が必要であるかご教示いただければ幸いです。

https://notepad.pw/share/vhc3e0ipa

]]> Cocoonテーマに関する質問 Chainsmoker198 https://wp-cocoon.com/community/cocoon-theme/tradingview%e3%81%ae%e3%82%a6%e3%82%a3%e3%82%b8%e3%82%a7%e3%83%83%e3%83%88%e3%82%92%e8%a8%98%e4%ba%8b%e3%81%ab%e8%b2%bc%e3%82%8a%e4%bb%98%e3%81%91%e9%ab%98%e3%81%95%e3%82%92%e8%aa%bf%e6%95%b4%e3%81%99/#post-22575 RE: tradingviewのウィジェットを記事に貼り付け高さを調整する https://wp-cocoon.com/community/cocoon-theme/tradingview%e3%81%ae%e3%82%a6%e3%82%a3%e3%82%b8%e3%82%a7%e3%83%83%e3%83%88%e3%82%92%e8%a8%98%e4%ba%8b%e3%81%ab%e8%b2%bc%e3%82%8a%e4%bb%98%e3%81%91%e9%ab%98%e3%81%95%e3%82%92%e8%aa%bf%e6%95%b4%e3%81%99/#post-22446 Fri, 27 Sep 2019 11:11:07 +0000 CSSを変更すれば、多分高さは変更できるように思います。
高さは何pxほどにしますか？（ちなみに添付画像は高さ300pxです）
また、冒頭に書き込まれた、説明文が書かれているURLがあれば書き込んでいただけると助かります。
解説ページの説明を読めばもっと簡単な対応方法があるのかもしれないですし。

]]> Cocoonテーマに関する質問 わいひら https://wp-cocoon.com/community/cocoon-theme/tradingview%e3%81%ae%e3%82%a6%e3%82%a3%e3%82%b8%e3%82%a7%e3%83%83%e3%83%88%e3%82%92%e8%a8%98%e4%ba%8b%e3%81%ab%e8%b2%bc%e3%82%8a%e4%bb%98%e3%81%91%e9%ab%98%e3%81%95%e3%82%92%e8%aa%bf%e6%95%b4%e3%81%99/#post-22446 RE: tradingviewのウィジェットを記事に貼り付け高さを調整する https://wp-cocoon.com/community/cocoon-theme/tradingview%e3%81%ae%e3%82%a6%e3%82%a3%e3%82%b8%e3%82%a7%e3%83%83%e3%83%88%e3%82%92%e8%a8%98%e4%ba%8b%e3%81%ab%e8%b2%bc%e3%82%8a%e4%bb%98%e3%81%91%e9%ab%98%e3%81%95%e3%82%92%e8%aa%bf%e6%95%b4%e3%81%99/#post-22424 Thu, 26 Sep 2019 22:26:58 +0000 わいひら様

ご確認いただきましてありがとうござます。

また、大変失礼したいました。

以下の通りnotepad.pwツールにタグをはりつけました。

https://notepad.pw/share/sh12ii4j4

＞確認はしてみますが、必ずしもやり方がわかるかは保証できません。

本件、承知いたしました。もし、お分かりになれば、是非お願いできればと思います。

どうぞよろしくお願いいたします。

]]> Cocoonテーマに関する質問 Chainsmoker198 https://wp-cocoon.com/community/cocoon-theme/tradingview%e3%81%ae%e3%82%a6%e3%82%a3%e3%82%b8%e3%82%a7%e3%83%83%e3%83%88%e3%82%92%e8%a8%98%e4%ba%8b%e3%81%ab%e8%b2%bc%e3%82%8a%e4%bb%98%e3%81%91%e9%ab%98%e3%81%95%e3%82%92%e8%aa%bf%e6%95%b4%e3%81%99/#post-22424 RE: tradingviewのウィジェットを記事に貼り付け高さを調整する https://wp-cocoon.com/community/cocoon-theme/tradingview%e3%81%ae%e3%82%a6%e3%82%a3%e3%82%b8%e3%82%a7%e3%83%83%e3%83%88%e3%82%92%e8%a8%98%e4%ba%8b%e3%81%ab%e8%b2%bc%e3%82%8a%e4%bb%98%e3%81%91%e9%ab%98%e3%81%95%e3%82%92%e8%aa%bf%e6%95%b4%e3%81%99/#post-22404 Thu, 26 Sep 2019 10:56:33 +0000 申し訳ないですが、タグを貼り付ける場合は以下で紹介しているnotepad.pwツールを利用していただければと思います。
https://wp-cocoon.com/notepad-pw/
でないと、フォーラムによりHTMLが変換されてしまうので。

ただ、サポート対象外のものにもあるように、外部ツールは基本的にサポート外とさせていただいています。
確認はしてみますが、必ずしもやり方がわかるかは保証できません。

]]> Cocoonテーマに関する質問 わいひら https://wp-cocoon.com/community/cocoon-theme/tradingview%e3%81%ae%e3%82%a6%e3%82%a3%e3%82%b8%e3%82%a7%e3%83%83%e3%83%88%e3%82%92%e8%a8%98%e4%ba%8b%e3%81%ab%e8%b2%bc%e3%82%8a%e4%bb%98%e3%81%91%e9%ab%98%e3%81%95%e3%82%92%e8%aa%bf%e6%95%b4%e3%81%99/#post-22404 tradingviewのウィジェットを記事に貼り付け高さを調整する https://wp-cocoon.com/community/cocoon-theme/tradingview%e3%81%ae%e3%82%a6%e3%82%a3%e3%82%b8%e3%82%a7%e3%83%83%e3%83%88%e3%82%92%e8%a8%98%e4%ba%8b%e3%81%ab%e8%b2%bc%e3%82%8a%e4%bb%98%e3%81%91%e9%ab%98%e3%81%95%e3%82%92%e8%aa%bf%e6%95%b4%e3%81%99/#post-22367 Wed, 25 Sep 2019 12:05:17 +0000 はじめまして。

いつもCocoonを利用させていただいております。まことにありがとうございます。

さて、私のサイト（https://usakabu.com/）にTradingviewというサイトで提供しているウィジェットを貼り付けたいのですが、ウィジェットのサイズを"自動サイズ"にした場合、高さが100pix程度になってしまいます。「自動サイズ調整がオンの場合、ウィジェットは、囲み要素の幅および/または高さの100%を使用します。ウィジェットが正しく機能するためには、ある一定の親要素の高さを設定することがとても重要です。」とのことですが、どのように設定すべきか分からず、まことに申し訳ございませんが、解決方法をご教示いただければ幸いです。

なお、以下はサイト（記事）にはりつけるコードです。

 

<!-- TradingView Widget BEGIN -->



TradingView提供のAAPLチャート

https://s3.tradingview.com/tv.js

new TradingView.widget(
{
"autosize": true,
"symbol": "NASDAQ:AAPL",
"interval": "D",
"timezone": "Etc/UTC",
"theme": "Light",
"style": "1",
"locale": "ja",
"toolbar_bg": "#f1f3f6",
"enable_publishing": false,
"allow_symbol_change": true,
"container_id": "tradingview_df3e5"
}
);

</div>
<!-- TradingView Widget END -->

 

どうぞよろしくお願い申し上げます。

]]> Cocoonテーマに関する質問 Chainsmoker198 https://wp-cocoon.com/community/cocoon-theme/tradingview%e3%81%ae%e3%82%a6%e3%82%a3%e3%82%b8%e3%82%a7%e3%83%83%e3%83%88%e3%82%92%e8%a8%98%e4%ba%8b%e3%81%ab%e8%b2%bc%e3%82%8a%e4%bb%98%e3%81%91%e9%ab%98%e3%81%95%e3%82%92%e8%aa%bf%e6%95%b4%e3%81%99/#post-22367