diff --git a/erpnext/portal/product_configurator/utils.py b/erpnext/portal/product_configurator/utils.py
index d77eb2c3966..211b94a9cfd 100644
--- a/erpnext/portal/product_configurator/utils.py
+++ b/erpnext/portal/product_configurator/utils.py
@@ -2,6 +2,7 @@ import frappe
 from frappe.utils import cint
 from erpnext.portal.product_configurator.item_variants_cache import ItemVariantsCacheManager
 from erpnext.shopping_cart.product_info import get_product_info_for_website
+from erpnext.setup.doctype.item_group.item_group import get_child_groups
 
 def get_field_filter_data():
 	product_settings = get_product_settings()
@@ -89,6 +90,7 @@ def get_products_for_website(field_filters=None, attribute_filters=None, search=
 def get_products_html_for_website(field_filters=None, attribute_filters=None):
 	field_filters = frappe.parse_json(field_filters)
 	attribute_filters = frappe.parse_json(attribute_filters)
+	set_item_group_filters(field_filters)
 
 	items = get_products_for_website(field_filters, attribute_filters)
 	html = ''.join(get_html_for_items(items))
@@ -98,6 +100,10 @@ def get_products_html_for_website(field_filters=None, attribute_filters=None):
 
 	return html
 
+def set_item_group_filters(field_filters):
+	if 'item_group' in field_filters:
+		field_filters['item_group'] = [ig[0] for ig in get_child_groups(field_filters['item_group'])]
+
 
 def get_item_codes_by_attributes(attribute_filters, template_item_code=None):
 	items = []
diff --git a/erpnext/setup/doctype/item_group/item_group.py b/erpnext/setup/doctype/item_group/item_group.py
index 1c72cebfa9d..5fcad00af16 100644
--- a/erpnext/setup/doctype/item_group/item_group.py
+++ b/erpnext/setup/doctype/item_group/item_group.py
@@ -87,8 +87,8 @@ class ItemGroup(NestedSet, WebsiteGenerator):
 		if not field_filters:
 			field_filters = {}
 
-		# Ensure the query remains within current item group
-		field_filters['item_group'] = self.name
+		# Ensure the query remains within current item group & sub group
+		field_filters['item_group'] = [ig[0] for ig in get_child_groups(self.name)]
 
 		engine = ProductQuery()
 		context.items = engine.query(attribute_filters, field_filters, search, start, item_group=self.name)
diff --git a/erpnext/templates/generators/item_group.html b/erpnext/templates/generators/item_group.html
index 393c3a43afb..95eb8f493f6 100644
--- a/erpnext/templates/generators/item_group.html
+++ b/erpnext/templates/generators/item_group.html
@@ -9,7 +9,7 @@
 {% endblock %}
 
 {% block page_content %}
-<div class="item-group-content" itemscope itemtype="http://schema.org/Product">
+<div class="item-group-content" itemscope itemtype="http://schema.org/Product" data-item-group="{{ name }}">
 	<div class="item-group-slideshow">
 		{% if slideshow %}<!-- slideshow -->
 			{{ web_block(
diff --git a/erpnext/www/all-products/index.js b/erpnext/www/all-products/index.js
index 0721056816b..1c641b59ad1 100644
--- a/erpnext/www/all-products/index.js
+++ b/erpnext/www/all-products/index.js
@@ -124,6 +124,10 @@ $(() => {
 				attribute_filters: if_key_exists(attribute_filters)
 			};
 
+			const item_group = $(".item-group-content").data('item-group');
+			if (item_group) {
+				Object.assign(field_filters, { item_group });
+			}
 			return new Promise((resolve, reject) => {
 				frappe.call('erpnext.portal.product_configurator.utils.get_products_html_for_website', args)
 					.then(r => {