Shopify Sections & App Island

Transform your Shopify store with Sections. With this new feature, you can publish sections directly to any Shopify Online Store 2.0 theme. 

When you click “Publish” in Instant, the section will be converted to native Shopify Liquid code, including the “schema” that’s needed to integrate with the Shopify theme editor. 

These sections work with all Shopify markets features (such as translations), Shopify metafields, and thanks to the all-new “App island” element, our Sections integrate with any Shopify app block you can imagine.

Check out our documentation for a full breakdown of the feature.

Introducing: App Island

Integrate with any Shopify app block imaginable thanks to the new "App Island" element. The “App Island” element enables you to connect any Shopify app block to the Sections you build with Instant. With this element, you define where the “App blocks” will be inserted when added to the Shopify theme editor. 

Fixes and improvements

Fixed

• An issue in the assets panel where the dropzone was not always full height when dragging files into the panel to upload

• A dropzone height issue in the asset panel that occurred when dragging files to upload

• An issue in the builder where the “Self align” property wasn’t inherited correctly if the parent element has responsive edits

• An issue where the “Fill” value didn’t show for some of the preset elements

• An issue where background images in the builder did not re-render when the “Fill” property was changed

• An issue where the order of the items in the assets panel changed when an asset was deleted

• An issue that prevented certain .woff2 fonts from being uploaded

• A Firefox-specific issue that sometimes prevented users from editing the content text elements directly on the canvas

• A Safari-specific issue prevented the asset upload modal from being opened from the design panel

Improved

• The in-canvas resize controls now have a minimum drag distance, preventing the height or width from being set accidentally when clicking a resize handle

• Only show the “Pages left to publish” warning when almost hitting the plan limit

• Show “Duplicate page handle” responses from Shopify when publishing pages with an already existing handle

• Added a new “Reverse order” toggle next to the “Direction” in the design panel. A use case for this is to reverse the order of certain elements on mobile

• Align item items in the center of the page by default, making it easier to create fixed-width containers with less nesting

• Hide overflowing elements in preview mode, making it more similar to the final production output when published

• We added support for uploading .webp images in the assets panel

• Show a “Locked” state when someone else is currently working in the builder of the same site → This will be replaced with Live collaboration features

• More explicit error message when dragging more than 10 files into the dropzone of the assets panel