null

Identify which products bought together belong to the main product in Supermarket theme

Solution:

Create a product option named Parent SKU:

Edit the option set of your also bought together products and add Parent SKU option to option set. Set Required = No:

Make sure your also bought together products has Parent SKU field:

Now, view a product which has the also bought together products from store front. Verify it has Parent SKU option:

Create a new script in Storefront > Script Manager, insert the code below:

<script>

(function($) {

$('body').on('change', '[data-also-bought-checkbox]', function() {

var $sku = $('.productView [data-also-bought-parent-scope] [data-product-sku]');

$('[data-product-attribute="input-text"]').each(function(i, el) {

var $el = $(el);

if ($el.find('label').text().trim().toLowerCase() === 'parent sku:') {

$el.find('input').val($sku.text().trim());

$el.hide();

}

});

});

})(jQuerySupermarket || jQuery);

</script>

Now view your product page again, you will see that Parent SKU field is hidden:

Add the main product and the also bought product to cart, you will see Parent SKU appear as same as the main product SKU:

This option field also appears on invoices, orders history and so on.

9th Sep 2019 Papathemes

Theme design & customization blog

  • Auto update quantity of products bought together according to the main product qty in Supermarket theme

    Insert the code below to Storefront > Script Manager:

© PapaThemes. Powered by BigCommerce.

Did you know?

Free Trial for all our BigCommerce themes.

Request Now

Need help? Don't hesitate to ask us. We'll reply shortly.

All our BigCommerce themes are 100% compatible with the Standard, Pro, Enterpise edition. Built with Stencil / Cornerstone framework.