How to make a cart note mandatory in Dawn 2.0 theme?

Store Design
1

I’ve searched around looking for a solution on this and haven’t been able to find one that fits my issue. I’m looking at getting the cart note to be mandatory on the site before the end user can complete the transaction in the checkout.

In addition to this I would like to change the name of the cart note from ‘Order special instructions’ to ‘Project Number’.

Site address is https://wileysignage.com.au/

Password is WileySignage22!

1 Like
2

@groundsy04

yes, please share cart page code so i will update

3

Hi @KetanKumar here’s the coding from main-cart-items.liquid

{{ ‘component-cart.css’ | asset_url | stylesheet_tag }}
{{ ‘component-totals.css’ | asset_url | stylesheet_tag }}
{{ ‘component-price.css’ | asset_url | stylesheet_tag }}
{{ ‘component-discounts.css’ | asset_url | stylesheet_tag }}
{{ ‘component-loading-overlay.css’ | asset_url | stylesheet_tag }}

{{ 'sections.cart.title' | t }}

{{ 'general.continue_shopping' | t }}

{{ 'sections.cart.empty' | t }}

{{ 'general.continue_shopping' | t }}

{%- if shop.customer_accounts_enabled -%}

{{ 'sections.cart.login.title' | t }}

{{ 'sections.cart.login.paragraph_html' | t: link: routes.account_login_url }}

{%- endif -%}
{%- if cart != empty -%} {%- for item in cart.items -%} {%- endfor -%}
{{ 'sections.cart.headings.product' | t }} {{ 'sections.cart.headings.total' | t }} {{ 'sections.cart.headings.quantity' | t }} {{ 'sections.cart.headings.total' | t }}
{% if item.image %} {% comment %} Leave empty space due to a:empty CSS display: none rule {% endcomment %} {{ item.image.alt | escape }} {% endif %} {%- if section.settings.show_vendor -%}

{{ item.product.vendor }}

{%- endif -%}

{{ item.product.title | escape }}

{%- if item.original_price != item.final_price -%}

{{ 'products.product.price.regular_price' | t }} {{- item.original_price | money -}} {{ 'products.product.price.sale_price' | t }} {{ item.final_price | money }}
{%- else -%}
{{ item.original_price | money }}
{%- endif -%}

{%- if item.product.has_only_default_variant == false or item.properties.size != 0 or item.selling_plan_allocation != nil -%}

{%- if item.product.has_only_default_variant == false -%} {%- for option in item.options_with_values -%}
{{ option.name }}:
{{ option.value }}
{%- endfor -%} {%- endif -%}

{%- for property in item.properties -%}
{%- assign property_first_char = property.first | slice: 0 -%}
{%- if property.last != blank and property_first_char != ‘_’ -%}

{{ property.first }}:
{%- if property.last contains '/uploads/' -%} {{ property.last | split: '/' | last }} {%- else -%} {{ property.last }} {%- endif -%}
{%- endif -%} {%- endfor -%}

{{ item.selling_plan_allocation.selling_plan.name }}

{%- endif -%}
    {%- for discount in item.discounts -%}
  • {%- render 'icon-discount' -%} {{ discount.title }}
    • {%- endfor -%}
{%- if item.original_line_price != item.final_line_price -%}
{{ 'products.product.price.regular_price' | t }}
{{ item.original_line_price | money }}
{{ 'products.product.price.sale_price' | t }}
{{ item.final_line_price | money }}
{%- else -%} {{ item.original_line_price | money }} {%- endif -%}

{%- if item.variant.available and item.unit_price_measurement -%}

{{ 'products.product.price.unit_price' | t }} {{ item.variant.unit_price | money }} /  {{ 'accessibility.unit_price_separator' | t }}  {%- if item.variant.unit_price_measurement.reference_value != 1 -%} {{- item.variant.unit_price_measurement.reference_value -}} {%- endif -%} {{ item.variant.unit_price_measurement.reference_unit }}
{%- endif -%}
{{ 'products.product.quantity.label' | t }} {{ 'products.product.quantity.decrease' | t: product: item.product.title | escape }} {% render 'icon-minus' %} {{ 'products.product.quantity.increase' | t: product: item.product.title | escape }} {% render 'icon-plus' %} {% render 'icon-remove' %}
{%- if item.original_line_price != item.final_line_price -%}
{{ 'products.product.price.regular_price' | t }}
{{ item.original_line_price | money }}
{{ 'products.product.price.sale_price' | t }}
{{ item.final_line_price | money }}
{%- else -%} {{ item.original_line_price | money }} {%- endif -%}

