Product Options 2.0 Install Instructions

Follow

Warning!

This article only applies to Product Options Version 2.0. This article requires technical knowledge and prior experience with liquid code. If you are not comfortable with this, Request a Product Options Installation for help.

Select each step below to view the instructions

  1. Duplicate themes, to create a backup copy.
  2. From "Shopify Admin", select Settings.

    select settings

  3. Select Notifications.

    select notifications

  4. Select Order confirmation.

    select order confirmation

  5. Replace all code with: Order confirmation.

    replace all code

  6. Select Save.

    select save

  7. Select Abandoned checkout.

    select abandoned checkout

  8. Replace this code:
    <td class="button__cell"><a href="{{ url }}" class="button__text">Complete your purchase</a></td>
     </tr>
     </table>
     {% if shop.url %}
     <table class="link secondary-action-cell">
     <tr>
     <td class="link__cell"><a href="{{ shop.url }}" class="link__text"><span class='or'>or</span> Visit our store</a></td>

    replace this code

  9. With this code:
    <td class="button__cell"><a href="{{ shop.url }}/cart" class="button__text">Complete your purchase</a></td>
     </tr>
     </table&gt
     {% if shop.url %}
     <table class="link secondary-action-cell">
     <tr>
     <td class="link__cell"><a href="{{ shop.url }}" class="link__text"><span class='or'>or</span> Visit our store</a></td>

    with this code

  10. Select Save.

    select save

  11. Select Shipping confirmation.

    select shipping confirmation

  12. Replace all code with: Shipping confirmation.

    replace all code

  13. Select Save.

    select save

  14. Select Shipping update.

    select shipping update

  15. Replace all code with: Shipping update.

    replace all code

  16. Select Save.

    select save

  17. Under "Order notifications", select New order.

    select new order

  18. Replace all code with: New order notification.

    replace all code

  19. Select Save.

    select save

  1. From "Shopify Admin", select Online Store.

    select online store

  2. Select Actions.

    Actions

  3. Select Edit code.

    Edit code

  4. Under "Templates", select cart.liquid.

    Note: If your template contains sections, you will need to select the cart-template.liquid section instead.

    select cartliquid template

  5. Add this code where you would like the list of selected options to appear in the order history:

    Note: Usually immediately after the line that contains line_item.title

    {% assign propertySize = item.properties | size %}
    {% if propertySize > 0 %}
        {% for p in item.properties %}
            {% assign first_character_in_key = p.first | truncate: 1, '' %}
            {% unless p.last == blank or first_character_in_key == '_' %}
                {{ p.first }}:
                {% if p.last contains '/uploads/' %}
                   <a href="{{ p.last }}">{{ p.last | split: '/' | last }}</a>
                {% else %}
                    {{ p.last }}
                {% endif %}
            {% endunless %}
        {% endfor %}
    {% endif %}

    add code

  6. Select Save.

    select save

  1. From "Shopify Admin", select Online Store.

    select online store

  2. Select Actions.

    Actions

  3. Select Edit code.

    Edit code

  4. Under "Templates", select product.liquid.

    Note: If your template contains sections, you will need to select the product-template.liquid section instead.

    select product.liquid

  5. Add this code where you would like your options to appear:

    Note: This must be within the <form></form> tags.

    <div class="bold_options" data-product-id="{{ product.id }}"></div>

    add this code

  6. Select Save.

    select save

  1. From "Shopify Admin", select Online Store.

    select online store

  2. Select Actions.

    Actions

  3. Select Edit code.

    Edit code

  4. Under "Templates", select cart.liquid.

    Note: If your template contains sections, you will need to select the cart-template.liquid section instead.

    select cart.liquid

  5. Add this code where you would like it to appear:

    Note: This is usually placed above the subtotal.

    <div class="bold_option_variant_totals"></div>

    add code

  6. Select Save.

    select save

That's it!

Next Steps:

Blog Posts:

1 out of 18 found this helpful

Comments

0 comments

Please sign in to leave a comment.