Blog
Understanding how customers discover your store is essential for evaluating your marketing efforts and customer journey. Adding a "How Did You Hear About Us" survey to your Shopify cart page can provide valuable insights. Whether your customers find you through social media, word-of-mouth, or advertisements, knowing these details can help you refine your strategy and boost your store's performance. Many businesses benefit from this approach, and your Shopify store can too.
Why Not Add the Survey to the Checkout Page?
Shopify limits customizations on the checkout page, making it impossible to include fields like surveys there. However, don’t worry—there’s an effective alternative. By leveraging cart attributes on the cart page, you can still gather this data effortlessly before the purchase is completed.
Why the Cart Page Works
Cart attributes in Shopify enable you to collect additional details from customers during the checkout process. Adding a survey to the cart page seamlessly captures responses, attaches them to the order, and provides valuable insights. This approach integrates smoothly into the shopping experience, giving you a better understanding of your audience without adding friction.
How to Set Up Your Survey
Before making any code modifications, always ensure you create a copy of the theme first. Test all your changes on this copy to confirm everything works perfectly before publishing it to the live theme. This precaution helps prevent any issues from affecting your main theme and keeps your work safe.
Follow these simple steps to incorporate a "How Did You Hear About Us" survey into your cart page:
Step 1: Edit the Main Cart Item Liquid File
Go to your Shopify admin and access the theme code editor.
Open the sections/main-cart-items.liquid file.
Add below code to the form element.
<p class="cart-attribute__field"> <label class="labelForHearUs">How did you hear about us?</label><br> <select required class="required" id="how-to-add-how-you-hear-about-us-using-cart-attributes" name="attributes[How did you hear about us?]"> <option value="Social Media"{% if cart.attributes["How did you hear about us?"] == "Social Media" %} selected{% endif %}>Social Media</option> <option value="Friend Recommendation"{% if cart.attributes["How did you hear about us?"] == "Friend Recommendation" %} selected{% endif %}>Friend Recommendation</option> <option value="Search Engine"{% if cart.attributes["How did you hear about us?"] == "Search Engine" %} selected{% endif %}>Search Engine</option> <option value="Email Marketing"{% if cart.attributes["How did you hear about us?"] == "Email Marketing" %} selected{% endif %}>Email Marketing</option> <option value="Other"{% if cart.attributes["How did you hear about us?"] == "Other" %} selected{% endif %}>Other</option> </select> </p>
Step 2: Add the Style
Add some style in the same file
#how-to-add-how-you-hear-about-us-using-cart-attributes { height: 45px; } @media (min-width:992px) { #how-to-add-how-you-hear-about-us-using-cart-attributes { width: 30% } } @media (max-width: 992px) { #how-to-add-how-you-hear-about-us-using-cart-attributes { width: 100% } }
Step 3: Edit the Carts JS file
Open the assets/cart.js file.
Update the onChange function with below code.
onChange(event) { // console.log('event.target.type', event.target.type); if(event.target.type == 'number') { this.validateQuantity(event); } }
Step 4: Enable Cart Note
Navigate to the theme editor.
In theme settings, locate the Cart tab. Enable cart note and set cart type to Page.
Your survey is now live on the cart page, ready to collect responses.
Final Thoughts
Implementing a "How Did You Hear About Us" survey on your cart page is simple and brings meaningful results. You gain insights into customer behavior, helping you make informed decisions to drive growth. Try it today and unlock new opportunities for understanding your audience better.
For any questions or further assistance, please don't hesitate to reach out. Simply leave us a message, and we will respond to you as soon as possible. We're here to help and look forward to working with you!