App Widget Contents

Schema

Schema defined the app widget settings displayed to merchant in SHOP builder. It also defines the settings format rendered in merchant's storefront.

Schema content

Schema is a JSON object with specific fields defining the behavior and appearance of app widget.

(See the full list of fields definitions here)

Supported Setting Types

Current supported setting types for app widget:

Setting Type
color_picker
image_picker
collection_picker
product_picker
products_picker
video_url
time_range
checkbox
range
select
text
richtext
tabs
vertical_align
text_align
proportion
radio
header
url
paragraph
switch
group_header
group_end
heading

Changing Setting Types

Changing setting types for specific ID in an app widget is NOT allowed.

The following rules apply:

1. For every setting in the same app widget, once a setting ID is used, the corresponding setting type could not be changed.
2. For blocks settings, the comparison will be done within every block that has the same block type. Every block is compared separately.
3. It doesn’t matter if the setting / block is removed in previous version, as long as it has been added before, and the current version uses a different type with the same id, it will not be allowed.
   For example:
   1. Version 1.1 has the setting:
      1. ID: original-id, Type: text
   2. Version 1.2 has removed the setting
   3. Version 1.3 wants to add back the setting with different type
      1. ID: original-id, Type: color_picker
         Error will be thrown when attempting to save version 1.3.

A setting ID & type pair is considered used once the version has been deployed.

HTML, CSS / SCSS, JS

These assets, if defined, will be rendered to merchant's storefront.

HTML

CSS / SCSS

JS