Gift Message: Adjusting Font Size Based on Character Length

Background: Giftship provides a robust order printing template engine that allows you to create templates for various purposes, such as packing slips, invoices, and gift messages.

These templates can be customized to meet your specific needs. To learn more about creating custom order print templates, please refer to our documentation: Custom Order Printer Templates.

In some cases, customers may leave lengthy gift messages, and it’s essential to adjust the font size to ensure that these messages are fully included in the PDF and not cut off during printing. To address this, we have developed custom Shopify Liquid conditional statements that can be tailored to your requirements.

Here are the steps to change the font size depending on the character length:

1. Create a New Order Template:
   Follow the instructions provided in the link above to create a new order template that includes gift messages.
   
2. Create an HTML Block:
   Within your order template, create an HTML block and paste the following code:

Message Snippet:

{% for attribute in order.note_attributes %}
  {% if attribute.first == 'Message' or attribute.first == 'Gift Message' %}
    {% assign length = attribute.last | size | plus: 0 %}
    {% if length <= 200 %}
      <p style="font-size:12px;">{{ attribute.last }}</p>
    {% else %}
      <p style="font-size:10px;">{{ attribute.last }}</p>
    {% endif %}
  {% endif %}
{% endfor %}

This code dynamically adjusts the font size of the gift message based on its character length. Messages with 200 characters or less will be displayed with a font size of 12px, while longer messages will be displayed with a font size of 10px.

TO Snippet:

{% for attribute in order.note_attributes %}
  {% if attribute.first == 'To' %}
    <p>{{ attribute.last }},</p>
  {% endif %}
{% endfor %}

From Snippet:

{% for attribute in order.note_attributes %}
  {% if attribute.first == 'From' %}
    <p>{{ attribute.last }}</p>
  {% endif %}
{% endfor %}

These additional code sections allow you to display the “To” and “From” information from your gift messages, ensuring a personalized touch to your printed messages.

By following these steps, you can ensure that your gift messages are printed with an appropriate font size, accommodating messages of varying lengths while maintaining a professional appearance.