Shopify theme guide

Add a shipping calculator to the Refresh theme.

Refresh’s spacious product layouts give the calculator room to explain shipping without crowding the purchase controls.

Where to place it in Refresh

Add ShipCalc below the variant picker or buy buttons and use the cart block near the subtotal.

Setup steps

  1. Install ShipCalc. Install from the Shopify App Store. The 14-day free trial starts straight away.
  2. Open the Theme Editor. Go to Online Store → Themes → Customize on your Refresh theme, or use the one-click link in ShipCalc's onboarding.
  3. Add the ShipCalc block. Open a product template, choose Add block → ShipCalc, and drag it near the price or buy buttons. Repeat on the cart template.
  4. Turn on the cart drawer embed. If your store uses a slide-out cart, open App embeds and switch on the ShipCalc cart drawer embed.
  5. Match the design and save. Adjust colours, layout, and wording in ShipCalc's Appearance page, preview, and save the theme.

What to test in Refresh

Keep helper text concise and confirm that the widget inherits or deliberately overrides the theme typography.

  • Desktop product page
  • Mobile product page
  • Cart with one item and with several
  • A destination in each region you ship to
  • Unsupported destination and no-rate message
  • Cart drawer open, add, and remove

Questions

Do I need to edit Refresh theme code?

No. The product and cart placements are Shopify Theme Editor app blocks. The cart drawer uses an app embed; some drawers need a custom selector, which we can help with.

Should the calculator go above or below Add to cart?

Keep it close to the price and purchase buttons. If delivery cost is a big part of the decision (bulky or heavy products), place it directly under the price or buy buttons.

What should I test before publishing?

Desktop and mobile layouts, several product types, destinations in each region you ship to, the cart page, and the cart drawer if your theme uses one.

Show shoppers the shipping cost before they ask.

Questions first? Talk to us.

Start free trial
  • 14-day free trial
  • No theme code