Adding "Per Case" after price on select items in shop on Envy theme?

Highlighted
New Member
3 0 0

Thanks for any help - new to Shopify! We're selling product in a case of 12.

Would like for the pricing to read "$28.00 per case" vs just saying "$28.00".

BUT this can't be sitewide. It can only apply to specific collections because other items aren't sold by the case.

 

https://7dcic3a7u06tmusj-41951166621.shopifypreview.com/collections/all

0 Likes
Highlighted
Shopify Partner
2434 125 384

You'll have to find where the price is coded in different templates and use something similar to the following

{% if product.type = "case" %} per case {% endif %}

 

You'll want to try and place it after the price html or you may then also need to modify your themes javascript if your using variant options as once a different variant is selected the text may not be with the new price the javascript updates.

 

If you want to hire someone to take care of it contact me by email paull.newton+shopifyforums@gmail.com

Problem Solved? ✔️Accept and ? Like the solution so you can help others.
Buy me a coffee ☕ paypal.me/paulnewton or donate to eff.org
Confused? Busy? Buy a custom solution paull.newton+shopifyforum@gmail.com
1 Like
Highlighted
New Member
3 0 0

Thanks. I'm not a coder, but I think they are using a different syntax? There's some stylistic differences like the use of dashes.

Here's the snippet that seems to affect the area in question. Tried using what you proposed and got an error message on the page. I also tried making some adjustments based on below (like adding dashes), but wasn't successful. Any help is appreciated. Thanks!

<div class="product-grid--pricing--price-per-unit">
  {%- if variant.unit_price_measurement -%}
    (<span class="money">{{ variant.unit_price | money }}</span>
    <span> / </span>
    {%- if variant.unit_price_measurement.reference_value != 1 -%}
      {{- variant.unit_price_measurement.reference_value -}}
    {%- endif -%}
    {{ variant.unit_price_measurement.reference_unit }})
  {%- endif -%}
</div>

 

0 Likes
Highlighted
New Member
3 0 0

Actually found another section:

Where would I insert 

	{% if product.type = "cases" %} per case {% endif %}

 

… within the below. Every time I insert I get a syntax error. Thanks again

 

{% assign crop_setting = settings.product-grid %}
{% if crop_setting == "square" %}
    {% assign image_crop = "aspect-ratio--square" %}
{% elsif crop_setting == "tall" %}
    {% assign image_crop = "aspect-ratio--tall" %}
{% elsif crop_setting == "wide" %}
    {% assign image_crop = "aspect-ratio--wide" %}
{% endif %}

