Installation Guide for Bold Bundles

When you install the Bold Bundles app to your store, you are able to navigate to our Liquid install area within the app. This can be found within the side bar, Need Help? > Liquid Installation section.

Selecting the Begin automatic update option will allow you to choose the theme on your store that you would like to complete the automatic code installation on for Bold Bundles.

When selecting which theme to update, there will be a check box that says, "I have created a backup of this theme".

We recommend creating a duplicate version of your Shopify theme to ensure you have a copy without the Bold code installed.

Once the checkbox is selected to confirm you have a back up version of your theme, you will be able to proceed with the code installation.

 

---

 

This option creates a ticket with our installation team, and schedules your store for a manual installation completed by our experts. By selecting this option, you will be asked to confirm which theme you would like this code installation to be completed on.

All of these requests are completed manually on a rotational basis and will be completed as soon as possible.

This installation allows the bundles to appear on the product page and discount correctly on the product, cart and checkout page.

Step 1: Add Snippet Files

1. Duplicate themes to create a backup copy.
2. From the Shopify admin, select Online Store.
3. Select Actions.
4. Select Edit code.
5. Under Snippets, find these files:
   • bold-common.liquid
   • bold-includes.liquid
   • bold-product.liquid
   • bold-variant.liquid
   • shappify-bdl-load-bundle.liquid
   • bold-bundles.css
6. For any that don't exist:
   1. Select Add a new snippet.
   2. Enter the correct snippet name.
   3. Select Create snippet.

      

   4. Copy and paste the code found in each of these links into their respective files:
      • bold-common.liquid
      • bold-includes.liquid
      • bold-product.liquid
      • bold-variant.liquid
      • shappify-bdl-load-bundle.liquid
      • bold-bundles.css

      

   5. Select Save.
   6. Repeat steps 6.1 – 6.5 for each missing snippet file.

 

---

 

Step 2: Edit collection.liquid

1. Under Templates, select collection.liquid.

   Note: If your theme contains sections, you may need to open collection-template.liquid under Sections instead.

2. Find each instance of:

   {% for product in collection.products %}

   Note: If you can't find this code, look to see if the theme has a product-loop.liquid. Can't find this code?

   

3. Copy and paste:

   {% include 'bold-product' with product, hide_action: 'skip' %}

   on the line below each instance.

   

4. Select Save.

 

---

 

Step 3: Edit index.liquid

1. Under Templates, select index.liquid.

   Note: If your theme contains Sections, you may need to look under Sections instead. The file may be named: featured-products.liquid, home-collection.liquid, home-featured-products.liquid, featured-row.liquid, simple-collection.liquid, featured-collection.liquid, home-tab.liquid, home-big-product.liquid, index-products.liquid or tabs-collection.liquid.

2. Find each instance of:

   {% for product in collection.products %}

   Note If you can't find this code, look to see if the theme has a product-loop.liquid. Can't find this code?

   

3. Copy and paste:

   {% include 'bold-product' with product, hide_action: 'skip' %}

   on the line below each instance.

   

4. Select Save.

 

---

 

Step 4: Edit related-products.liquid

1. Under Snippets, select related-products.liquid.

2. Find each instance of:

   {% for product in collection.products %}

   Note If you can't find this code, look to see if the theme has a product-loop.liquid. Can't find this code?

   

3. Copy and paste:

   {% include 'bold-product' with product, hide_action: 'skip' %}

   on the line below each instance.

   

4. Select Save.

 

---

 

Step 5: Edit search.liquid

1. Under Templates, select search.liquid.

2. Find each instance of:

   {% for item in search.results %}

   

3. Copy and paste:

   {% include 'bold-product' with item, hide_action: 'skip' %}

   on the line below each instance.

   

4. Select Save.

 

---

 

Step 6: Edit product.liquid

1. Under Templates, select product.liquid.

2. Add this code to the top of the file:

   Note: If your theme contains Sections, you may have to make these changes in product-template.liquid under Sections.

   {% include 'bold-product' with product, hide_action: 'break' %}{% if bold_hidden_product %}{% break %}{%endif %}

   

3. Find each instance of:

   {% for variant in product.variants %}

   

