Query Strings

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.



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:


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:


disablecdnRoutes 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.
unminifiedDisables CSS minification for easier troubleshooting of generated CSS files.
showerrorsDisplays theme parsing errors.
noneReverts 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:


maxSpecifies a pixel limitation for the largest side of an image.
maxWidthSpecifies a pixel limitation for the width of the image, preserving the aspect ratio if the image needs resizing.
maxHeightSpecifies a pixel limitation for the height of the image, preserving the aspect ratio if the image needs resizing.
widthSpecifies an exact width dimension for the image, in pixels.
sizeSame as width. Provides backwards-compatibility for an earlier syntax.
heightSpecifies an exact height dimension for the image, in pixels.

Usage: crop=x1,y1,x2,y2 in URLs and crop="x1,y1,x2,y2" in the make_url tag.

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, crop=10,10,-10,-10 removes 10 pixels from all edges of the image (crop=0,0,0,0 leaves the image uncropped).

You can also use this field to specify a subset of the image. For example, crop=150,-300,-150,300 crops the following image as shown. Using positive or negative coordinates is up to you. For example, you can crop the same subset of the example image using coordinates that are all positive, all negative, or a different combination from the one shown in the example, such as crop=+,+,-,-


The only thing to remember is that you must always specify x2 to the right of x1 and y2 to the bottom of y1, otherwise no cropping takes effect.

qualityAdjusts 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.