diff --git a/erpnext/change_log/current/paranthesis_in_images.md b/erpnext/change_log/current/paranthesis_in_images.md
new file mode 100644
index 0000000000..4859e962f5
--- /dev/null
+++ b/erpnext/change_log/current/paranthesis_in_images.md
@@ -0,0 +1 @@
+- Display images in website's Item and Item List pages when the filename has paranthesis in its name
diff --git a/erpnext/change_log/current/readme.md b/erpnext/change_log/current/readme.md
new file mode 100644
index 0000000000..e93bb75396
--- /dev/null
+++ b/erpnext/change_log/current/readme.md
@@ -0,0 +1,3 @@
+Leave change log files in this folder for user release notes.
+
+(this file is just a place holder, don't delete it)
diff --git a/erpnext/templates/includes/macros.html b/erpnext/templates/includes/macros.html
index aa44a1731b..0967e97138 100644
--- a/erpnext/templates/includes/macros.html
+++ b/erpnext/templates/includes/macros.html
@@ -1,6 +1,6 @@
 {% macro product_image_square(website_image, css_class="") %}
 <div class="product-image product-image-square {% if not website_image -%} missing-image {%- endif %} {{ css_class }}"
-	{% if website_image -%} style="background-image: url({{ website_image }});" {%- endif %}>
+	{% if website_image -%} style="background-image: url('{{ frappe.utils.quoted(website_image) }}');" {%- endif %}>
 	{% if not website_image -%}<i class="centered octicon octicon-device-camera"></i>{%- endif %}
 </div>
 {% endmacro %}
@@ -8,10 +8,9 @@
 {% macro product_image(website_image, css_class="") %}
 <div class="product-image {% if not website_image -%} missing-image {%- endif %} {{ css_class }}">
 	{% if website_image -%}
-		<img src="{{ website_image }}" class="img-responsive">
+		<img src="{{ frappe.utils.quoted(website_image) }}" class="img-responsive">
 	{%- else -%}
 		<i class="centered octicon octicon-device-camera"></i>
 	{%- endif %}
 </div>
 {% endmacro %}
-