1. in Pacdora website, go to Design Assets/Template create or find a product, copy the template id. e.g. 54762930
2. in Myerton website, find code snippets plugin. Create new Javascript code snippets, name as the template id
3. in the new code snippet, copy below code

const PACDORA_LOADED_KEY = ‘myAppPacdoraInitialized’;

async function initPacdora() {
if (window[PACDORA_LOADED_KEY]) {
return;
}
window[PACDORA_LOADED_KEY] = true;

try {
await Pacdora.init({
appId: ‘584fa0a8cf26a121’,
isDelay: true,
theme: ‘#3300FF’,
});

await Pacdora.createScene({
templateId: 54762930, // Template ID for the package
isShowLoading: true,
isCreatePreview: true,
});

} catch (error) {
console.error(“Pacdora Init Error:”, error);
window[PACDORA_LOADED_KEY] = false;
}
}
if (document.readyState === “loading”) {
document.addEventListener(“DOMContentLoaded”, initPacdora, { once: true });
} else {
initPacdora();
}

4.save the code snippet and in the Insertion click on shortcut, and you will see the shortcut code e.g. and make sure this snippet is active.
5. In any page you want show a 3d product, insert a div and the shortcut code. For example in this page, I will show a 3d product, simply do :

6. Now I want access 3d editor, it’s by click a button and it will open a dialog to 3d editor, use below code:

7. create a size input for download Die-line. use below code for input and download button and the code to update pacdora Size API

//event listener for input to update pacdora API
8.button start collect user info. The key is to have a hidden button. need to copy all the code below