How to Add the Extension to the Product Page

Written By Floris de Vries

Last updated 8 months 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.