How to Add the Extension to the Product Page

Written By Floris de Vries

Last updated 11 days ago

The Options Price Calculator uses a theme app extension. This extension must be added to your product page in order for the calculator to appear in your store.

Step 1: Open the App

  1. Go to your Shopify admin.

  2. Navigate to Apps.

  3. Open Options Price Calculator.

Step 2: Open the Theme Editor

The app extension must be added using the Shopify Theme Editor.

  1. Go to your Shopify admin.

  2. Navigate to Online Store โ†’ Themes.

  3. On your published theme, click Customize to open the Theme Editor.

Step 3: Navigate to the Product Page

  1. In the theme editor, use the page selector at the top.

  2. Select Products โ†’ Default product
    (or the product template you want to use).

Step 4: Add the App Block

  1. Click Add block in the section where you want the calculator to appear.

  2. Select Apps.

  3. Choose Options Price Calculator.

Recommended placement:

  • Below the product price

  • Above the โ€œAdd to cartโ€ button

Step 5: Save and Publish

  1. Click Save in the theme editor.

  2. The calculator is now live on your product page.

Step 6: Verify on the Storefront

  1. Open a product page on your storefront.

  2. Select different options.

  3. Confirm that the product price updates correctly.