Fancy Product Designer Multistep Product Configurator
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 firstnew 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>
Add element(yourDesigner and icon.png = change this)
---> .js script
$('#new1').click(function(){
yourDesigner.addElement('image', 'icon.png', 'Image Title', {autoCenter: true, draggable: true});
});
Balazs Puskas
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>
- Oldest First
- Popular
- Newest First
Sorted by Oldest FirstBalazs Puskas
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>
Balazs Puskas
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;
});
-
Adding Fancy Products to Categories
-
Shortcode for specfic product designer
-
What theme is recommended to use with FPD ?
-
Exclude Image from export
-
Google Font Family adds extras
-
Floating Dialog box
-
Uploadzone not working
-
Image transparency like in T-shirt demo
-
How do I get clipart
-
What does the LOAD button do / what is it for?
See all 2194 topics