Extend your theme with apps

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.

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.

An app block being used in a section:

An app block being used in a section.

An app block being used as a section in a template:

An app block being used as a section in a template.

App block support in sections

Some of your theme sections might not support app blocks. To identify which of your theme sections support app blocks, refer to your theme's documentation or contact your theme developer.

If a section supports app blocks and you have a compatible app installed, then an Apps section appears in the block picker.

Add an app block to a section

Desktop
  1. From your Shopify admin, go to Online Store > Themes.
  2. Find the theme that you want to edit, and then click Customize.
  3. Navigate to the page and section where you want to add the app block.
  4. On the sidebar, click Add block.
  5. From the drop-down menu, in the Apps section, 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.
  6. Optional: 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.
  7. Click Save.
iPhone
  1. From the Shopify app, tap the button.
  2. In the Sales channels section, tap Online Store.
  3. Tap Manage all themes.
  4. Find the theme that you want to edit, and then tap Customize.
  5. Tap Edit.
  6. Navigate to the page and section where you want to add the app block.
  7. On the sidebar, click Add block.
  8. From the drop-down menu, in the Apps section, 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.
  9. Optional: 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.
  10. Click Save.
Android
  1. From the Shopify app, tap the button.
  2. In the Sales channels section, tap Online Store.
  3. Tap Manage all themes.
  4. Find the theme that you want to edit, and then tap Customize.
  5. Tap Edit.
  6. Navigate to the page and section where you want to add the app block.
  7. On the sidebar, click Add block.
  8. From the drop-down menu, in the Apps section, 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.
  9. Optional: 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.
  10. Click Save.

Add an app block to a template

Desktop
  1. From your Shopify admin, go to Online Store > Themes.
  2. Find the theme that you want to edit, and then click Customize.
  3. Navigate to the page where you want to add the app section.
  4. On the sidebar, click Add section.
  5. 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.
  6. Optional: 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.
  7. Click Save.
iPhone
  1. From the Shopify app, tap the button.
  2. In the Sales channels section, tap Online Store.
  3. Tap Manage all themes.
  4. Find the theme that you want to edit, and then tap Customize.
  5. Tap Edit.
  6. Navigate to the page where you want to add the app section.
  7. On the sidebar, click Add section.
  8. 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.
  9. Optional: 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.
  10. Click Save.
Android
  1. From the Shopify app, tap the button.
  2. In the Sales channels section, tap Online Store.
  3. Tap Manage all themes.
  4. Find the theme that you want to edit, and then tap Customize.
  5. Tap Edit.
  6. Navigate to the page where you want to add the app section.
  7. On the sidebar, click Add section.
  8. 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.
  9. Optional: 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.
  10. Click Save.

The app is added as a block in an Apps section. You can add additional app blocks to the section. You can also add multiple Apps sections to a page.

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.

An app embed block.

Activate an app embed

Desktop
  1. From your Shopify admin, go to Online Store > Themes.
  2. Find the theme that you want to edit, and then click Customize.
  3. On the sidebar, click the App embeds icon.
  4. 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.
  5. Beside the app embed that you want to activate, click the toggle button to activate it.
  6. Optional: View the settings for the app embed by clicking the expand icon next to the app embed name.
  7. Click Save.
  8. Preview your store to view the embedded app live.
iPhone
  1. From the Shopify app, tap the button.
  2. In the Sales channels section, tap Online Store.
  3. Tap Manage all themes.
  4. Find the theme that you want to edit, and then tap Customize.
  5. Tap > App embeds.
  6. Select the app embed that you want to activate or enter a search term in the search bar to search through your installed apps.
  7. Beside the app embed that you want to activate, tap the toggle button to activate it.
  8. Optional: View the settings for the app embed by clicking the expand icon next to the app embed name.
  9. Tap Save.
  10. Preview your store to view the embedded app live.
Android
  1. From the Shopify app, tap the button.
  2. In the Sales channels section, tap Online Store.
  3. Tap Manage all themes.
  4. Find the theme that you want to edit, and then tap Customize.
  5. Tap > App embeds.
  6. Select the app embed that you want to activate or enter a search term in the search bar to search through your installed apps.
  7. Beside the app embed that you want to activate, tap the toggle button to activate it.
  8. Optional: View the settings for the app embed by clicking the expand icon next to the app embed name.
  9. Tap Save.
  10. Preview your store to view the embedded app live.

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.

Can’t find the answers you’re looking for? We’re here to help.