Calculator Block Does Not Show Inside a Section

Calculator Block Does Not Show Inside a Section

Overview

Use this page when the Appify CPO Calculator block is already in the Theme Customizer for a section (often Product information), the calculator is published and assigned to the product, and the storefront still does not show it inside that section. A common clue: the same block does appear if you add it as its own section above or below Product information.

Many themes let you add an app block in the editor but never output it on the page. Shopify only prints an app block when the section's Liquid file renders it. If that line is missing, hiding other blocks in the section will not help.

This is a theme-code change, not an Appify CPO setting. If you are not comfortable editing theme Liquid, ask your theme developer to apply the steps below, or keep the calculator as its own section until they can.

Before you edit theme code

Confirm all of the following first:

  1. The Appify CPO app embed is on. See Installing Appify CPO on Your Theme.
  2. You added Appify CPO Calculator (or Price Summary / Quantity Tiers) to the same product template the live product uses. Some stores have more than one product template.
  3. The calculator is assigned to that product and published. See Creating Your First Calculator.

If the calculator shows as a separate section on that template but not inside Product information, continue with the Liquid fix.

Steps

  1. In Shopify admin, go to Online Store → Themes.
  2. On the live theme, click … (or Actions) → Edit code.
  3. Open the Liquid file for the section where the block is missing. Typical names: main-product.liquid, product-template.liquid, product-information.liquid, or a custom copy used only by that product template.
  4. Search the file for {%- for block in section.blocks -%} or {% for block in section.blocks %}.
  5. Nearby, find {%- case block.type -%} or {% case block.type %}.
  6. Inside that case, add:
{% when '@app' %}
  {% render block %}
  1. If the file already has {% when '@app' %}, do not add a second copy. Check that {% render block %} is on the next line.
  2. Click Save.
  3. Open the product page on the storefront and refresh. The calculator should appear in that section.

If the file has no case statement

Search for the for block in section.blocks loop and add this inside the loop:

{% if block.type == '@app' %}
  {% render block %}
{% endif %}

Place it so every block type you already handle still runs. Some themes use if / elsif instead of case.

Details

What you see What it usually means
Block is listed in the Customizer but the storefront is empty in that section The section accepts app blocks in its settings but never renders @app.
Block works as its own section, not inside Product information Only that section's Liquid is missing the render. Other sections (or Shopify's Apps section) already render app blocks.
Works on one product, missing on another Those products use different templates. Edit the Liquid for the template that is missing the calculator.
Price Summary or Quantity Tiers also missing in the same section Same fix. One @app render covers all Appify CPO blocks in that section.

You do not need to change Appify CPO after this save. Republishing the calculator is not required.

Shopify's theme docs for app blocks: App blocks for themes.

Examples

  • Custom wallpaper product template — You add Appify CPO Calculator under the price in Product information. The Customizer shows the block. The live page does not. You add {% when '@app' %} and {% render block %} to that template's product section file, save, and the calculator appears under the price.
  • Default vs custom template — The calculator already shows on a simple product template. A second, customized product template still hides it until you add the same @app render to that section file.
  • Temporary layout — You need the calculator live today and cannot edit Liquid yet. You add Appify CPO Calculator as its own section under Product information. Customers see it immediately. Later you add the @app render and move the block back into Product information.