JS on Nicepage

Hello Corentin,

Thanks for contacting us!

Open your Nicepage project and navigate to the page where you want to add the script.

Adding a Custom HTML Block:
Drag and drop a custom HTML block onto your page. This can usually be done by selecting the "Add Block" option and choosing a block that allows custom HTML or code insertion.

Embedding the JavaScript Code:
Within the custom HTML block, you can embed your JavaScript code.
Here's how you can do it:
Add the HTML element to your canvas.
Embed your JavaScript code within a <script> tag.

Here's an example of how you can embed your code into the custom HTML block:

<!-- Add your canvas element -->
<div>
    <canvas id="canvas3d"></canvas>
</div>

<!-- Embed your JavaScript code -->
<script type="module">
    import { Application } from '@nameoftool/runtime';

    document.addEventListener('DOMContentLoaded', () => {
        const canvas = document.getElementById('canvas3d');
        const app = new Application(canvas);

        app.load('url');
    });
</script>

You can try it, and we hope it helps you.

...................................................
Sincerely,
George.
Nicepage Support Team

Please subscribe to our YouTube channel: http://youtube.com/nicepage?sub_confirmation=1
Follow us on Facebook: http://facebook.com/nicepageapp

Hello,
I tried to put this code into my HTML block with the adjustment (the name of the tool and the url but nothing appears.

How can I fix that ?
This is my code :

<canvas id="canvas3d"></canvas>




import { Application } from '@splinetool/runtime';

document.addEventListener('DOMContentLoaded', () => {
    const canvas = document.getElementById('canvas3d');
    const app = new Application(canvas);

    app.load('https://prod.spline.design/Bbj-QjzwyezAtNhh/scene.splinecode');
});

Have a good day.

Hello Corentin,

Sorry for the late reply!

The code you provided is correct in terms of JavaScript syntax and functionality, but it won't work as expected in a typical HTML block because HTML blocks don't support ES module imports like import { Application } from '@splinetool/runtime';.

Unfortunately, after several attempts, I could not achieve the desired result.

We are very sorry.

You can search the nicepage forum to see if anyone has a similar experience or solution.
https://nicepage.com/forum

If you have any more questions, feel free to ask.

...................................................
Sincerely,
George.
Nicepage Support Team

Please subscribe to our YouTube channel: http://youtube.com/nicepage?sub_confirmation=1
Follow us on Facebook: http://facebook.com/nicepageapp