The Product Designer plugin for jQuery

– coding knowledge required

GET IT ON CODECANYON
View jQuery Doc

Clothing Designer Demo

 

Enter your text.
Enter your text.
Enter your text.
Enter your text.

Try some API calls



The plugin comes with a great API. All options, methods and events are documented in the JSDOC.


Output console:

	

	

How To

In the following tabs you will see how easy it is to set up a fancy product for the product designer.

<div id="fpd">
  <div class="fpd-product" title="TITLE" data-thumbnail="PREVIEW.png">
    <img src="URL_OF_THE_IMAGE.png" title="TITLE_FOR_IMAGE" data-parameters='{"x": 100, "y": 200, "colors": "#D5D5D5", "price": 20}' />
    <span title="TITLE_FOR_TEXT" data-parameters='{"x": 150, "y": 250, "removable": true, "draggable": true, "rotatable": true, "resizable": true, "colors": "#000000,#ffffff,#990000"}' >Default Text</span>
  </div>
  <!-- Here you can add more product divs -->
</div>

 

$(document).ready(function(){
  var fancyProductDesigner = new FancyProductDesigner($('#fpd'));
});

 

Frequent Asked Questions

You need to be familiar with HTML, CSS, jQuery (Javascript) and basic knowledge of PHP.
Yes and no. For some features like Facebook/Instagram photos a web server with PHP is needed.
At the moment I am only familiar with WooCommerce for WordPress and not with other platforms.