Jump to content

Move a Javascript Widget down 100 px

Recommended Posts

Site URL: https://www.bitcoin-trend-trader.com/bttforum

Hi Forum:

I embedded the js code provided by Tradingview to generate a live Bitcoin chart.  It is rendering at the very top of the page.  Header menus and logo are obscuring the chart.  I would like to move it down. 

I have pasted padding divs into the code but it continues to plot at the ver top.

The chart works perfectly when I inject the js code into Page>Advanced>Code Header

If I attempt to paste the same code into a <CODE> block that would allow me to add spacers to move it around, all I get when I save the page is the code text, not the functioning widget. 

Width and Height below are defining the chart size. 

I just need about 100 px above this script to move that chart down bellow the heading menus.

Thanks Michael

 

Here is the code with my attempt to add a spacer:

<!-- TradingView Widget BEGIN -->
  <div {
  padding-top: 400px;
  padding-bottom: 10px;
></div>
<div class="tradingview-widget-container">
  <div id="tradingview_72cf8"></div>
  <div class="tradingview-widget-copyright"><a href="https://www.tradingview.com/symbols/BTCUSDT/?exchange=BITBAY" rel="noopener" target="_blank"><span class="blue-text">BTCUSDT Chart</span></a> by TradingView</div>

  <script type="text/javascript" src="https://s3.tradingview.com/tv.js"></script>
  <script type="text/javascript">
  new TradingView.widget(
  {
  "width": 1400,
  "height": 700,
  "symbol": "BITBAY:BTCUSDT",
  "interval": "D",
  "timezone": "Etc/UTC",
  "theme": "dark",
  "style": "1",
  "locale": "en",
  "toolbar_bg": "#000000",
  "enable_publishing": false,
  "withdateranges": true,
  "hide_side_toolbar": false,
  "details": true,
  "calendar": true,
  "studies": [
    "MoonPhases@tv-basicstudies",
    "MAExp@tv-basicstudies",
    "ZigZag@tv-basicstudies"
  ],
  "container_id": "tradingview_72cf8"
}
  );
  </script>
</div>
<!-- TradingView Widget END -->

Link to comment
  • Replies 1
  • Views 670
  • Created
  • Last Reply

Top Posters In This Topic

Popular Days

Top Posters In This Topic

Create an account or sign in to comment

You need to be a member in order to leave a comment

×
×
  • Create New...

Squarespace Webinars

Free online sessions where you’ll learn the basics and refine your Squarespace skills.

Hire a Designer

Stand out online with the help of an experienced designer or developer.