Overlay box with Sculpteo content

To be able to display Sculpteo content in an overlay box over your site, you need to include a small bit of Javascript in the <head> section of your page:

<script src="https://www.sculpteo.com/js/sculpteo.widget.js" type="text/javascript"></script>

Then adding the ‘sculpteo_button’ class to any link or button of your page will make it popup an overlay box with content depending on the value of the ‘click’ attribute. For example, this code:

<a class="sculpteo_button" click="order" onclose="alert('bye');" uuid="CWU47edB">Click on this link to order this design</a>

will produce the following link:

Click on this link to order this design

Attributes are used to specify which page to show and if necessary which design is concerned. It is also possible to be notified when the user leaves the overlay (EXPERIMENTAL: only works for the ‘configure’ page so far). The following attributes are supported:

click

‘cart’, ‘details’, ‘order’, ‘customize’, ‘view’, ‘none’ : page to show when the user clicks on the link/button

uuid

a string of characters : unique identifier of the design. It consists in the last part its embeddeding link.

onsave

javascript code : action performed when the user clicks the ‘save’ button (exits the box)

onorder

javascript code: action performed when the user clicks the ‘order’ button (exits the box)

onclose

javascript code: action performed when the box is closed

If neither ‘onsave’ nor ‘onorder’ are set, the save and order links are followed, with content displayed inside the box.

It is possible to dynamically update the button element in JavaScript via the ‘sculpteo.button()’ selector. It supports the following methods:

update(options)

Updates the button with the options dictonary. Keys of this dictionary correspond to the supported attributes above.

Alternatively, you may use a <div> element instead of the <a> element to produce a “3D Print button” like this:

<div class="sculpteo_button" click="order" uuid="CWU47edB"></div>

will produce the following link:

The onclose, onsave, onclose attributes are not supported yet in this case.

Prev: Embedded purchase module Next: Dynamic query of designs

» webapi documentation » Embedding Sculpteo Web Components » Overlay box with Sculpteo content

Last update: 1970-01-01 01:00 (CET)