How can I change the font on my order printer?

Store Design
,

Topic summary

Changing the font of gift messages in Shopify’s Order Printer and adjusting message placement on the page. A screenshot was shared for context.

  • A workaround was found: wrap the gift message output in a container (e.g., a GiftMessage class) and apply CSS to that class to set font-family (e.g., “Caveat”), size, weight, line-height, and spacing. The code is placed directly in the Order Printer template alongside the HTML/Liquid.

  • The Liquid template loops through line_items and their properties, skipping blank or underscore-prefixed properties, and renders uploads as images; other values are printed as text. Properties may differ by theme.

  • Print size and vertical positioning (moving messages higher on the page) remain unresolved; it may be printer-related. No definitive guidance on page layout beyond CSS adjustments was provided.

  • Another participant confirmed the CSS-class approach worked after other attempts (e.g., styling heading tags) failed.

Status: Font customization via CSS in the template is resolved; print size and exact page positioning are still open. Code snippet is central to the solution.

Summarized with AI on January 11. AI used: gpt-5.
1

I have tried looking up solutions to this simple question but I haven’t had much at finding anything that provides a solution.

At the moment, I can print out gift messages with Shopify’s Order printer.

But is there a way to change the font so that it doesn’t look so plain?

Currently it looks like below:

Screenshot 2023-11-10 140423.png
Screenshot 2023-11-10 140423.png1192×657 15.7 KB

Also, if anyone knows how to move the messages slightly higher that would be great. At the moment it prints roughly about the middle and continues down and/or to the next page. Or would this be more printer related?

2

Have you found any solutions yet?

3

I have actually. Had to go about it in an odd way, but the best way I found out to get it working was to set up classes for it. I still have to figure out how to set up the printing size, but at least the font works..See below for what I did to get it working.

{% for line_item in line_items %} {% for p in line_item.properties %} {% assign property_first_char = p.first | slice: 0 %} {% unless p.last == blank or property_first_char == '_' %}
{% if p.last contains '/uploads/' %}
{% else %} {{ p.last }} {% endif %}
{% endunless %} {% endfor %} {% endfor %}

.GiftMessage * {
font-family: “Caveat”;
font-size: 14px;
font-weight: 300;
line-height: 18px;
box-sizing: border-box;
margin: auto;
padding: 0px 0px 30px 0px;
min-height: 0px;
max-height: 300px;
}

There’s prolly redundant code in there, but if someone would help clean it up, it would be appreciated.

4

Keep in mind the properties may vary depending on your own theme.

5

Oooooh… I have addressed the h1…2 tags so many other ways and it did not work, I still don’t understand how could I miss this trivial solution. :grinning_face_with_smiling_eyes: Thanks!