How to Add a Gift Message Option to Your Shopify Checkout Page

Everyone likes surprises. What better surprise than to receive a gift in the mail you weren’t expecting?

Give your customers every option available to make their shopping experience better, such as the option to include a gift message with a purchase. With this option enabled, your customers can send personalized gifts to anyone, anywhere.

Activating the gift message option on your Shopify page is easy – just follow our step-by-step tutorial below.

How to a enable gift messages on your Shopify checkout page:

1. From your Shopify shop’s main admin page, click Online Store.

2. On the Online Store page, select Themes.

3. Click Customize theme.

4. Under the Theme Editor file list, locate and click on Cart Page, which will take you to the cart settings page.
5. On the cart settings page, check “Allow customers to add a note to their order?

 

6. Upon completing the changes, click “Save Changes” on the bottom right of the theme editor. Your customer will now see the option on left side of the checkout page titled “Add a note for the seller.” Clicking on the text “Add a note for the seller” will toggle open/close the form entry field.

Now let’s change the default text from “Add a note for the seller” to something more like “Add a Gift message.”

How to change the default text “Add a note for the seller” at Shopify checkout:

1. From your Shopify shop’s main admin page, select Online Store.

2. On the Online Store page, click Themes.

3. Click Edit HTML/CSS.

4. Under the Templates file list, locate and click on cart.liquid to open the online code editor.

5. In the cart.liquid file, search for the text “Add a note for the seller” and replace it with “Add a gift message” or anything else you may like.

6. Upon completing the changes, click Save on the top right of the code editor. You can also click preview on the top right the page to make sure the changes are displaying correctly at checkout.

7. Once you’re done, it should look like the sample below. The actual page may vary slightly based on the Shopify theme you are using.

Additional Customizations:
For those that are code-savvy, there are additional customizations that you can do to the cart.liquid file (or main CSS display file), such as always displaying the form entry field, putting the form entry field beneath the text instead of to the right, or displaying text in the form entry field (ex., Maximum 140 characters).

See sample code below of the setup that we used in our test store. The image below is the checkout page with the sample code.

<div id=”checkout-addnote”>
<label for=”note” style=”display: block;”> Add a Gift Message to the Packing Slip:</label>
<textarea id=”note” name=”note” placeholder=”Maximum 140 characters” class=”hide” style=”display:block”>{{ cart.note }}</textarea>
</div>

 

Fulfillrite customers: If you would like to activate the option to import gift messages to your packing slip, go to the following in your web portal: Settings/Integrations/Shopify Once you are there, select the option to “import order note field as a gift message.”

NOTE: The max character limit we allow in the gift message field is 140 characters. (Like twitter!)

If you have any questions, feel free to give us a call or email us at support@fulfillrite.com

Comments

No comments yet. You can be the first!