Below are links to documents that explain how advanced integration works.
If you have any questions, please ask them on support forum.
Below are several examples of advanced integration, all hosted on external website.
First one is a basic example, followed by more complex examples. Download its code to see how integration is implemented. Each example uses its own advanced integration subscription.
Read documentation above (How does it work, Callback function) to understand how these examples work.
This is a basic tutorial showing integration that uses 1 style without any security checks. Download source code to see how it is done.
Same as #1, but with security check in callback script.
On your website on style download page you will add an iframe that links to a custom colorizeit page like colorizeit.com/custom/example.html?style=1
When iframe loads, ColorizeIt will send a request to your server (callback URL can be configured in subscription settings), asking for information about requested style. It will POST all parameters you sent to iframe, so you can tell which style is being requested or verify user's permissions.
This is a direct request from server to server, without visitor's browser, so all information sent is safe. Visitor will never know real location of zip file or sample image.
Your server will reply with a style name, location of sample image, location of zip file and some other parameters (see XML reply tutorial).
ColorizeIt parses your website's reply, download sample image from your website and shows color editor to visitor.
When user clicks "download" button inside iframe, scrip will send request to colorizeit to download file.
ColorizeIt will download zip file that contains style from your server, change colors in files in zip file, send parsed zip file to visitor.
Advantages of advanced integration:
What do you need to do:
That is all. While integration description is long and complex, implementation is very simple.
Examples and sample code: see "examples" section on the right below "documentation" section.
If description above was not clear enough, scheme below should help you.
|Your Website||Visitor (browser)||ColorizeIt.com|
Your website shows a page where visitor can download a style with a link to change color scheme.
Visitor clicks link to change color scheme, browser opens iframe pointing to colorizeit.com:
Parameter "style=1" is optional and you can use anything instead of it.
ColorizeIt.com connects to your website to retrieve style details: sample image URL, zip file location, default color scheme and style name.
URL it connects to is set in subscription settings:
ColorizeIt POSTs all parameters that you used to open iframe, so you can use it to identify style.
Your website replies with XML document that contains link to editor sample image, link to zip file, style name, editor defaults.
ColorizeIt retrieves sample image and shows color editor to user.
User changes color scheme, clicks "Download" link.
ColorizeIt downloads zip file that contains style from your website, parses it to change colors as user requested, sends parsed zip file to user.
User downloads zip file, unpacks it, installs style on his website. User is happy because style matches his website's color scheme!