Quickview Installation

The quickview feature of Best Custom Product Options is an experimental feature meant for store or theme developers looking to add custom options to their collection pages. There are three steps to implement it.

Go to theme.liquid and replace the bcpo_product code that was added there with this code.

<script>var bcpo_product={% if product %}{{product | json}}{% elsif collection.products %}{{collection.products | json}}{% endif %}; {% if product.metafields.bcpo.bcpo_data %}var bcpo_data={{ product.metafields.bcpo.bcpo_data }};{% endif %} {% if shop.metafields.bcpo.bcpo_settings %}var bcpo_settings={{ shop.metafields.bcpo.bcpo_settings }};{% endif %}</script>

Then find the place in one of your theme templates or snippets where the collection item markup is found. Here you can paste the following html element.

<!-- BCPO Quickview -->
<div class="bcpo-quickview bcpo-quickview-{{product.id}}"></div>