Jsfiddle embeds (or any js embed)

Design help Custom code
1

Hey webflow users, I am hoping you can help me as a none-coder, I don’t actually understand which parts of a jsfiddle embed I place where in Webflow.

Here is the item I want to embed…

What parts do I insert into what places on Webflow?
Which part goes in the Head?
Which part goes in the body? if any
Which part goes in to an HTML embed div?

Hope you can help, I am pretty good at page layouts and styling, I just don’t understand the js embed.

Thanks Graham

2

This part all goes into the page custom footer code:

<script src="https://code.highcharts.com/stock/highstock.js"></script>
<script src="https://code.highcharts.com/stock/modules/exporting.js"></script>
<script>
$.getJSON('https://www.highcharts.com/samples/data/jsonp.php?filename=aapl-c.json&callback=?', function (data) {
    // Create the chart
    Highcharts.stockChart('container', {

        rangeSelector: {
            selected: 1
        },
        title: {
            text: 'AAPL Stock Price'
        },
        series: [{
            name: 'AAPL',
            data: data,
            tooltip: {
                valueDecimals: 2
            }
        }]
    });
});
</script>

As for this part:

<div id="container" style="height: 400px; min-width: 310px"></div>

You do not need to paste this anywhere. Just add a div from the elements panel, then go to the settings panel on the right and give it an ID container. You can of course give it the same height and min-width like above.

As for this part:

<script src="https://code.jquery.com/jquery-3.1.1.min.js"></script>

You do not need to include jquery a second time. Webflow already includes it in your project.

Also, feel free to contact me for further code help and/or customization of third-party plugins

3

Thanks Sam,
Very much appreciated, I have saved your site link for my next complex code requirement, I do get them from time to time, I normally reach out on Fiverr.
Thanks Graham