Links

Integrate apps into the theme


You can install apps to add features and integrations to your theme. You can find apps on the Shopify App Store.
Apps can integrate with your theme in the following ways:
  • As an app block: App blocks let you add app functionality exactly where you want to use it in your theme. You can add, remove, preview, reposition, and customize app blocks through the theme editor.
  • As an app embed: App embeds are app-provided elements that float or appear as an overlay in your theme, or add code to your online store without being visible to your customers. You can activate, deactivate, preview, and customize app embeds through the theme editor.
  • By adding custom code: Some apps inject code directly into your theme's code to add functionality to your theme. You might customize the app using the app settings, or using the theme editor.

1. App blocks

Apps can be added both as blocks in a section, and as sections in a template. This lets you add app functionality exactly where you want to use it on a page. App blocks can be added, removed, repositioned, and customized through the theme editor.App blocks might only be compatible with certain page types. For example, a size chart app might only be compatible with product pages.

Add an app block to a section:

  • From your Shopify admin, go to Online Store > Themes.
  • Find the theme that you want to edit, and then click Customize.
  • Navigate to the page and section where you want to add the app block.
  • On the sidebar, click Add block.
  • From the drop-down menu, in the APP BLOCKS, select the app block that you want to add to the section or click the Search bar and enter a search term to search through your installed apps.
  • Click and drag the ⋮⋮ icon to move the block to another available location on the page. You can also customize the block using any available settings.
  • Click Save.

Add an app section to a page:

  • From your Shopify admin, go to Online Store > Themes.
  • Find the theme that you want to edit, and then click Customize.
  • Navigate to the page where you want to add the app section.
  • On the sidebar, click Add section.
  • From the drop-down menu, in the Apps section, select the app that you want to add to the page or click the Search bar and enter some text to search through your installed apps.
  • Click and drag the ⋮⋮ icon to move the block to another available location on the page. You can also customize the block using any available settings.
  • Click Save.
Note: Before customizing with the app block/section, you need to activate App embeds.

2. App embeds

App embeds are app-provided elements that float or appear as an overlay in your theme, or add code to your online store without being visible to your customers. For example, a chat bubble app that appears in the corner of your store, or an analytics or tracking app might be added to your store as an app embed. App embeds can be activated, deactivated, and customized through the theme editor. App embeds can be used with any theme version.

Activate an app embed

  • From your Shopify admin, go to Online Store > Themes.
  • Find the theme that you want to edit, and then click Customize.
  • On the sidebar, click the App embeds icon.
  • Select the app embed that you want to activate or click the Search bar and enter a search term to search through your installed apps.
  • Beside the app embed that you want to activate, click the toggle to activate it.
  • Preview your store to view the embedded app live.
Note: Only when App embeds are activated, you can customize the theme editor with apps, such as adding an app block/section.

3. Apps added to theme code

Some apps inject code directly into your theme's code to add functionality to your theme. After you install the app, you might receive onboarding instructions that include editing your own code to add app functionality where you want it to appear in your theme. You might customize the app using the app settings, or using the theme editor.
If your theme offers a Custom Liquid section, then you might be able to add your app code into a Custom Liquid section in the theme editor instead of editing your theme code directly.
Last modified 1mo ago