---
title: "Old Query-string API"
canonical: https://customerscanvas.com/docs/cc4/qs-api.htm
archived: true
applies_to:
  - product: "Customer's Canvas On-Premises"
  - product: "Design Editor"
    versions: ["4.4.25", "4.x (may differ)"]
---

**You’re viewing outdated documentation.** [View the latest Customer’s Canvas On-Premises documentation](https://customerscanvas.com/docs/on-premises/).

# Old Query-string API

**Applies to:** Customer's Canvas On-Premises; Design Editor 4.4.25, 4.x (may differ) · **Archived documentation**
 
Customer's Canvas offers two APIs: the old API, which is based on query string, and the new JavaScript one - IFrame API. All Customer's Canvas 3.x and 4.x releases will fully support both of the APIs. In the next major release, we will stop adding new features to the query-string API and eventually make it discontinued.
 
In the query-string API products and the editor are configured through the query-string arguments. This API is easy to use and does not require JavaScript coding skills, but it has two major shortcomings. It does not allow for changing product configuration at runtime without reloading the designer. And it restricts product configuration due to limited query string length in browsers. The IFrame API is described in the [Introduction to IFrame API](https://customerscanvas.com/docs/cc4/IframeApi-introduction.htm.md) topic.
 
Query string arguments have higher priority than parameters of `~\Configuration\clientConfig.json`.
 
**Note** 
The default measurement unit in Customer's Canvas is points.
 
Do not forget to encode unsafe ASCII characters in argument values, for example, to set a color in `#aabbcc` format you should pass `%23aabbcc`.
 
|  Name |  Description |  Sample value |  Possible values |
| --- | --- | --- | --- |
   |  [simpleModeEnabled](https://customerscanvas.com/docs/cc4/simple-and-advanced-designer-modes.htm.md) |  sets simple as initial mode of the web-to-print designer; this argument is deprecated, use **initialMode** instead. |  `simpleModeEnabled=true` |  boolean |
 |  [initialMode](https://customerscanvas.com/docs/cc4/simple-and-advanced-designer-modes.htm.md) |  initial mode of the web-to-print designer, simple or advanced. If you want to disable advanced mode set this parameter to `"SimpleOnly"`. |  `"Simple"` |  `"Simple"`, `"Advanced"`, `"SimpleOnly"` |
 |  [rulers](https://customerscanvas.com/docs/cc4/configuring-rulers-and-grids.htm.md) |  defines rulers |  `rulers={u:"inch",o:{"X":0,"Y":0},e:true}` |  JSON object |
 |  [grid](https://customerscanvas.com/docs/cc4/configuring-rulers-and-grids.htm.md) |  defines grid |  `grid={hc:"rgb(208, 224, 227)",vc:"rgb(208, 224, 227)",sx:10,sy:10,gwh:1,e:true}` |  JSON object |
 |  customStyle |  name of a CSS file (without extension) that will be loaded within the designer page; the file should be located in the `~\Configuration\customCss\` folder |  `customStyle=myStyle` |  string |
 |  ffPopupCompatibilityEnabled |  FifreFox-only argument, that allows using the `display: none` style for the IFRAME element where the web-to-print editor is placed or for the IFRAME's parents, also it allows to display the editor in the modal window. |  `ffPopupCompatibilityEnabled=true` |  boolean |
 |  [state](https://customerscanvas.com/docs/cc4/handling-product-customization.htm.md) |  name of a file (without extension) containing a serialized product which could be restored in the editor |  `state=586e2e16-8c74-4350-b792-07803bdcfe5c` |  string |
 |  lang |  interface language |  `lang=en` |  string |
 |  [Product](https://customerscanvas.com/docs/cc4/understanding-print-products.htm.md) |
 |  design |  name of the PSD template file that should be loaded, without extension |  `design=businesscard` |  string |
 |  designFolder |  for multipage products name of the folder containing product page designs that should be loaded |  `designFolder=magazine` |  string |
 |  design\_page2 |  for double-sided products, name of the PSD template file for the back side, without extension |  `design_page2=businesscard_side2` |  string |
 |  mockup |  name of the mockup file that should be loaded, without extension |  `mockup=envelope` |  string |
 |  mockupFolder |  for multipage products names of the folder containing mockup files that should be loaded |  `mockupFolder=pages` |  string |
 |  mockup\_page2 |  for double-sided products, name of the mockup file for the back side, without extension |  `mockup_page2=envelope_side2` |  string |
 |  previewMockup |  name of the mockup file that should be loaded, without extension |  `previewMockup=envelope` |  string |
 |  previewMockupFolder |  for multipage products names of the folder containing mockup files that should be loaded |  `previewMockupFolder=pages` |  string |
 |  previewMockup\_page2 |  for double-sided products, name of the mockup file for the back side, without extension |  `previewMockup_page2=envelope_side2` |  string |
 |  designLocation |  coordinates of the upper left of the design relative to the mockup |  `designLocation={X:83,Y:120}` |  string |
 |  foregroundMockupEnabled |  if `true`, the mockup will be displayed above the design; otherwise, it will be displayed in the background |  `foregroundMockupEnabled=false` |  boolean |
 |  [safetyLines](https://customerscanvas.com/docs/cc4/safety-lines.htm.md) |  defines product safety lines |  `safetyLines=[{n:"theLine",m:8.5,c:"rgba(0,255,0,255)",ac:"rgba(255,255,255,0)",s:5,w:1}]` |  array of JSON objects; each object is a safety perimeter |
 |  [foldingLines](https://customerscanvas.com/docs/cc4/configuring-folding-lines-and-spines.htm.md) |  defines folding lines |  `foldingLines=[{iv:false,b:5,p:{c:"red"}}]` |  array of JSON objects; each object is a folding line |
 |  [spines](https://customerscanvas.com/docs/cc4/configuring-folding-lines-and-spines.htm.md) |  defines spines |  `spines=[{iv:false,w:20,p:{c:"red"},fc:"pink"}]` |  array of JSON objects; each object is a spine |
 |  [surfaces](https://customerscanvas.com/docs/cc4/multipage-products.htm.md) |  defines pages of multipage product |  `surfaces=[{d:"page1"},{d:"page2"},{d:"page3",sl:[{m:10,c:"blue"}]}]&safetyLines=[{m:15,c:"green"},{m:7.5,c:"red"}]` |  array of JSON objects; each object is a page |
 |  Canvas |
 |  contentShadow |  displays product shadow |  `contentShadow=true` |  boolean |
 |  canvasOutsideBackColor |  color of the HTML element placed under the canvas |  `canvasOutsideBackColor="000099"` |  color in css-compatible format |
 |  canvasColor |  canvas color; this color is visible if a transparent object is placed on the canvas |  `canvasColor="009900"` |  color in css-compatible format |
 |  [Rendering](https://customerscanvas.com/docs/cc4/configuring-high-resolution-and-proof-images.htm.md) |
 |  printColorSpace |  color space of hi-res output |  `printColorSpace="RGB"` |  `"RGB"`, `"CMYK"`, `"Grayscale"` |
 |  renderExt |  file extension of hi-res output |  `renderExt="PDF"` |  `"PDF"`, `"JPEG"`, `"PNG"`, `"TIFF"` |
 |  printArea |  the parameter will be applied only if there is no **design** is set; the parameter specifies the area that will be rendered in the hi-res output |  `printArea={X:0,Y:10,Width:200,Height:350}` |  string |
 |  visiblePrintAreaEnabled |  if `true`, the print area is highlighted in the designer |  `visiblePrintAreaEnabled=true` |  boolean |
 |  RenderingDpi |  hi-res output resolution in dots per inch (DPI) |  `RenderingDpi=100` |  integer |
 |  [Users](https://customerscanvas.com/docs/cc4/working-with-user-data.htm.md) |
 |  userId |  user identifier |  `userId=default` |  string |
 |  userInfo |  data to populate the template with after clicking the **Load my info** button; if there is no data passed, the button is hidden |  `userInfo={"FirstName":"John","LastName":"Snow","Phone":"0123456789"}` |  JSON object |
 |  [Widgets](https://customerscanvas.com/docs/cc4/customizing-user-interface.htm.md) |
 |  finishButton |  mode of the **Finish design** button; `"disabled"` hides the button and enables the callback that could be handled like it is discussed in the [Introducing the IFrame API](https://customerscanvas.com/docs/cc4/handling-product-customization.htm.md) topic; `"download"` is a debug mode that shows the button and disables the callback, but allows downloading hi-res output |  `finishButton="download"` |  `"download"`, `"disabled"` |
 |  backgroundButtonEnabled |  displays background element in **object inspector** |  `backgroundButtonEnabled=true` |  boolean |
 |  rectEllipseButtonsEnabled |  displays the **Ellipse** and **Rectangle** buttons in the advanced editing mode |  `rectEllipseButtonsEnabled=true` |  boolean |
 |  richTextEnabled |  displays the adding **Rich text** option in the advanced editing mode |  `richTextEnabled=true` |  boolean |
 |  galleryOnly |  displays only the image **Gallery** containing the private tab; the web-to-print editor is not displayed in this mode |  `galleryOnly=true` |  boolean |
 |  isAllowDnD |  enables elements drag-and-drop in **object inspector** |  `isAllowDnD=true` |  boolean |
 |  [colorPickerPalette](https://customerscanvas.com/docs/cc4/colors.htm.md) |  palette to show in color picker |  `colorPickerPalette=[["rgb(0, 0, 0)","rgb(255, 255, 255)"]]` |  two-dimensional array: array of palettes, where each pallete is an array of strings representing colors |
 |  [isShowColorPickerPaletteOnly](https://customerscanvas.com/docs/cc4/colors.htm.md) |  shows only the palette specified via the **colorPickerPalette** argument in the color picker |  `isShowColorPickerPaletteOnly=true` |  boolean |
 |  publicTabEnabled |  displays the **Public files** tab in the **Gallery** |  `publicTabEnabled=false` |  boolean |
 
## See Also
  
### Manual
 
- [Configuring Products](https://customerscanvas.com/docs/cc4/configuring-products.htm.md)
- [Integration with E-commerce](https://customerscanvas.com/docs/cc4/user-is-done-with-customizations-whats-next.htm.md)
- [Integration with Facebook and Instagram](https://customerscanvas.com/docs/cc4/integration-with-facebook-and-instagram.htm.md)
- [Using the Image Gallery](https://customerscanvas.com/docs/cc4/using-image-gallery.htm.md)
- [Working with User Data](https://customerscanvas.com/docs/cc4/working-with-user-data.htm.md)