Linking to external JS

Hi all,

I’ve just started my first project in Blocs and want to test some external CSS and Javascript, but I’m struggling to get the Javascript to work in preview. Here’s what I have done so far:
• Copied the custom HTML to a Code Widget
• Added the CSS and Javascript files to the Project Attachments

The HTML and CSS load and look like they should, but the Javascript functionality isn’t working.
I know the code works because I have used it on another website I built in Bootstrap Studio.
(It’s a loan calculator with sliders to change and calculate a value).

I think I just need to get my head around how Blocs works, so any pointers would be really appreciated.

Thanks
Andy

Hi Oblique,

Welcome to Blocs, I recently started using Blocs as well. Try this,
Copy and paste the javascript calculator controls into the page settings, by going to Page > Settings and click the Add Code button and then select the dropdown for Footer and paste the code in there. Also you can reference a link to the external javascript in the footer, place it before the controls.
<script src="./customjs/calculator.js"></script>

“Added the CSS and Javascript files to the Project Attachments”

Make a folder called “customjs” and put your custom javascript in there and attach the folder to the project, that way your js files will be neatly tucked away in the folder structure.

Hopefully this gets it working for you, there maybe a better way.

Warren

Hello @calibinder and @Oblique, to add js or css you can do it as explained above in Project Attachments,

But you don’t need create any reference in code, as Blocs automatically add that code to all files that are placed in Project attachments.

Just one note, when you add js and css they go to a folder JS and CSS.

so even if you need to call the file it ends like:

<script src="js/calculator.js"></script>
or
<style src="css/calculator.css"></style>

hope it help you…

Thanks for your reply Warren. I had to jump onto another project but I now have some time to try out Blocs again so hopefully I’ll get this working.

I’ll let you know how I get on.

Best wishes
Andy

Cool, thanks for your reply :slight_smile:

Thanks guys, this worked perfectly!