4. Copy and paste:

   {% include 'bold-variant' with variant, hide_action: 'skip' %}

   on the line below each instance.

   Note: If your theme uses swatches, where variants are shown as buttons instead of through a drop-down menu, this code will also need to be added to a snippet file, usually named swatch.liquid or product-swatch.liquid.

   

5. Find each instance of:

   product.variants.size

   Note: If you can't find this in the product.liquid file, then check the snippets folder for a product-form.liquid or short-form.liquid file and look for the code in there.

6. Replace each instance with:

   bold_variants_size

7. Find each instance of:

   {{ product | json }}

   Note: If you can't find {{ product | json }} in those files, try searching for it in the theme.liquid file. If it's not in the product.liquid or theme.liquid file, then this can be skipped.

   

8. Replace each instance with:

   {% include 'bold-product', output: 'json' %}

   

9. Add this code where you would like the product bundle to display on the product page.

   Note: This code cannot be within the form tags. We recommend adding it either after the </form> tag or just before the code that outputs the related products. If you can't find the </form> tag in the product.liquid file, check the Snippets folder for a product-form.liquid or short-form.liquid file and look for the code in there.

   {% unless bundle_loaded == 'true' %}
   {% include 'shappify-bdl-load-bundle' %}
   {% assign bundle_loaded = 'true' %}
   {% endunless %}

   

10. Select Save.

 

---

 

Step 7: Edit bold-includes.liquid

1. Under Snippets, select bold-incudes.liquid.
2. Copy and paste this code in the bottom of the file.

   {{ 'https://bundles.boldapps.net/js/bundles.js' | script_tag }}
   {{ 'bold-bundles.css' | asset_url | stylesheet_tag }}

   

3. Select Save.

 

---

 

Step 8: Edit theme.liquid

1. Under Layout, select theme.liquid.
2. Copy and paste this code directly above the </head> tag:

   {% include 'bold-common' %}
   {% include 'bold-includes' %}

   

3. Select Save.

 

---

 

Step 9: Edit cart.liquid

1. Under Templates, select cart.liquid.

   Note: If your theme contains Sections, you may have to look for this code under Sections in cart-template.liquid instead.

2. Find every occurrence of code similar to:

   {{ item.price | money }}

   On newer themes, it will be:

   {{  item.final_price | money }}

   Note: The item price display can vary by theme but should be similar to this.

   

3. Copy and paste this code directly before that line:

   <span class=“Bold-theme-hook-DO-NOT-DELETE bold_cart_item_price” data-item-key=“{{item.key}}” style=“display:none !important;“></span>

   

4. Find every occurrence of code similar to:

   {{ item.line_price | money }}

   On newer themes, it will be:

   {{ item.final_line_price | money }}

   Note: The item line price display can vary by theme but should be similar to this.

   

5. Copy and paste this code directly before that line:

   <span class="Bold-theme-hook-DO-NOT-DELETE bold_cart_item_total" data-item-key=”{{item.key}}" style="display:none !important;"></span>

   

6. Find every occurrence of code similar to:

   {{ cart.total_price | money }}

   Note: The cart total price display can vary by theme but should be similar to this.

   

7. Copy and paste this code directly above that line:

   <span class="Bold-theme-hook-DO-NOT-DELETE bold_cart_total" style="display:none !important;"></span>

   

8. Find the section that starts similar to:

   {% for p in item.properties %}

   

9. Replace the entire section with:

   <span class="Bold-theme-hook-DO-NOT-DELETE bold_cart_item_properties" style="display:none !important;"></span>
   {% 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 %}

   

10. Select Save.

 

---

 

Step 10: Update Pricing Code

Step 1: Add Snippet Files

1. Duplicate themes to create a backup copy.
2. From the Shopify admin, select Online Store.
3. Select Actions.
4. Select Edit code.
5. Under Snippets and Assets, find these files:
   • bold-bundles.css
   • bold-common.liquid
   • bold-includes.liquid
   • bold-pr.liquid
   • shappify-bdl-load-bundle.liquid
6. For any that don't exist:
   1. Select Add a new snippet or Add a new asset.
   2. Enter the correct snippet name.
   3. Select Create snippet.

      

   4. Copy and paste the code found in each of these links into their respective files:
      • bold-bundles.css
      • bold-common.liquid
      • bold-includes.liquid
      • bold-pr.liquid
      • shappify-bdl-load-bundle.liquid

      

   5. Select Save.
   6. Repeat steps 6.1 - 6.5 for each missing snippet file.

 

