How do I get my custom-made page to display product prices

Online Store and Theme Development
1

Short description of issue

Currently unable to show product price when a product is selected. I want to make the pricing apppear next to the option selected under ‘CHOOSE A PRODUCT’ (refer to eg image

Link to Shopify Store

Reproduction steps

add liquid code → test → price not dislplayed

Additional info

The page is custom coded

What type of topic is this

Bug report

Upload screenshot(s) of issue

Screenshot 2025-10-09 104603 1.png
Screenshot 2025-10-09 104603 1.png732×413 14.9 KB

2

Hi,

Do you have the liquid snippet you are using please :folded_hands:
You will also likely need some javascript

3 
{% assign no_bg_product = all_products['no-bg'] %}
{% assign bg_product = all_products['with-bg'] %}

{% if no_bg_product and bg_product %}
  <div id="prices" style="display: none;">
    <!-- No BG Prices (from URL1 product) -->
    {% for variant in no_bg_product.variants %}
      {% assign variant_id = variant.id %}
      {% if variant_id == id1 %}
        <attribute data-price-2-nobg="{{ variant.price | money_without_trailing_zeros }}"></attribute>
      {% elsif variant_id == id2 %}
        <attribute data-price-3-nobg="{{ variant.price | money_without_trailing_zeros }}"></attribute>
      {% endif %}
    {% endfor %}
    <!-- BG Prices (from URL2 product) -->
    {% for variant in bg_product.variants %}
      {% assign variant_id = variant.id %}
      {% if variant_id == id3 %}
        <attribute data-price-2-bg="{{ variant.price | money_without_trailing_zeros }}"></attribute>
      {% elsif variant_id == id4 %}
        <attribute data-price-3-bg="{{ variant.price | money_without_trailing_zeros }}"></attribute>
      {% endif %}
    {% endfor %}
  </div>
{% endif %}

this was what i did. the real id values in the if-else comparison blocks are used in the actual snippet, i just put their placeholders here. for context i my products are split into background/no background figurines, with 2 or 3 inch options for each.

4

You need to remove the style display none. It will not show with that attribute. You’ll also need to add some javascript to change the price when the product selection changes.

You can see an example of that in themes on the product pages.