{%- if item.variant.available and item.unit_price_measurement -%}

{{ 'products.product.price.unit_price' | t }} {{ item.variant.unit_price | money }} /  {{ 'accessibility.unit_price_separator' | t }}  {%- if item.variant.unit_price_measurement.reference_value != 1 -%} {{- item.variant.unit_price_measurement.reference_value -}} {%- endif -%} {{ item.variant.unit_price_measurement.reference_unit }}
{%- endif -%}
{%- endif -%}

{% schema %}
{
“name”: “t:sections.main-cart-items.name”,
“settings”: [
{
“type”: “checkbox”,
“id”: “show_vendor”,
“default”: false,
“label”: “t:sections.main-cart-items.settings.show_vendor.label”
}
]
}
{% endschema %}

4

@groundsy04

thanks but i can’t see cart note code on this file

5

Hi @KetanKumar

I’ve just viewed the source on the cart page and found the ‘Order special instructions’ label text, but when I’m viewing the file main-cart-footer.liquid it gets replaced with:

{{ ‘sections.cart.note’ | t }}

{{ cart.note }}

Code for main-cart-footer.liquid below:

{{ ‘component-cart.css’ | asset_url | stylesheet_tag }}
{{ ‘component-totals.css’ | asset_url | stylesheet_tag }}
{{ ‘component-price.css’ | asset_url | stylesheet_tag }}
{{ ‘component-discounts.css’ | asset_url | stylesheet_tag }}

{%- if section.settings.show_cart_note -%} {{ 'sections.cart.note' | t }} {{ cart.note }} {%- endif -%}
{% for block in section.blocks %} {%- case block.type -%} {%- when '@app' -%} {% render block %} {%- when 'subtotal' -%}

{{ 'sections.cart.subtotal' | t }}

{{ cart.total_price | money_with_currency }}

{%- if cart.cart_level_discount_applications.size > 0 -%}
    {%- for discount in cart.cart_level_discount_applications -%}
  • {%- render 'icon-discount' -%} {{ discount.title }} (-{{ discount.total_allocated_amount | money }})
    • {%- endfor -%}
{%- endif -%}
{%- if cart.taxes_included and shop.shipping_policy.body != blank -%} {{ 'sections.cart.taxes_included_and_shipping_policy_html' | t: link: shop.shipping_policy.url }} {%- elsif cart.taxes_included -%} {{ 'sections.cart.taxes_included_but_shipping_at_checkout' | t }} {%- elsif shop.shipping_policy.body != blank -%} {{ 'sections.cart.taxes_and_shipping_policy_at_checkout_html' | t: link: shop.shipping_policy.url }} {%- else -%} {{ 'sections.cart.taxes_and_shipping_at_checkout' | t }} {%- endif -%}
{%- else -%}
{{ 'sections.cart.update' | t }}

<button type=“submit” id=“checkout” class=“cart__checkout-button button” name=“checkout”{% if cart == empty %} disabled{% endif %} form=“cart”>
{{ ‘sections.cart.checkout’ | t }}

{%- if additional_checkout_buttons -%}

{{ content_for_additional_checkout_buttons }}
{%- endif -%} {%- endcase -%} {% endfor %}

{% javascript %}
class CartNote extends HTMLElement {
constructor() {
super();

this.addEventListener(‘change’, debounce((event) => {
const body = JSON.stringify({ note: event.target.value });
fetch(${routes.cart_update_url}, {…fetchConfig(), …{ body }});
}, 300))
}
}

customElements.define(‘cart-note’, CartNote);
{% endjavascript %}

{% schema %}
{
“name”: “t:sections.main-cart-footer.name”,
“class”: “cart__footer-wrapper”,
“settings”: [
{
“type”: “checkbox”,
“id”: “show_cart_note”,
“default”: false,
“label”: “t:sections.main-cart-footer.settings.show_cart_note.label”
}
],
“blocks”: [
{
“type”: “subtotal”,
“name”: “t:sections.main-cart-footer.blocks.subtotal.name”,
“limit”: 1
},
{
“type”: “buttons”,
“name”: “t:sections.main-cart-footer.blocks.buttons.name”,
“limit”: 1
},
{
“type”: “@app”
}
]
}
{% endschema %}

6

@groundsy04

yes i can check its already update code

7

Hi @KetanKumar

Is there a way to make the cart note mandatory?

8

@groundsy04

yes, its already mandatory if doesn’t work so it can be done other customization code