Chart JS plugin

[asw]

Hi. I am trying to set up a simple chart.js chart on my website for testing. This requires a javascript script to run on a page. I have not been able to set up the script on the website successfully. I have however got a chart displayed on the webpage but in a way that I do not understand why it works this way and how to make it work properly.

• I have installed a code plugin - https://github.com/dartiss/code-embed
• I have added the JS to a code block in that plugin. That in itself did not work. Chart does not display.
• I then added the JS to the Theme co customisation code area. That in itself did not work. Chart does not display.
• Together the above two steps work - JS added to Theme customisation and the code block simultaneously. Chart displays.
• If I delete parts of the script in either place the chart does not display.

I am using the example script from chart.js so the script itself is fine. The above scenario is almost certainly going to throw up issues in the future, such as trying to make the chart dynamically respond to data inputted by a user. Not to mention the fact that the script has to run on every page in my website because it is in the Theme customisation area (at least I think it is the case that it runs on all pages).

The webpage I am trying to create the chart on: https://wonkylogic.co/area51/chart-js/

[marc_a]

Hi Alistair,

Thanks for reaching out.

Kindly provide us access to your site so that we can able check your issue.
Please create a secure note with the following info:

– Link to your site
– WordPress Admin username / password

To know how to create a secure note, please check this out: https://theme.co/forum/t/how-the-forum-works/288

Thank you.

[asw]

Hi @cramaton. I followed the steps to send you the requested details. Did it work?

[ruenel]

Hello @asw,

The credentials were not added in your original post. Please check out our documentation on how to get support. To know how to create a secure note, please check this out: How The Forum Works

By the way, to add any custom JS scripts, it is best that you install Insert Headers and Footers plugin.

Best Regards.

[asw]

Sorry, my bad. I didn’t realise I had to add the secure note to my original post. I ended up sending a direct message to cramaton. I have now added the secure note and I can see it, so that makes better sense

[marc_a]

Hi @asw,

I already figure it out why your chart.js didn’t load well because you didn’t add the CDN js external link properly. As my colleagues said you can use Insert Headers and Footers plugin or you can enqueue the third party script file in your Child Theme then functions.php. I already enqueue your CDN js external link in your functions.php.

Then to properly add the JS script from https://www.chartjs.org/docs/latest/ go to Pro > Theme Options then JS.

Some helpful link
Enqueue Script

Note: I disabled your code plugin- https://github.com/dartiss/code-embed

"Please note that providing custom code is outside the scope of our theme support. Issues that will arise from the use of custom codes should be forwarded to a 3rd party developer."

Thank you.