---

 

Step 2: Edit theme.liquid

1. Under Layout, select theme.liquid.
2. Copy and paste the following code below the {{ content_for_header }} line:

   {%- render 'bold-pr' -%}
   {%- render 'bold-common' -%}
   {%- render 'bold-includes' -%}

   

3. Select Save.

 

---

 

Step 3: Add the Product Loop Code

Overview

Updates need to be done on all theme files that pull your product information to the cart. The number and name of these files will vary from theme to theme. Generally, 3-5 files will need to be updated.

It's important that each theme file that outputs a price be modified. This is to ensure the correct information always shows for your customers.

Note: This will require you to go back and edit multiple files within your theme coding.

Go through the list of files one at a time and reference your theme's files to see if that particular file exists in your theme. Not all of these files will exist in a given theme.

List of Theme Files to Update

• Templates: Themes should contain most of these files. If your theme is using "Sections", these files will be located within the "Sections" folder as *-template.liquid files.
  • collection.liquid
  • list-collections.liquid
  • search.liquid
• Sections & Snippets: Any given theme should typically have a few of these files.
  • collection-template.liquid
  • featured-collection.liquid
  • product-full.liquid
  • product-loop.liquid
  • product-recommendations.liquid
  • product-slider.liquid
  • related-products.liquid

Not all of these will appear in a given file, but the ones that do may appear several times.

Code Adjustments Required

Your theme's product loop code should look similar to this:

{% for product in collection.products %}

The following code should be inserted directly after each instance:

<script type="application/json" class="bold-product-json">{{ product | json }}</script>

In some cases, the product loop code may look slightly different:

{% for item in search.results %}

We then need to adjust the end of our Bold price code to include the loop's product reference:

Note: Visit Product Loop Code Variations for more information on what this coding may look like.

<script type="application/json" class="bold-product-json">{{ item | json }}</script>

 

---

 

Step 4: Update the Product Price Code

Overview

Updates need to be done on all theme files that output product prices on the store. The number and name of these files will vary from theme to theme. Generally, 3-5 files will need to be updated.

These control the price fields on the product, collection, search, related products, and home pages.

It's important that each theme file that outputs a price be modified. This is to ensure the correct pricing always shows for your customers.

Note: This will require you to go back and edit multiple files within your theme coding.

Go through the list of files one at a time and reference your theme's files to see if that particular file exists in your theme. Not all of these files will exist in a given theme.

List of Theme Files to Update

• Templates: Themes should contain most of these files. If your theme is using Sections, these files will be located within the Sections folder as *-template.liquid files.
  • product.liquid
  • index.liquid
  • collection.liquid
  • search.liquid
• Sections & Snippets: Any given theme should typically have a few of these files.
  • featured-product.liquid
  • product-card.liquid
  • product-grid-item.liquid
  • product-form.liquid
  • product-template.liquid
  • related-products.liquid

Code Adjustments Required

Your theme's product price code should look similar to this:

{{ product.price | money }}

The following code should be placed around each of these instances with the <span> tags wrapping this price code:

<span class="money" data-product-id="{{ product.id }}">{{ product.price | money }}</span>

In some cases, the product price code may look slightly different:

{{ item.price | money }}

The following code should still be placed around each of these instances with the <span> tags wrapping this price code:

Note: Visit Product Price Code Variations for more information on what this coding may look like.

<span class="money" data-product-id="{{ item.id }}">{{ item.price | money }}</span>

 

 

---

 

Step 5: Update the Cart Price Code

Overview

Updates need to be done to the cart files that pull your product price information to the cart. The number and name of these files will vary from theme to theme.

It's important that each theme file that pulls this price information be edited. This is to ensure the correct information always shows for your customers.

Note: This will require you to go back and edit multiple files within your theme coding.

Go through the list of files one at a time and reference your theme's files to see if that particular file exists in your theme. Not all of these files will exist in a given theme.

List of Theme Files to Update

• Templates: If your theme is using Sections, these files will be located within the Sections folder as *-template.liquid files.
  • cart.liquid
• Sections & Snippets:
  • cart-ajax.liquid
  • cart-content.liquid
  • cart-template.liquid

Code Adjustments Required

