Copy page

The Basics

View JSON Data

The JSON data returned to every page and block can be viewed and accessed via a URL or template formatter.

Website & Collection Data

To access the data behind any collection in a structured format, append this query string to any URL on your site: ?format=json-pretty In addition to returning collection data, other data needed to construct a full page (such as website data) will also be returned.

Note: Using ?format=json-pretty is not static and should not be used as an alternative to our APIs.

Pretty JSON Example:

Here is an example URL you can paste into your browser address bar to view the JSON data:

http://base-template.squarespace.com/blog/?format=json-pretty

Code
{
    ...

    "collection": {
        "id": "5048fde7c4aa917cbd4d8e13",
        "websiteId": "50295e80e4b096e761d7e4d3",
        "enabled": true,
        "starred": false,
        "type": 1,
        "ordering": 2,
        "title": "Blog",
        "navigationTitle": "Blog",
        "urlId": "blog",
        "itemCount": 2,
        "updatedOn": 1454432700858,
        "pageSize": 20,
        "folder": false,
        "dropdown": false,
        "tags": [
            "tag1",
            "pizza",
            "coffee",
            "snacks",
            "tag2"
        ],
        "categories": [
            "category1",
            "category2"
        ],
        "homepage": false,
        "typeName": "blog",
        "synchronizing": false,
        "fullUrl": "/blog/",
        "passwordProtected": false,
        "typeLabel": "blog"
    },

    ...
}

Block & Navigation Data

Within a template file directly, you can use the JSON formatter to output JSON for any item you have in scope, just add this within the block file: {item|json-pretty} – this is very useful during development as you can review the JSON data available in the source of the page as rendered.

Example from a navigation.block file:

Code
<!-- {@|json-pretty} -->

You can also log the object in your browser's console if you find that preferable to viewing the source:

Code
<script>console.log({@|json-pretty})</script>

This is especially useful for debugging.