<div class="indiv-product">

  <script type="application/json" id="product-grid-{{ liquidObject.id }}" class="product-grid-json">
    {{ liquidObject | json }}
  </script>

  {% case settings.hover-effect %}

  {% when 'none' %}

    <a class="grid__image" href="{{ product.url }}" title="{{ liquidObject.title | escape }}">
        {% if image_crop %}<div class="aspect-ratio {{ image_crop }}">{% endif %}
            {% render 'responsive-image' with liquidObject.media[0].preview_image, alt: liquidObject.title %}
        {% if image_crop %}</div>{% endif %}
    </a>

  {% when 'second-image' %}

    {% if liquidObject.media.size > 1 %}
      <div class="reveal">
        <a class="grid__image" href="{{ liquidObject.url }}" title="{{ liquidObject.title | escape }}">
            {% if image_crop %}<div class="aspect-ratio {{ image_crop }}">{% endif %}
              {% render 'responsive-image' with liquidObject.media[0].preview_image, alt: liquidObject.title %}
              <div class="hidden">
                {% render 'responsive-image' with liquidObject.media[1].preview_image, alt: liquidObject.images.last.alt %}
              </div>
            {% if image_crop %}</div>{% endif %}
        </a>
      </div>
    {% else %}
      <a class="grid__image" href="{{ liquidObject.url }}" title="{{ liquidObject.title | escape }}">
        {% if image_crop %}<div class="aspect-ratio {{ image_crop }}">{% endif %}
            {% render 'responsive-image' with liquidObject.media[0].preview_image, alt: liquidObject.title %}
        {% if image_crop %}</div>{% endif %}
      </a>
    {% endif %}

  {% when 'zoom' %}

    <div class="collection-image--zoom-effect">
      <div class="zoom-effect--inner">
        <a class="grid__image" href="{{ liquidObject.url }}" title="{{ liquidObject.title | escape }}">
          {% if image_crop %}<div class="aspect-ratio {{ image_crop }}">{% endif %}
             {% render 'responsive-image' with liquidObject.media[0].preview_image, alt: liquidObject.title %}
          {% if image_crop %}</div>{% endif %}
        </a>
      </div>
    </div>

    {{  }}

  {% endcase %}

  <div class="hp-title">

  {% if settings.show_vendor %}
    <div class="indiv-product-vendor-text">{{ liquidObject.vendor | link_to_vendor }}</div>
  {% endif %}

    <a href="{{ liquidObject.url }}">

      <span class="indiv-product-title-text">{{ liquidObject.title }}</span>

      <span class="money-styling">

        {% if liquidObject.compare_at_price_max > liquidObject.price %}
          <span class="compare-at-price">
            <span class="money">{{ liquidObject.compare_at_price_max | money }}</span>
          </span>
        {% endif %}
        

        {% if liquidObject.price_varies %}
          <small>{{ 'products.general.from' | t }}</small> <span class="money">{{ liquidObject.price_min | money }}</span>
        {% else %}
          <span class="money">{{ liquidObject.price_min | money }}</span>
        {% endif %}
        
        

        {% assign first_variant = liquidObject.variants[0] %}
        {% render 'unit-price-measurement-grid', variant: first_variant %}

      </span>

      {% if settings.show_reviews %}
        <span class="shopify-product-reviews-badge" data-id="{{ liquidObject.id }}"></span>
      {% endif %}

    </a>
  </div>

  {% if settings.show_swatches %}

        {% for option in liquidObject.options %}

            {% capture downcased_option %}{{ option | downcase }}{% endcapture %}
            {% assign option_handle = option | handle %}
            {% assign option_index = forloop.index0 %}
            {% assign prod_id = liquidObject.id %}

            {% if downcased_option contains 'color' or downcased_option contains 'colour' %}
                {% if product.variants.size > 1 %}
                    <div data-option-index="{{ prod_id }}" class="{{ option_handle }} options indiv-product__swatches">

                        {% assign values = '' %}
                        {% for variant in product.variants %}

                          {% assign variantID = variant.id %}

                          {% assign value = variant.options[option_index] %}
                          {% capture wrapped_value %},{{ value }},{% endcapture %}
                          {% unless values contains wrapped_value %}

                          {% if variant.image %}
                            {% assign image = variant.image | product_img_url: '400x' %}
                          {% else %}
                            {% assign image = liquidObject.media[0].preview_image | product_img_url: '400x' %}
                          {% endif %}

                              <input class="" id="section-{{ section.id }}-swatch-{{ prod_id }}-{{ value | handle }}" type="radio" name="option-{{ prod_id }}" value="{{ value | escape }}" data-href="{{ image }}"/>
                              <label for="section-{{ section.id }}-swatch-{{ prod_id }}-{{ value | handle }}" style="background-color: {{ value | split: ' ' | last | handle }}; background-image: url({{ value | handle | append: '.png' | file_url }};)">
                                <img class="crossed-out" src="{{ 'soldout.svg' | asset_url }}" />
                              </label>

                          {% capture values %}{{ values }}{{ wrapped_value }}{% endcapture %}
                          {% endunless %}

                        {% endfor %}

                    </div>
                {% endif %}
            {% endif %}

        {% endfor %}
  {% endif %}


  {% if liquidObject.available %}
    {% if liquidObject.compare_at_price_max > liquidObject.price and settings.sale_badge %}
      <div class="envy-badge sale-badge">{{ 'products.general.sale' | t }}</div>
    {% endif %}
  {% elsif settings.sold_out_badge %}
    <div class="envy-badge sold-out-badge">{{ 'products.product.sold_out' | t }}</div>
  {% endif %}
</div>

 

0 Likes
Highlighted
Shopify Partner
2434 125 384

Prices are output almost always where a the following filter is used:

 | money 

compare_at_price, price_min,etc

 

The dashes on braces are just whitespace control in liquid

https://shopify.dev/docs/themes/liquid/reference/basics/whitespace

Problem Solved? ✔️Accept and ? Like the solution so you can help others.
Buy me a coffee ☕ paypal.me/paulnewton or donate to eff.org
Confused? Busy? Buy a custom solution paull.newton+shopifyforum@gmail.com
0 Likes