Cacher is the code snippet organizer for pro developers

{% assign bold_compare_prods = cart.attributes.bold_compare_products | split: "," |uniq %}
{% assign compare_products_count = bold_compare_prods | size %}
{% if compare_products_count < 1 %}
<h2> There are no Products to Compare!</h2>
{% break %}
{% endif %}
<div id="page" class="row">

	<script>
		document.write('<h2>'+BOLD.Compare.language.compare_title+'</h2>');
	</script>

	{% assign bold_metafields_keys = ""%}
	{% for bold_prod in bold_compare_prods %}
	{% assign bold_compare_metafields = all_products[bold_prod].metafields.bold_spec %}
	{% for spec in bold_compare_metafields %}
	{% capture bold_metafields_keys %}
	{{bold_metafields_keys}}~~{{spec.first}}
	{% endcapture %}
	{% endfor %}
	{% endfor %}

	{% assign bold_metafields_keys = bold_metafields_keys | remove_first:"~~" |split: "~~" | uniq  %}

	{% assign bold_table_cell_width = bold_compare_prods | size | plus:1 %}
	<table class="bold_compare_table" cellspacing="0" cellpadding="0">
		<tbody>

		<tr class="row-product-thumb">
			<th class="cell-blank cell-first" style="width:{{ 100 | divided_by: bold_table_cell_width }}%;">&nbsp;</th>
			{% for bold_prod in bold_compare_prods %}
			<td class="text-center" style="width:{{ 100 | divided_by: bold_table_cell_width }}%;">
				<div class="prod-image">
					<a id="compare_image" href="{{all_products[bold_prod].url}}"> <img src="{% if all_products[bold_prod].images.size >= 1%}{{ all_products[bold_prod].featured_image | product_img_url: 'large' }}{% else %}{{ 'no-image.gif' | img_url: 'large' }}{% endif %}" alt="{{all_products[bold_prod].title| escape }}" class="img_{{all_products[bold_prod].handle}}"></a>
					<div class="thumb-title"> <a href="{{all_products[bold_prod].url}}">{{all_products[bold_prod].title}}</a></div>
				</div>
			</td>
			{% endfor %}
		<tr class="row-product-price hover">
			<th class="cell-price">Price</th>
			{% for bold_prod in bold_compare_prods %}
			<td>
				{{all_products[bold_prod].price | money}}
			</td>

			{% endfor %}
		</tr>
		{% for value in bold_metafields_keys %}
		{% assign spec_key = value | strip%}
		<tr class="row-product-specs hover">
			<th>
				{{spec_key}}
			</th>
			{% for bold_prod in bold_compare_prods %}
			<td>
				{% assign bold_spec_data = all_products[bold_prod].metafields.bold_spec %}
				{% if bold_spec_data[spec_key] == blank %}
				N/A
				{% else %}
				{{bold_spec_data[spec_key]}}
				{% endif %}

			</td>
			{% endfor %}

		</tr>

		{% endfor %}

		<tr>
			<th>Buy Now</th>
			{% for bold_prod in bold_compare_prods %}
			<td><a class="btn" href="{{all_products[bold_prod].url}}"><script>document.write(BOLD.Compare.language.compare_button);</script></a></td>
			{% endfor %}
		</tr>

		<tr>
			<th></th>
			{% for bold_prod in bold_compare_prods %}
			<td>
				<a href="#" data-product-id="{{all_products[bold_prod].id}}" data-product-handle="{{all_products[bold_prod].handle}}" class="bold_compare_remove"><script>document.write(BOLD.Compare.language.compare_remove_text)</script></a>
			</td>
			{% endfor %}
		</tr>

		</tbody>
	</table>

</div>