First, you'll need to find each instance of coding that looks similar to this:

{{ item.price | money }}

The following code should be placed around each of these instances with the <span> tags wrapping this code:

<span class="money" data-line-index="{{ forloop.index0 }}">{{ item.price | money }}</span>

Next you'll need to find each instance of coding that looks similar to this:

{{ item.line_price | money }}

The following code should be placed around each of these instances with the <span> tags wrapping this code:

<span class="money" data-line-total data-line-index="{{ forloop.index0 }}">{{ item.line_price | money }}</span>

Lastly, you'll need to find each instance of coding that looks similar to this:

{{ cart.total_price | money }}

The following code should be placed around each of these instances with the <span> tags wrapping this code:

<span class="money" data-cart-total>{{ cart.total_price | money }}</span>

 

---

 

Step 6: Place the Bundles Widget (optional)

In some cases, you may want to manually place where your Bold Bundles widget displays on the storefront.

To choose the placement of your widget, please follow these steps:

1. Under Templates, select product.liquid. 

   Note: If your theme is using Sections, the contents for this file may be within product-template.liquid.

2. Find where you want to place your widget in the code.

   Note: Generally, most store owners will place just below your product page's </form> tag.

   

3. Copy and paste the following code in your desired location:

   {%- render 'shappify-bdl-load-bundle' -%}

   

4. Select Save.

 

---

 

Step 7: Install the Ajax Scripts

Overview

For themes that use AJAX functionalities, updates must be made to the JavaScript files that build these AJAX pages and/or modals. The file name and location of this code will vary from theme to theme.

Note: This is only required for themes that have AJAX functions.

These updates are done to ensure the correct product price displays every time it's shown on your storefront. This may require you to go back and edit multiple files in your theme coding.

List of Theme Files to Update

• Assets: Your theme may contain one or a few of these files. The required coding adjustment(s) are explained in the next section.
  
  • ajax-cart.js.liquid
  • ajaxify-cart.js.liquid
  • ajaxify-shop.js.liquid
  • ajaxify.js.liquid
  • app.js
  • apps.js
  • atlantic.js* - Atlantic by Pixel Union
  • colors-ajax-cart.js.liquid* - Colors by Small Victories
  • ella.js* - Ella by Halo Themes
  • empire.js* - Empire by Pixel Union
  • functions.min.js
  • handy.js* - Handy by Pixel Union
  • jas_theme.min.js
  • js_main.js
  • main.js.liquid
  • script.js.liquid
  • script.min.js
  • sections.js.liquid
  • shop.js.liquid
  • site.js.liquid
  • superstore.js* - Superstore by Pixel Union
  • theme.js
  • theme.js.liquid
  • theme.min.js
  • timber.js.liquid
  • vendor.min.js

* = Theme specific file. The theme name and developer are noted beside the file name.

Code Adjustments Required

Themes that pass cart objects between your regular cart and the AJAX modals will need to use our Cart Doctor function.

Most themes will use the function buildCart to show your products in their AJAX modals and pass this information between both areas.

You'll need to find where this code is in one of the above files, and paste the following code within this function:

// Bold:PRE
if (typeof window.BOLD !== 'undefined'
   && typeof window.BOLD.common !== 'undefined'
   && typeof window.BOLD.common.cartDoctor !== 'undefined') {
   // NOTE: "cart" should be the variable containing the cart JSON data
   cart = window.BOLD.common.cartDoctor.fix(cart);
}
// Bold:PRE

Some themes may use the function refreshCart to show your items in these modals.

You'll need to find where this code is in one of the above files, and paste the following code within this function:

// Bold:PRE
if (typeof window.BOLD !== 'undefined'
   && typeof window.BOLD.common !== 'undefined'
   && typeof window.BOLD.common.cartDoctor !== 'undefined') {
   // NOTE: "cart" should be the variable containing the cart JSON data
   cart = window.BOLD.common.cartDoctor.fix(cart);
}
// Bold:PRE

Themes that simply display the information from your cart in the AJAX modals will need to use our Event Emitter function.

Most themes will pull this information by using the getCartData function.

Note: If Bold Upsell's AJAX code is already installed on your theme, you do not need to install this code. It should already be contained in your theme files.

You'll need to find where this code is in one of the above files, and paste the following code within this function:

