[{"value":"Integration methods","id":"integration-methods","hLevel":2,"level":1,"children":[{"value":"Integration compatibility and recommendations","id":"integration-compatibility-and-recommendations","hLevel":3,"level":2},{"value":"Theme app extensions","id":"theme-app-extensions","hLevel":3,"level":2},{"value":"Script Tag APIs","id":"script-tag-apis","hLevel":3,"level":2},{"value":"Asset APIs","id":"asset-apis","hLevel":3,"level":2}]},{"value":"Things to consider","id":"things-to-consider","hLevel":2,"level":1},{"value":"See more","id":"see-more","hLevel":2,"level":1}]

Overview

This article introduces various methods for integrating different types of apps with SHOPLINE themes, as well as recommendations for when to use each method.

Integration methods

You can use the following methods to integrate your apps with themes.

Theme app extensions
Script Tag APIs
Asset APIs

Integration compatibility and recommendations

Before you begin to integrate, refer to the following table to check whether the integration method you intend to use is supported by your app type or recommended for different theme versions of the SHOPLINE online store.

Online store version	App type	Theme app extension: app block	Theme app extension: app embed block	Script Tag APIs	Asset APIs
Online Store 2.1	Public app	Recommended	Recommended	Not Recommended	Not Recommended
	Custom app	Not Supported	Not Supported	Not Recommended	Not Recommended
	Private app	Not Supported	Not Supported	Not Recommended	Not Recommended
Online Store 2.0	Public app	Recommended	Recommended	Not Recommended	Not Recommended
	Custom app	Not Supported	Not Supported	Not Recommended	Not Recommended
	Private app	Not Supported	Not Supported	Not Recommended	Not Recommended
Online Store 1.0	Public app	Partially supported (see note)	Recommended	Not Recommended	Not Recommended
	Custom app	Not Supported	Not Supported	Recommended	Recommended
	Private app	Not Supported	Not Supported	Recommended	Recommended

Table 1. Integration methods for different app types and online store versions

note

For Online Store 1.0 themes, you can only add app blocks to the homepage. Other pages do not support app blocks.

Theme app extensions

To ensure seamless integration with SHOPLINE themes, we recommend using theme app extensions to integrate your public apps. This method includes App blocks and App embed blocks, which are designed for compatibility with online store themes version 2.0 and newer. By using theme app extensions to incorporate your app into SHOPLINE themes, you can avoid altering theme codes directly and gain several benefits:

Continually enjoy official theme updates because you do not modify the theme codes.
Support one-time development for multiple themes within a single online store version.
Increase app adoption by enabling merchants to conveniently edit and personalize app blocks in the theme editor.

For more information about how to use theme app extensions, refer to the following:

Script Tag APIs

If your apps inject inline content into theme pages and integrate with Online Store 1.0 themes, use Script Tag APIs. However, for newer apps in the SHOPLINE App Store, we recommend using theme app extensions to integrate your apps with Online Store 2.0 or higher themes. Script Tag APIs enable you to add JavaScript codes of your app to an online store theme. If you remove your app from the SHOPLINE App Store, any associated JavaScript is automatically deleted. For more information about how to use the Script Tag APIs, refer to Script Tag APIs.

note

Note: Handlebars are not available for this integration method.

Asset APIs

If your app must edit codes of Online Store 1.0 themes, you can use theme asset APIs to merge your app ability into the target theme. Asset APIs refer to the API resources related to online store themes. You can query, add, update, or delete resources by using asset APIs. Using this integration method leads to a custom theme, which will not be upgraded along with the official version. Therefore, it is highly recommended that:

you provide the updated codes and detailed specifications about how these theme assets are updated.
pay attention to whether the themes you used for integrating your apps have new versions. Refer to Online Store 2.1 theme to get information about theme versions. When the theme you used updates, ensure that your apps are compatible with the new version.

For more information about how to use asset APIs, see Asset APIs.

note

Handlebars are not available for this integration method.

Things to consider

When you integrate your apps with online store themes, ensure that your apps are compatible with and run in the theme editor. Refer to Detecting the theme editor to confirm whether your app's codes can execute in the theme editor environment.

See more

Sections and blocks: Learn about the design principle of sections and blocks in a theme.
Optimize your JavaScript: Learn about the principle of optimizing JavaScript.
Support multiple currencies and languages: Learn how to support languages and currencies of different countries or regions.