Zakeke allows you to implement a custom source for images/elements that your customers can use to personalize your products, such as a public service for images, an online database or images from private accounts on your or another website, or even a wallet from where customers can upload their NFTs.
Examples
-
You sell merchandising items that your customers can personalize with images that are stored in their accounts on a website or other service. So, you don't want them to manually download those images from the accounts and then upload them in Zakeke, you want them to be able to directly upload those images from inside the customizer.
-
You want your customers to be able to retrieve NFTs to customize an item from a connected wallet directly in Zakeke.
- You want your customers to add a dynamic QR code to your items when personalizing them.
Summary:
How to activate it
In order to activate this feature you need to contact us at support@zakeke.zendesk.com and specify your requirements to receive a quote for it.
How it works
Your customers have buttons in the Zakeke UI from which they can access the external database of images. Technically, those buttons open an iframe which includes the page from where customers can source the images.
You can have (one or all of them):
A) Dedicated button in the main toolbox;
B) Dedicated button in the vertical toolbox (and in the bottom menu in the mobile version);
C) dedicated button in the dropdown menu under the “Upload image” tool.
When customers click one of those buttons, Zakeke shows a dialog in fullscreen (iframe) that contains a web page where customers access the external database of the images. The web page that gets loaded in the iframe should be provided by you while Zakeke provides the iframe.
Technical requirements
Zakeke is responsible to provide:
- Buttons in the Zakeke UI
- The iframe where your custom page gets loaded
You're responsible to provide:
- Icons and labels for the buttons
- The web page that gets loaded in the iframe to allow your customers to choose the image(s) to add to the customizable product.
The page you build should send to the iframe an event when a customer picks an image with the following code:
window.parent.postMessage({
message_type: 'IMAGE_SELECTED',
url: <<image URL>>,
mime: <<the MIME type of the image>>
}, '*');
If you want your customer not to be able to resize the image, you can include the following parameters in the message:
physical_width
physical_height
The value should be in centimeters.
For large images also include this property:
imageFileSize: <<size of the image in bytes>>