Overview
The new "Shopify App Block" element makes adding and integrating widgets from third-party apps to your "Full Customization" Product pages a breeze!
Now you can easily integrate any Shopify app that utilizes app blocks onto your product page, even if it’s not one we've built an integration for. No custom coding required.
See the instructions below for the details about how to use this new element to take your product page design and functionality to the next level!
📝 This element only works on "Full Customization" Product pages that use JSON format at this time.
Adding the element
To add the Shopify App Block element to your Zipify Pages product page, first open the desired product page within the Zipify Pages builder.
Next, click on the existing element on the page where you'd like to add it and then on the ➕ button above/below the existing element:
Find and select the "Shopify App Block" element from the Integrations category of page elements:
The element will be added to your page in the location chosen. Next, click on the "Open Shopify Editor" button in the sidebar:
📝You must publish the product page first before you can add and edit the app block in the Theme Editor.
A new tab will open where your Shopify Theme Editor will be displayed and the current product page template. Under the Template section, click "Add block":
Select the third-party app widget you'd like to integrate from the Apps tab:
The app widget will appear where you positioned the Shopify App Block element in the Zipify Pages editor:
Click the "Save" button in the top-right corner of the Theme Editor:
Important Notes
The Shopify App Block element can only be added to "Full Customization" product page templates that use the JSON file type. If you're not sure which file type is being used for your Zipify Pages product page template, navigate to Sales channels > Online Store > Themes > Edit code and check the "Templates" folder to see the type of file. It will either be product.zipifypages-xyz.json or product.zipifypages-xyz.liquid
The third-party app widget will only render on the published page and not within the Zipify Pages builder directly. If an app widget requires their app embed be enabled, check the "App Embeds" section of the Shopify Theme Editor to enable it.
To add additional Shopify App Block elements to your page, click the "Update" button in the Zipify Pages builder each time a new one is added. Then navigate to the Theme Editor via the button in the sidebar to add the additional third-party app widget.
For example: Add the "Shopify App Block" element ➡ Click the "Update" button in the builder ➡ Click the "Open Shopify Editor" button in the sidebar to add the new widget via the Theme Editor.