How to customize Product Page?

I’m looking to add some constrains when buying products on the website. I want to have a min, max, and step configuration per product. But I don’t know how to modify the product page.

My plan:

Add the (min, max, step) fields to each product. then modify the product and cart page, to make the + - widgets use the field values as constraints.

But I don’t know how to customize the product page properly. Without modifying ERPNext source code.

I see the files I would like to modify are:

apps/erpnext/erpnext/templates/generators/item/item_add_to_cart.html

But modifying this would create problems for an upgrade path in the future.

i haven’t been tried but you might use Website Script

Hey! Thanks, sadly not good enough for what I need. I need to change the template, I wonder is there any way to inherit/expand it or just overwrite it. I’ve tried looking around but no dice.

i haven’t play with webpage yet so sorry to can’t help.

First, create your custom application and install it, then copy the templates from ERPNext / Frappe to your application.

eg:

erpnext/www/all-products/__init__.py -> your_app/www/all-products/__init__.py
erpnext/www/all-products/index.html -> your_app/www/all-products/index.html
erpnext/www/all-products/index.py -> your_app/www/all-products/index.py 
...

Second, add template_apps in your application hook.py, it is the point,

eg:

template_apps = ['your_app', 'erpnext'] # apps order is important

After that, you can modify/overwrite the teamplates.

3 Likes

Hi @SDLyu, i did same and index.html changes are working good, but index.py changes are not getting effect, can you help?

You should bench migrate and bench restart.

i was already trying with bench restart, but now on your suggestion i did bench migrate aswell but no change.

If you have multiple sites in that bench environment then please specify the site when migrate.
bench --site <sitename> migrate (basically this should compile your python files) and a bench restart should make it all effective.

i only have a single site, the other python files are working, but this index.py which i changed some code to override website products attributes is not working.

I can’t think of anything else if it compiles and not working except the code in the file itself.
Can you paste the code in the file.

def get_context(context):

	if frappe.form_dict:
		search = frappe.form_dict.search
		field_filters = frappe.parse_json(frappe.form_dict.field_filters)
		attribute_filters = frappe.parse_json(frappe.form_dict.attribute_filters)
		start = frappe.parse_json(frappe.form_dict.start)
	else:
		search = field_filters = attribute_filters = None
		start = 0

	engine = ProductQuery()
	# context.items = engine.query(attribute_filters, field_filters, search, start)

	# Add homepage as parent
	context.parents = [{"name": frappe._("Home"), "route":"/"}]

	product_settings = get_product_settings()
	filter_engine = ProductFiltersBuilder()

	context.field_filters = filter_engine.get_field_filters()
	context.attribute_filters = filter_engine.get_attribute_fitlers()

	context.product_settings = product_settings
	context.body_class = "product-page"
	context.page_length = product_settings.products_per_page or 20

	context.no_cache = 1

for checking i commented the following line,
context.items = engine.query(attribute_filters, field_filters, search, start)
its supposed not to display items in the product page as i commented the line, but its still displaying.

i think its still reading the code from erpnext/www/all-products/index.py not from my custom app custom_app/www/all-products/index.py

in custom_app’s hooks.py i already added this line,
template_apps = ['custom_app', 'erpnext']
in the result, index.html is working from custom_app, but not index.py