Skip to main content
All CollectionsOkendo ReviewsDisplay Your Reviews on Your Site
Installing Okendo on Shopify Online Store 2.0
Installing Okendo on Shopify Online Store 2.0

How to install Okendo on Shopify's new theme architecture

Matthew Garven avatar
Written by Matthew Garven
Updated over a year ago

Below are instructions on how to install Okendo for Shopify Online Store 2.0 compatible themes. Please check whether your theme is Online Store 2.0 compatible before continuing with these instructions. If your theme is a vintage theme, please refer to our manual installation instructions.
โ€‹

Step 1: Enable Okendo Reviews / Surveys App Embed Block

For Okendo Widgets to work in your theme, the Okendo Reviews App Embed will need to be enabled in your Shopify Theme Customizer.

What is an App Embed Block?

The App embed block allows Okendo to add code to your store without any manual intervention. Okendo uses this code to load and display your configured on-site widgets.

How to Enable The Okendo App Embed Block

From your Shopify Admin, navigate to the Themes page then click the "Customize" button on the theme you want to install Okendo on.

Click "Theme settings" then "App embeds". Find the "Okendo Reviews " App embed and enable via the toggle switch.

See video below on how to turn on the app embed in Shopify.

Step 2: Install Okendo Widgets

The Shopify preferred way of using Okendo Widgets in your Online Store 2.0 theme is via App Blocks.

What Is 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.

This means that you don't need to write any code in to your theme code to use our widgets on-site.

App blocks also allow updates to our on-site widgets to occur seamlessly, to ensure your customers get the most recent improvements to their on-site experience in a managed and hassle-free way.

Using App Blocks

Once you enable the Okendo App Embed in the Shopify Theme Customizer, you will be able to begin using the Okendo App Blocks on any template on your Online Store 2.0 Theme.

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 Okendo's App Embed toggled on, then an Apps section appears in the block picker.

Add an Okendo app block to a section

  1. From your Shopify admin, go to Online Store > Themes.

  2. Find the theme that you want to edit, and then click Customize.

  1. Navigate to the page and section where you want to add the app block.

  2. Click Add block.

  3. From the drop-down menu, in the Apps section, select the Okendo app block that you want to add to the section. Okendo app blocks will feature the Okendo logo and the title starting with "Okendo" underneath the type of app block.

  4. Alternatively, click the Search bar in the app block popup and enter a search term starting with "Okendo" to search through your installed Okendo app blocks.
    โ€‹

  5. Optional: move the app block to the place you want it in the section, and customize the block using any available settings.

  6. Click Save.

Add an Okendo app block to a template

  1. From your Shopify admin, go to Online Store > Themes.

  2. Find the theme that you want to edit, and then click Customize.

  1. Navigate to the page where you want to add the app section.

  2. Click Add section.

  3. 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.

  4. Optional: move the app section to the place you want it on the page, and customize the block using any available settings.

  5. Click Save.

How to Change the Sort Order of an App Block

To change the sort order of an Okendo App Block there are a two main ways:

  1. Click and drag the handle at the end of the app block in the sidebar.

  2. Hover over of the app block in the preview pane and press the up/down icons to shift it up and down one position at a time.

Removing App Blocks

To remove an App Block you can either:

  1. Click Remove Block in the bottom right hand side of the App Block Settings Screen

  2. Click the trash can icon from the bubble that appears in the theme preview window

Okendo App Blocks

Star Rating

On any of your page templates in the Shopify Theme Customizer, add Okendo's "Star Rating" block from the list of Apps Blocks.

Re-order the Star Rating block to suit your theme.


Reviews Widget

Add Okendo's Reviews Widget Block from the Apps Block to any Section on any page.

Reviews Widget on the product details page

The Reviews Widget App Block allows you to control the following settings:

Product

If a product is selected, the Reviews Widget will only display reviews from that product, or grouped product, depending on your Groups settings in Okendo Admin.

If no product is specified the Reviews Widget will display All Reviews.

If the App Block is added to a Product template, it will automatically default the Product value to the Product for that page.

Widget Type

The widget type drop down list allows you to configure if the Reviews Widget will display:

  • Reviews only

  • Questions & Answers only

  • Both Reviews and Question & Answers

General Widget Configuration and Styling

The Reviews Widget style and configuration is made in the Okendo Admin.


Reviews Carousel

Similar to the Reviews Widget Block, the Reviews Carousel block can be placed on any page.

Reviews Carousel on the home page

The Reviews Carousel App Block allows you to control the following settings:

Header Text

This appears above the carousel

Product

Filter the displayed reviews to a particular product or collection.

If the App Block is added to a Product template, it will automatically default the Product value to the Product for that page.

Enable Auto-Scrolling

Whether the items in the carousel auto scroll or require the customer to click the next/previous arrows.


Reviews Badge

The Reviews Badge can be placed as its own section on any page, or as a block in any section. You can modify the size of the badge and the badge's linked page in the Block Settings section.

The Reviews Badge App Block allows you to control the following settings:

Link

This is the product a badge will draw their aggregate reviews from. If no product is specified, the aggregate of all reviews will be used.

Badge Size

This allows you to display a Small or Large badge on site.

Large Reviews Badge on the Homepage

Small Reviews Badge in the Product Information Block

Media Grid

The Media Grid can be placed as its own section on any page, or as a block in any section. You can modify the size of the badge and the badge's linked page in the Block Settings section.

It displays a grid of media items in various layout types which can be adjusted via settings in the Okendo Admin area.

The Media Grid App Block allows you to control the following settings:

Filter Reviews

If the Filter Reviews product is not set, the Media Grid will pull UGC from all reviews in the order configured in the Okendo Admin settings.

Product

If the product is set, the Media Grid will filter the UGC to only those submitted in reviews for the selected product.

If the App Block is added to a Product template, it will automatically default the Product value to the Product for that page.

Media Carousel

The Media Carousel displays user generated content for a selected product or for all recently submitted reviews on site. It can be placed as its own section on any page, or as a block in any section. You can modify the product that the carousel draws its' user generated content from by selecting a product from the section labelled Filter Reviews in the Block Settings section.

The Media Carousel App Block allows you to control the following settings:

Product

If the product is set, the Media Carousel will filter the UGC to only those submitted in reviews for the selected product.

If the App Block is added to a Product template, it will automatically default the Product value to the Product for that page.

Questions Widget

The Questions Widget displays a list of questions and answers for a given product or for all recently submitted questions on site. It can be placed as its own section on any page, or as a block in any section.

You can modify the product that the Questions Widget draws its' user generated content from by selecting a product from the section labelled Product in the Block Settings section.

The Questions Widget App Block allows you to control the following settings:

Product

If the product is set, the Questions Widget will filter the questions and answers to only those submitted for the selected product.

If the App Block is added to a Product template, it will automatically default the Product value to the Product for that page.

See video below on how to add Okendo widgets using the app blocks.

Using The Theme Code Editor

If a section on your theme does not support app blocks, you can refer step 3 of our manual installation instructions.

General Reading on App Embeds and App Blocks

For more information on extending your theme with App Embeds/App Blocks please read this article on Shopify.

Troubleshooting

If the widget is not showing and you have an older theme, check the Okendo Reviews widgets is toggled on in the Okendo Widget Settings (Settings > Widgets). If it isn't, enable the Review Widgets then click the "Save" button.

Related Articles

Did this answer your question?