> ## Documentation Index
> Fetch the complete documentation index at: https://docs.supercycle.com/llms.txt
> Use this file to discover all available pages before exploring further.

# Methods app block troubleshooting

> Fix the Methods app block when it doesn't appear, can't find the product form, or leaves the button stuck

Problems you might hit with the [Methods app block](/developers/app-blocks/methods) in a custom theme, and how to fix them. Supercycle finds your theme's product form and variant input on its own, and uses a `MutationObserver` to keep control of the button when other scripts change it, including AJAX carts. The entries below cover the cases where that detection needs a hint.

<AccordionGroup>
  <Accordion title="Supercycle doesn't detect the variant ID input">
    **Why it happens.** Supercycle finds the variant ID input with `[name='id']`. A theme that names or structures the input differently isn't detected.

    **How to fix it.** Add the `supercycle-variant-id-input` attribute to the input whose value changes when the variant changes.

    ```html Variant ID input theme={null}
    <input supercycle-variant-id-input type="hidden" name="id" value="49499861516571" class="product-variant-id">
    ```

    To list every candidate input, run this in the browser console:

    ```javascript Find variant inputs theme={null}
    document.querySelectorAll("[name='id']")
    ```
  </Accordion>

  <Accordion title="Supercycle doesn't detect the add to cart form">
    **Why it happens.** Supercycle looks for the add to cart form with several selectors, in this order:

    1. A form with the `supercycle-add-to-cart-form` attribute, the most reliable option
    2. A form with `data-type='add-to-cart-form'`, used by many themes
    3. A form with `data-product-form`, a common fallback in Online Store 2.0 themes
    4. The last eligible form whose action is `/cart/add`, used only when nothing else matches

    If none match, the block can't sync or control your button.

    **How to fix it.** Add the `supercycle-add-to-cart-form` attribute to your product form.

    ```liquid Liquid product form theme={null}
    {% form 'product', product, id: product_form_id, class: 'form js-product-form', data-product-id: product.id, supercycle-add-to-cart-form: true %}
    ```

    If the theme doesn't use a Liquid form tag:

    ```html HTML form theme={null}
    <form action="/cart/add" supercycle-add-to-cart-form>
    ```

    The form's `action` must end in `/cart/add` and the form must contain a `<button type="submit">`. The form usually lives in one of these files:

    | Theme type       | Typical file locations                                             |
    | ---------------- | ------------------------------------------------------------------ |
    | Online Store 2.0 | `sections/product-template.liquid`, `sections/main-product.liquid` |
    | Legacy themes    | `templates/product.liquid`, `snippets/product-form.liquid`         |
  </Accordion>

  <Accordion title="The Methods block doesn't show on the product page">
    **Why it happens.** The Supercycle Engine app embed is off, the page is cached, or the theme isn't compatible with app blocks out of the box.

    **How to fix it.** Turn on the [Supercycle Engine app embed](/documentation/setup/theme-setup) in the theme editor, then hard refresh the page. If the block still doesn't show, contact support from the app with the theme name and a link to the product page.
  </Accordion>

  <Accordion title="The Methods block is empty">
    **Why it happens.** The product isn't in Supercycle, or none of its methods are turned on.

    **How to fix it.** Open the product in the Supercycle admin, confirm it's imported, and turn on at least one method.
  </Accordion>

  <Accordion title="The price doesn't update when the variant changes">
    **Why it happens.** The block reads the variant from `product.selected_or_first_available_variant`. A theme that doesn't update it on variant change leaves the block on the first variant's price.

    **How to fix it.** Make sure your theme updates `product.selected_or_first_available_variant` when the customer changes variant.
  </Accordion>
</AccordionGroup>