// Bold:PRE
if (window.BOLD && BOLD.common && BOLD.common.eventEmitter &&
   typeof BOLD.common.eventEmitter.emit === 'function'){
BOLD.common.eventEmitter.emit('BOLD_COMMON_cart_loaded');
}
// Bold:PRE

Some themes will grab this information through the updateView function.

You'll need to find where this code is in one of the above files, and paste the following code within this function:

// Bold:PRE
if (window.BOLD && BOLD.common && BOLD.common.eventEmitter &&
   typeof BOLD.common.eventEmitter.emit === 'function'){
BOLD.common.eventEmitter.emit('BOLD_COMMON_cart_loaded');
}
// Bold:PRE

 

---

 

Step 8: Edit bold-includes.liquid

1. Under Snippets, select bold-includes.liquid.
2. Copy and paste this code in the bottom of the file.

   {{ 'https://bundles.boldapps.net/js/bundles.js' | script_tag }}
   {{ 'bold-bundles.css' | asset_url | stylesheet_tag }}

   

3. Select Save.

This installation allows the bundles to appear on the product page and discount correctly on the product, cart and checkout page.

Step 1: Add Snippet and Asset Files

1. Duplicate themes to create a backup copy.
2. From the Shopify admin, select Online Store.
3. Select Actions.
4. Select Edit code.
5. Under Snippets and Assets, find these files:
   • bold-common.liquid
   • bold-includes.liquid
   • shappify-bdl-load-bundle.liquid
   • bold-variant.liquid
   • bold-product.liquid
   • bold-bundles.css
6. For any that don't exist:
   1. Select Add a new snippet or Add a new asset.
   2. Enter the correct snippet or asset name.
   3. Select Create snippet or Create asset.

      

   4. Copy and paste the code found in each of these links into their respective files:

      Note: Liquid files should go into the snippets folder, and CSS files should go into the assets folder.

      • bold-common.liquid
      • bold-includes.liquid
      • shappify-bdl-load-bundle.liquid
      • bold-variant.liquid
      • bold-product.liquid
      • bold-bundles.css

      

   5. Select Save.
   6. Repeat steps 6.1 – 6.5 for each missing snippet or asset file.

 

---

 

Step 2: Edit bold-includes.liquid

1. Under Snippets, select bold-includes.liquid.

2. Copy and paste this code into the bottom of the file:

   {{ 'https://bundles.boldapps.net/js/bundles.js' | script_tag }} 
   {{ 'bold-bundles.css' | asset_url | stylesheet_tag }}

   

3. Select Save.

---

 

Step 3: Edit theme.liquid

1. Under Layout, select theme.liquid.

2. Copy and paste this code directly under the content_for_header:

   {%- include 'bold-product' with product, hide_action: 'header' -%}
   {%- include 'bold-common' -%}
   {%- include 'bold-common' -%}

   

3. Select Save.

---

 

Step 4: Edit main-product.liquid

1. Under Sections, select main-product.liquid.

2. Copy and paste this code outside of the first product form:

   {%- render 'shappify-bdl-load-bundle' -%}

   

3. Select Save.

---

 

Step 5: Edit main-cart-items.liquid

1. Under Sections, select main-cart-items.liquid.

2. In the else condition of the second statement:

   {%- if item.original_line_price != item.final_line_price -%}

   replace:

   <span class="price price--end">
   {{ item.original_line_price | money }}
   </span>

   with:

   <div class="money" data-line-index="{{ forloop.index0 }}" data-line-total>
   {{ bold_item_line_price | money }}
   </div>

3. Select Save.

---

 

Step 6: Edit main-cart-footer.liquid

1. Under Sections, select main-cart-footer.liquid.

2. Find the code that looks like:

   {{%- cart.total_price | money_with_currency }}

3. Copy and paste this code directly before that line:

   <span class="Bold-theme-hook-DO-NOT-DELETE bold_cart_total" style="display:none !important;"></span>

   

4. Find the <noscript> code snippet:

   <noscript> 
   <button type="submit" class="cart__update-button button button--secondary" form="cart"> 
   {{ 'sections.cart.update' | t }} 
   </button> 
   </noscript>

   and replace it with the following:

   <noscript></noscript>
   <div></div> <!-- Override the Shopify 2.0 theme .cart__ctas>:not(noscript:first-child)+ script -->
   <button type="submit" class="cart__update-button button button--secondary" form="cart">
   {{ 'sections.cart.update' | t }}
   </button>

