Upsell & Cross-Sell: setting up in OS 2.0

Shopify themes have two architecture types: Online Store 2.0 and vintage themes. Your theme architecture version determines the file types that make up your theme, how you can customize your theme, and how apps can integrate with your theme. Learn more about theme architecture versions.

A new theme architecture called Online Store 2.0 allows you to add app functionality anywhere in your theme by using app blocks and app embeds. You can add, remove, preview, reposition, and customize app blocks through the theme editor.

Therefore, the Searchanise Upsell & Marketing team has built the application to integrate seamlessly with Online Store 2.0 through app blocks and app embeds. You can add app sections and blocks to your store pages and configure their appearance in the Searchanise Upsell & Marketing admin settings.

Creating a widget

Before adding an app block to your Shopify theme, you should create the widget in the Searchanise Upsell & Marketing admin. Follow these steps:

1. From your Shopify admin, go to the app admin.
2. Open the Upsell & Cross-Sell app.
3. Click Create recommendations and select the Widget type.
4. On the Create a new Recommendation Widget page, customize the app settings.
5. Set the widget status as visible.
6. Save changes.
7. From the General tab, click Activate app.

Activating app embed

After you hit Activate app in the app admin, it redirects you to the theme editor’s App embeds tab. You will need to activate it directly from the theme editor:

1. From your Shopify admin, go to Online Store > Themes.
2. Find the theme that you want to edit, and then click Customize.
3. Click the App embeds tab.
4. Beside the Upsell & Cross-Sell app embed, click the toggle to activate it.
5. Save the changes.

Setting up the app block

Steps:

1. From the app admin, open the Upsell & Cross-Sell app.
2. Copy the key that appears in the Unique Key column of the list. You will need it later.
3. Go to Online Store > Themes and open the theme editor.
4. Navigate to the page where you want to add the app section.
5. Click Add section.
6. From the drop-down menu, in the Apps section, select the widget that you want to add to the page.
7. In the block settings, paste the Unique Key into the key field, which you’ve copied previously in the app admin.
8. Click Save at the upper right.

The app block is added to the store page and loads within 20 seconds.

Removing blocks and sections

For each item, you can delete a section or block from a template by going to the settings screen. The Remove section or Remove block button appears at the bottom of the section settings.

Steps:

1. In the theme editor sidebar, click the section or block that you want to remove.
2. Click Remove section or Remove block.
3. Click Save.

Hiding blocks and sections

You can hide any section or block using the eye icon.