Breaking Change - Disable Store and Settings Resource Bootstrap

Deployed Date: -/-/24

The bootstrapped square.store and square.settings global values will be removed in favor of requesting the resource through the store-info schema or the store_info() resource function.

Impact

square.store

The disabling of store bootstrap means that fields under square.store.*, previously bootstrapped into page parameters, are no longer available by default. The following are some of the store-related data previously accessible under square.store:

Field	Type	Description
accepting_orders	Boolean	Indicates if the store is accepting orders
currency	String	Default site currency
fulfillment_support	FulfillmentSupport	Supported fulfillment methods
merchant_id	String	The Square merchant ID
payment_methods	PaymentMethods	Settings for specific payment methods
locale	String	Default store locale

For a full reference, please refer to the Bootstrapped Resources Reference

square.settings

The disabling of settings bootstrap means that fields under square.settings.*, previously bootstrapped into page parameters, are no longer available by default. The following are settings-related data previously accessible under square.settings:

Field	Type	Description
application_id	String	Application ID
square_web_payments_sdk	String	Location of the JS SDK

You can access application_id through the store-info resource and square_web_payments_sdk via square.site.square_web_payments_sdk.

Migration Path

To access store or settings data after bootstrapping is disabled:

1. Use the store-info resource to fetch store data. Refer to StoreInfo Resource for more information.
2. Alternatively, call the store_info() Twig function to fetch store data. Refer to store_info() Twig Function for more information.

Example: Fetching Store Data with store-info Schema Reference

If you want to use the store-info schema to retrieve store data directly, you you can access this data in your Twig template file.

<div class="store-info">
    <h2>Store Information</h2>
    <ul>
        <li>Merchant ID: {{ storeInfo.merchant_id }}</li>
        <li>Currency: {{ storeInfo.currency }}</li>
        <li>Locale: {{ storeInfo.locale }}</li>
        <li>Item Reviews Enabled: {{ storeInfo.item_reviews_enabled }}</li>
        <li>Accepting Orders: {{ storeInfo.accepting_orders }}</li>
        <li>Low Stock Threshold: {{ storeInfo.item_low_stock_threshold }}</li>
    </ul>
</div>

{% schema %}
{
    "storeInfo": {
        "type": "store-info"
    }
}
{% endschema %}

Example: Fetching Store Data with store_info() Resource Function

Instead of accessing square.store.* properties directly, you can now fetch the needed store data using the store_info() resource function:

<!-- Before: Direct access through square.store -->
<h1>Store Information</h1>
<p>Store Currency: {{ square.store.currency }}</p>
<p>Store Locale: {{ square.store.locale }}</p>
<p>Is Accepting Orders: {{ square.store.accepting_orders }}</p>

<!-- Now: Fetching store data using store_info() -->
{% set store_info = store_info() %}

<h1>Store Information</h1>
<p>Store Currency: {{ store_info.currency }}</p>
<p>Store Locale: {{ store_info.locale }}</p>
<p>Is Accepting Orders: {{ store_info.accepting_orders }}</p>