Use query strings in storefront URLs to enable debugging, manipulate images, troubleshoot theme files, etc., as listed in this topic. To set a query string, place a ? character at the end of a storefront URL, followed by the query string name, an = sign, and the value you want to set the query string to. When applying multiple query strings, separate the query strings with & characters.
Syntax:
yourSite.com/somePage?queryString1=0&queryString2="value"&queryString3=100
Storefront Debugging
Use the debugMode query string for general debugging purposes on your storefront. To enable debug mode, set the query string to true.
URL Parameter Example:
yourSite.com/somePage?debugMode=true
While useful during development, ensure debug mode is off on production sandboxes.
Theme Debugging
Use the mz_debugflags query string for theme debugging purposes. This query string provides debug options that allow you to readily view the files Kibo is generating for your theme. You can apply the debug options one at a time or in multiples, separated by commas.
URL Parameter Example:
yourSite.com/somPage?mz_debugflags=disablecdn,unminified,showerrors
| Field | Description |
|---|---|
disablecdn | Routes image, CSS, and JavaScript files through the primary host instead of the CDN. This option is useful for determining whether CDN caching is responsible for failing to display updates or causing other unexpected behavior. |
unminified | Disables CSS minification for easier troubleshooting of generated CSS files. |
showerrors | Displays theme parsing errors. |
none | Reverts all options to default, non-debugging behavior. While useful during development, make sure to disable all the debugging flags on production sandboxes to prevent performance issues. |
CDN Image Manipulation
To process an image hosted on the CDN, append these query strings to the image path after a ? character and separated by & characters. To avoid incorrect image rendering, do not apply the image manipulation fields to images that contain a dimension greater than 30,000 pixels in length.
URL Parameter Example:
http://cdn.mozu.com/22440-m1/cms/files/filename?max=500&quality=75&crop=10,10,-10,-10
| Field | Description |
|---|---|
max | Specifies a pixel limitation for the largest side of an image. |
maxWidth | Specifies a pixel limitation for the width of the image, preserving the aspect ratio if the image needs resizing. |
maxHeight | Specifies a pixel limitation for the height of the image, preserving the aspect ratio if the image needs resizing. |
width | Specifies an exact width dimension for the image, in pixels. |
size | Same as width. Provides backwards-compatibility for an earlier syntax. |
height | Specifies an exact height dimension for the image, in pixels. |
crop | Usage: Crops the image based on the specified coordinates. The reference point for positive coordinates is the top or left side of the image, and the reference point for negative coordinates is the bottom or right side of the image. You can use this field to easily crop an equal amount of pixels from every edge of the image. For example, You can also use this field to specify a subset of the image. For example, The only thing to remember is that you must always specify |
quality | Adjusts the image compression for JPEG files (other image types do not support this field). Accepts values from 0-100, where 100 = highest quality, least compression. |