Ask customer for additional information

From Shopify Wiki

Jump to: navigation, search

When you update the content of a cart or click the checkout button on a standard Shopify cart.liquid page Shopify will look for two special parameters called simply note and attributes

Free text note

Note is the primary one and the simplest to use.

Imagine you are running a gift shop and you want to ask your customers for a Gift message to be included in the package. Add following html/liquid code to your cart.liquid before the </form> tag:

<p>
  <label for="note">Gift note:</label><br/>
  <textarea name="note" id="note" rows="3" cols="60">{{cart.note}}</textarea>
</p>

Image:gift-note.png

This order, after its placed and paid, will display the note in the Shopify admin

Image:gift-order.png

Attributes

Attributes let you attach any value to an order by choosing a name for it. They are very useful for creating more complex forms with checkboxes, drop-downs or even hidden fields which just attach the browser version or operating system of the client to the order.

You choose the name in the html name property using attributes[name] style syntax like

<input type="checkbox" name="attributes[wrapping]" id="wrapping" value="yes" />

For our example, lets ask the customer if he wants his products gift wrapped:

<p>
  <input type="checkbox" name="attributes[wrapping]" id="wrapping" value="yes" {% if cart.attributes.wrapping %} checked="checked"{% endif %} />
  <label for="wrapping">Please wrap the products in this order</label>
</p>

Image:gift-wrapping-note.png

This order, after its placed and paid, will display the note in the Shopify admin

Image:gift-wrapping-order.png

You can add as many attributes as you like as long as you choose unique names ( between the brackets ).

Another Example for Attach Notes

for a shop that sells conference tickets (with the product standing for the conference, and variants standing for attendance time, e.g. 'Full time', 'Saturday', 'Sunday')

{% for item in cart.items %}

  {% for i in (1..item.quantity) %}
 
  <h4>{{ item.variant.title }}</h4>
  
  <dl>
    <dt>Name you wish to appear on your badge:</dt>
    <dd><input type="text" name="attributes[{{ item.variant.title }} Attendee Badge]" value="" id="badge"></dd>
  </dl>

  {% endfor %}

{% endfor %}
Personal tools