5. Select Save.

This installation allows the bundles to appear on the product page and discount correctly on the product, cart and checkout page.

Step 1: Add Snippet and Asset Files

1. Duplicate themes to create a backup copy.
2. From the Shopify admin, select Online Store.
3. Select Actions.
4. Select Edit code.
5. Under Snippets and Assets, find these files:
   • bold-pr.liquid.liquid
   • bold-common.liquid
   • bold-includes.liquid
   • shappify-bdl-load-bundle.liquid
   • bold-bundles.css
6. For any that don't exist:
   1. Select Add a new snippet or Add a new asset.
   2. Enter the correct snippet or asset name.
   3. Select Create snippet or Create asset.

      

   4. Copy and paste the code found in each of these links into their respective files:

      Note: Liquid files should go into the snippets folder, and CSS files should go into the assets folder.

      • bold-pr.liquid
      • bold-common.liquid
      • bold-includes.liquid
      • shappify-bdl-load-bundle.liquid
      • bold-bundles.css

      

   5. Select Save.
   6. Repeat steps 6.1 – 6.5 for each missing snippet or asset file.

 

---

 

Step 2: Edit bold-includes.liquid

1. Under Snippets, select bold-includes.liquid.

2. Copy and paste this code into the bottom of the file:

    {{ 'bold-bundles.css' | asset_url | stylesheet_tag }}
   {{ 'https://bundles.boldapps.net/js/bundles.js' | script_tag }} 

   

3. Select Save.

---

 

Step 3: Edit theme.liquid

1. Under Layout, select theme.liquid.

2. Copy and paste this code directly under the {{  content_for_header  }}:

   {%- render 'bold-pr' -%}
   {%- render 'bold-common' -%}
   {%- render 'bold-includes' -%}

   

3. Select Save.

---

 

Step 4: Edit main-product.liquid

1. Under Sections, select main-product.liquid.

2. Copy and paste this code outside the first product form:

   {%- render 'shappify-bdl-load-bundle' -%}

   

3. Select Save.

---

 

Step 5: Edit main-cart-items.liquid

1. Under Sections, select main-cart-items.liquid.

2. In the else condition of the second statement:

   {%- if item.original_line_price != item.final_line_price -%}

   replace:

   <span class="price price--end">
   {{ item.original_line_price | money }}
   </span>

   with:

   <div class="money" data-line-index="{{ forloop.index0 }}" data-line-total>
   {{ bold_item_line_price | money }}
   </div>

3. Select Save.

---

 

Step 6: Edit main-cart-footer.liquid

1. Under Sections, select main-cart-footer.liquid.

2. Find the code that looks like:

   {{%- cart.total_price | money_with_currency }}

3. Copy and paste this code directly before that line:

   <span class="Bold-theme-hook-DO-NOT-DELETE bold_cart_total" style="display:none !important;"></span>

   

4. Find the <noscript> code snippet:

   <noscript> 
   <button type="submit" class="cart__update-button button button--secondary" form="cart"> 
   {{ 'sections.cart.update' | t }} 
   </button> 
   </noscript>

   and replace it with the following:

   <noscript></noscript>
   <div></div> <!-- Override the Shopify 2.0 theme .cart__ctas>:not(noscript:first-child)+ script -->
   <button type="submit" class="cart__update-button button button--secondary" form="cart">
   {{ 'sections.cart.update' | t }}
   </button>

5. Select Save.

Step 7: Edit cart-drawer.liquid

1. Under Sections, select cart-drawer.liquid.

2. Find the code that looks like:

   {{ cart.total_price | money_with_currency }}

   and copy and paste this code directly before that line:

   <span class="Bold-theme-hook-DO-NOT-DELETE bold_cart_total" style="display:none !important;"></span>

3. In the else condition of the if statement:

   {%- if item.original_line_price != item.final_line_price -%}

   replace:

   <span class="price price--end">
   {{ item.original_line_price | money }}
   </span>

   with:

   <div class="money" data-line-index="{{ forloop.index0 }}" data-line-total>
   {{ bold_item_line_price | money }}
   </div>

4. Select Save.