Answered
write here a useful snippet of code - jquery only for beginner
useful little detail in jquery
(yourDesigner = change this)
--> .js file
//text change button
$('#textchange').click(function(){
yourDesigner.setElementParameters ({text: "change text here"}, "object title here");
return false;
});
--> html file:
<a href="#" id="textchange" class="fpd-btn">Change it!</a>
write here a useful snippet of code - jquery only
Vuetify + Fancy Product Designer - at once
---> .js script first
new Vue({
el: '#app',
vuetify: new Vuetify() });
--> html Head
<link rel='stylesheet' href='https://cdn.jsdelivr.net/npm/vuetify@2.4.3/dist/vuetify.min.css'>
---> html Body
<script src='https://cdn.jsdelivr.net/npm/babel-polyfill/dist/polyfill.min.js'></script>
<script src='https://cdn.jsdelivr.net/npm/vue@2.x/dist/vue.js'></script>
<script src='https://cdn.jsdelivr.net/npm/vuetify@2.4.3/dist/vuetify.min.js'></script>
---> html example
<div id="app">
<v-app id="inspire">
<div>
<v-alert
border="top"
color="red lighten-2"
dark
>
I'm an alert with a top border and red color
</v-alert>
</div>
</v-app>
</div>
Add element
(yourDesigner and icon.png = change this)
---> .js script
$('#new1').click(function(){
yourDesigner.addElement('image', 'icon.png', 'Image Title', {autoCenter: true, draggable: true});
return false;
});